Added split view

lib/screens/clients/client/logs_list_client.dart

@@ -237,7 +237,8 @@ class _LogsListClientState extends State<LogsListClient> {
                                 context: context, 
                                 builder: (context) => LogDetailsScreen(
                                   log: log, 
-                                  dialog: true
+                                  dialog: true,
+                                  twoColumns: widget.splitView,
                                 )
                               )
                             }
@@ -246,7 +247,8 @@ class _LogsListClientState extends State<LogsListClient> {
                                 MaterialPageRoute(
                                   builder: (context) => LogDetailsScreen(
                                     log: log, 
-                                    dialog: false
+                                    dialog: false,
+                                    twoColumns: widget.splitView,
                                   )
                                 )
                               )

lib/screens/logs/details/log_details_screen.dart

@@ -1,6 +1,5 @@
 // ignore_for_file: use_build_context_synchronously
 
-import 'package:adguard_home_manager/functions/copy_clipboard.dart';
 import 'package:flutter/material.dart';
 import 'package:provider/provider.dart';
 import 'package:flutter_gen/gen_l10n/app_localizations.dart';
@@ -11,6 +10,7 @@ import 'package:adguard_home_manager/screens/logs/details/log_list_tile.dart';
 
 import 'package:adguard_home_manager/functions/desktop_mode.dart';
 import 'package:adguard_home_manager/functions/open_url.dart';
+import 'package:adguard_home_manager/functions/copy_clipboard.dart';
 import 'package:adguard_home_manager/constants/urls.dart';
 import 'package:adguard_home_manager/classes/process_modal.dart';
 import 'package:adguard_home_manager/functions/get_filtered_status.dart';
@@ -24,11 +24,13 @@ import 'package:adguard_home_manager/providers/app_config_provider.dart';
 class LogDetailsScreen extends StatelessWidget {
   final Log log;
   final bool dialog;
+  final bool twoColumns;
 
   const LogDetailsScreen({
     super.key,
     required this.log,
-    required this.dialog
+    required this.dialog,
+    required this.twoColumns,
   });
 
   @override
@@ -137,6 +139,7 @@ class LogDetailsScreen extends StatelessWidget {
       );
     }
     else {
+      print(twoColumns);
       return Scaffold(
         body: NestedScrollView(
           headerSliverBuilder: (context, innerBoxIsScrolled) => [
@@ -148,6 +151,7 @@ class LogDetailsScreen extends StatelessWidget {
                 centerTitle: false,
                 forceElevated: innerBoxIsScrolled,
                 surfaceTintColor: isDesktop(width) ? Colors.transparent : null,
+                automaticallyImplyLeading: twoColumns != true,
                 title:  Text(AppLocalizations.of(context)!.logDetails),
                 actions: [
                   IconButton(

lib/screens/logs/live/live_logs_list.dart

@@ -0,0 +1,90 @@
+import 'package:flutter/material.dart';
+import 'package:provider/provider.dart';
+import 'package:flutter_gen/gen_l10n/app_localizations.dart';
+
+import 'package:adguard_home_manager/screens/logs/log_tile.dart';
+import 'package:adguard_home_manager/screens/logs/details/log_details_screen.dart';
+
+import 'package:adguard_home_manager/models/logs.dart';
+import 'package:adguard_home_manager/providers/live_logs_provider.dart';
+
+class LiveLogsList extends StatelessWidget {
+  final Log? selectedLog;
+  final void Function(Log) onLogSelected;
+  final bool twoColumns;
+  
+  const LiveLogsList({
+    super.key, 
+    required this.selectedLog, 
+    required this.onLogSelected, 
+    required this.twoColumns,
+  });
+
+  @override
+  Widget build(BuildContext context) {
+    final liveLogsProvider = Provider.of<LiveLogsProvider>(context);
+
+    return NestedScrollView(
+      headerSliverBuilder: (context, innerBoxIsScrolled) => [
+        SliverOverlapAbsorber(
+          handle: NestedScrollView.sliverOverlapAbsorberHandleFor(context),
+          sliver: SliverAppBar.large(
+            title: Text(AppLocalizations.of(context)!.liveLogs),
+          )
+        )
+      ],
+      body: SafeArea(
+        top: false,
+        bottom: false,
+        child: Builder(
+          builder: (context) => CustomScrollView(
+            slivers: [
+              SliverOverlapInjector(
+                handle: NestedScrollView.sliverOverlapAbsorberHandleFor(context),
+              ),
+              if (liveLogsProvider.logs.isEmpty) SliverFillRemaining(
+                child: Center(
+                  child: Padding(
+                    padding: const EdgeInsets.all(16),
+                    child: Text(
+                      AppLocalizations.of(context)!.hereWillAppearRealtimeLogs,
+                      textAlign: TextAlign.center,
+                      style: TextStyle(
+                        color: Theme.of(context).colorScheme.onSurfaceVariant,
+                        fontSize: 24
+                      ),
+                    ),
+                  ),
+                ),
+              ),
+              if (liveLogsProvider.logs.isNotEmpty) SliverList.builder(
+                itemCount: liveLogsProvider.logs.length,
+                itemBuilder: (context, index) => LogTile(
+                  log: liveLogsProvider.logs[index], 
+                  length: liveLogsProvider.logs.length, 
+                  index: index, 
+                  onLogTap: (log) {
+                    if (!twoColumns) {
+                      Navigator.of(context).push(
+                        MaterialPageRoute(
+                          builder: (context) => LogDetailsScreen(
+                            log: log,
+                            dialog: false,
+                            twoColumns: twoColumns,
+                          )
+                        )
+                      );
+                    }
+                    onLogSelected(log);
+                  },
+                  isLogSelected: selectedLog == liveLogsProvider.logs[index],
+                  twoColumns: twoColumns
+                ),
+              )
+            ],
+          ),
+        ) 
+      )
+    );
+  }
+}

lib/screens/logs/live/live_logs_screen.dart

@@ -3,8 +3,10 @@ import 'package:provider/provider.dart';
 import 'package:flutter_gen/gen_l10n/app_localizations.dart';
 
 import 'package:adguard_home_manager/screens/logs/details/log_details_screen.dart';
+import 'package:adguard_home_manager/screens/logs/live/live_logs_list.dart';
 import 'package:adguard_home_manager/screens/logs/log_tile.dart';
 
+import 'package:adguard_home_manager/models/logs.dart';
 import 'package:adguard_home_manager/providers/live_logs_provider.dart';
 
 class LiveLogsScreen extends StatefulWidget {
@@ -15,6 +17,8 @@ class LiveLogsScreen extends StatefulWidget {
 }
 
 class _LiveLogsScreenState extends State<LiveLogsScreen> {
+  Log? _selectedLog;
+
   @override
   void initState() {
     Provider.of<LiveLogsProvider>(context, listen: false).startFetchLogs();
@@ -24,65 +28,44 @@ class _LiveLogsScreenState extends State<LiveLogsScreen> {
 
   @override
   Widget build(BuildContext context) {
-    final liveLogsProvider = Provider.of<LiveLogsProvider>(context);
-
      return Scaffold(
-      body: NestedScrollView(
+        body: LayoutBuilder(
-        headerSliverBuilder: (context, innerBoxIsScrolled) => [
+        builder: (context, constraints) {
-          SliverOverlapAbsorber(
+          if (constraints.maxWidth > 800) {
-            handle: NestedScrollView.sliverOverlapAbsorberHandleFor(context),
+            return Material(
-            sliver: SliverAppBar.large(
+              color: Colors.transparent,
-              title: Text(AppLocalizations.of(context)!.liveLogs),
+              child: Row(
+                children: [
+                  Expanded(
+                    flex: 2,
+                    child: LiveLogsList(
+                      twoColumns: true,
+                      selectedLog: _selectedLog,
+                      onLogSelected: (log) => setState(() => _selectedLog = log),
                     )
-          )
-        ],
-        body: SafeArea(
-          top: false,
-          bottom: false,
-          child: Builder(
-            builder: (context) => CustomScrollView(
-              slivers: [
-                SliverOverlapInjector(
-                  handle: NestedScrollView.sliverOverlapAbsorberHandleFor(context),
                   ),
-                if (liveLogsProvider.logs.isEmpty) SliverFillRemaining(
+                  Expanded(
-                  child: Center(
+                    flex: 3,
-                    child: Padding(
+                    child: _selectedLog != null
-                      padding: const EdgeInsets.all(16),
+                      ? LogDetailsScreen(
-                      child: Text(
+                          log: _selectedLog!,
-                        AppLocalizations.of(context)!.hereWillAppearRealtimeLogs,
-                        textAlign: TextAlign.center,
-                        style: TextStyle(
-                          color: Theme.of(context).colorScheme.onSurfaceVariant,
-                          fontSize: 24
-                        ),
-                      ),
-                    ),
-                  ),
-                ),
-                if (liveLogsProvider.logs.isNotEmpty) SliverList.builder(
-                  itemCount: liveLogsProvider.logs.length,
-                  itemBuilder: (context, index) => LogTile(
-                    log: liveLogsProvider.logs[index], 
-                    length: liveLogsProvider.logs.length, 
-                    index: index, 
-                    onLogTap: (log) {
-                      Navigator.of(context).push(
-                        MaterialPageRoute(
-                          builder: (context) => LogDetailsScreen(
-                            log: log,
                           dialog: false,
+                          twoColumns: true,
                         )
-                        )
+                      : const SizedBox()
-                      );
-                    },
-                    twoColumns: false
-                  ),
                   )
                 ],
               ),
-          ) 
+            );
-        )
+          }
+          else {
+            return LiveLogsList(
+              twoColumns: false,
+              selectedLog: _selectedLog,
+              onLogSelected: (log) => setState(() => _selectedLog = log),
+            );
+          }
+        },
            ),
      );
   }

lib/screens/logs/logs.dart

@@ -48,6 +48,7 @@ class _LogsState extends State<Logs> {
                     ? LogDetailsScreen(
                         log: _selectedLog!,
                         dialog: false,
+                        twoColumns: true,
                       )
                     : const SizedBox()
                 )

lib/screens/logs/logs_list.dart

@@ -188,6 +188,7 @@ class _LogsListWidgetState extends State<LogsListWidget> {
                                               builder: (context) => LogDetailsScreen(
                                                 log: log,
                                                 dialog: false,
+                                                twoColumns: widget.twoColumns,
                                               )
                                             )
                                           );