feat: Liquid Glass redesign for providers and network check, and tab back navigation (v3.1.3)

2026-09-04 21:29:25 +03:00
parent 5a568a3df9
commit 254f0e3d59
12 changed files with 2802 additions and 337 deletions
@@ -10,7 +10,7 @@ import '../../app/responsive.dart';
 import '../../backend/backend.dart';
 import '../../core/utils/result.dart';

-class AppShell extends ConsumerWidget {
+class AppShell extends ConsumerStatefulWidget {
  const AppShell({required this.child, super.key});

  final Widget child;
@@ -33,69 +33,6 @@ class AppShell extends ConsumerWidget {
    _Destination('settings', 'Settings', Icons.settings_rounded, '/settings'),
  ];

-  @override
-  Widget build(BuildContext context, WidgetRef ref) {
-    final settings =
-        ref.watch(appSettingsProvider).value ?? AppSettings.defaults;
-    final artistConfigs =
-        ref.watch(_enabledArtistConfigsProvider).value ?? const [];
-    final destinations =
-        _visibleDestinations(settings, artistConfigs.isNotEmpty);
-    final ru = settings.languageCode == 'ru';
-    return Shortcuts(
-      shortcuts: {
-        LogicalKeySet(LogicalKeyboardKey.control, LogicalKeyboardKey.keyF):
-            const _NavigateIntent('/search'),
-        LogicalKeySet(LogicalKeyboardKey.escape): const _BackIntent(),
-        LogicalKeySet(LogicalKeyboardKey.digit1): const _NavigateIntent('/'),
-        LogicalKeySet(LogicalKeyboardKey.digit2):
-            const _NavigateIntent('/search'),
-        LogicalKeySet(LogicalKeyboardKey.digit3):
-            const _NavigateIntent('/favorites'),
-        LogicalKeySet(LogicalKeyboardKey.digit4):
-            const _NavigateIntent('/viewed'),
-        LogicalKeySet(LogicalKeyboardKey.digit5):
-            const _NavigateIntent('/collections'),
-        LogicalKeySet(LogicalKeyboardKey.digit6):
-            const _NavigateIntent('/artists'),
-        LogicalKeySet(LogicalKeyboardKey.digit7):
-            const _NavigateIntent('/providers'),
-        LogicalKeySet(LogicalKeyboardKey.digit8):
-            const _NavigateIntent('/settings'),
-      },
-      child: Actions(
-        actions: {
-          _NavigateIntent: CallbackAction<_NavigateIntent>(
-            onInvoke: (intent) {
-              context.go(intent.location);
-              return null;
-            },
-          ),
-          _BackIntent: CallbackAction<_BackIntent>(
-            onInvoke: (_) {
-              if (Navigator.of(context).canPop()) Navigator.of(context).pop();
-              return null;
-            },
-          ),
-        },
-        child: Focus(
-          autofocus: true,
-          child: Responsive.isDesktop(context)
-              ? _DesktopShell(
-                  destinations: destinations,
-                  ru: ru,
-                  child: child,
-                )
-              : _MobileShell(
-                  destinations: destinations,
-                  ru: ru,
-                  child: child,
-                ),
-        ),
-      ),
-    );
-  }
-
  static List<_Destination> _visibleDestinations(
    AppSettings settings,
    bool hasArtists,
@@ -106,6 +43,139 @@ class AppShell extends ConsumerWidget {
      return true;
    }).toList(growable: false);
  }
+
+  @override
+  ConsumerState<AppShell> createState() => _AppShellState();
+}
+
+class _AppShellState extends ConsumerState<AppShell> {
+  final List<String> _tabHistory = [];
+  String? _currentPath;
+  bool _isBackNavigating = false;
+
+  @override
+  void didChangeDependencies() {
+    super.didChangeDependencies();
+    final path = GoRouterState.of(context).uri.path;
+    if (_isBackNavigating) {
+      _isBackNavigating = false;
+      _currentPath = path;
+      return;
+    }
+    if (_currentPath != null && _currentPath != path) {
+      if (path == '/') {
+        _tabHistory.clear();
+      } else {
+        _tabHistory.remove(_currentPath);
+        _tabHistory.add(_currentPath!);
+        if (_tabHistory.length > 25) {
+          _tabHistory.removeAt(0);
+        }
+      }
+    }
+    _currentPath = path;
+  }
+
+  bool _handleBack() {
+    if (Navigator.of(context).canPop()) {
+      Navigator.of(context).pop();
+      return true;
+    }
+
+    final currentPath = GoRouterState.of(context).uri.path;
+    while (_tabHistory.isNotEmpty && _tabHistory.last == currentPath) {
+      _tabHistory.removeLast();
+    }
+
+    if (_tabHistory.isNotEmpty) {
+      final previous = _tabHistory.removeLast();
+      _isBackNavigating = true;
+      context.go(previous);
+      return true;
+    }
+
+    if (currentPath != '/') {
+      _isBackNavigating = true;
+      context.go('/');
+      return true;
+    }
+
+    return false;
+  }
+
+  @override
+  Widget build(BuildContext context) {
+    final settings =
+        ref.watch(appSettingsProvider).value ?? AppSettings.defaults;
+    final artistConfigs =
+        ref.watch(_enabledArtistConfigsProvider).value ?? const [];
+    final destinations =
+        AppShell._visibleDestinations(settings, artistConfigs.isNotEmpty);
+    final ru = settings.languageCode == 'ru';
+
+    return PopScope(
+      canPop: false,
+      onPopInvokedWithResult: (didPop, _) {
+        if (didPop) return;
+        final handled = _handleBack();
+        if (!handled) {
+          SystemNavigator.pop();
+        }
+      },
+      child: Shortcuts(
+        shortcuts: {
+          LogicalKeySet(LogicalKeyboardKey.control, LogicalKeyboardKey.keyF):
+              const _NavigateIntent('/search'),
+          LogicalKeySet(LogicalKeyboardKey.escape): const _BackIntent(),
+          LogicalKeySet(LogicalKeyboardKey.digit1): const _NavigateIntent('/'),
+          LogicalKeySet(LogicalKeyboardKey.digit2):
+              const _NavigateIntent('/search'),
+          LogicalKeySet(LogicalKeyboardKey.digit3):
+              const _NavigateIntent('/favorites'),
+          LogicalKeySet(LogicalKeyboardKey.digit4):
+              const _NavigateIntent('/viewed'),
+          LogicalKeySet(LogicalKeyboardKey.digit5):
+              const _NavigateIntent('/collections'),
+          LogicalKeySet(LogicalKeyboardKey.digit6):
+              const _NavigateIntent('/artists'),
+          LogicalKeySet(LogicalKeyboardKey.digit7):
+              const _NavigateIntent('/providers'),
+          LogicalKeySet(LogicalKeyboardKey.digit8):
+              const _NavigateIntent('/settings'),
+        },
+        child: Actions(
+          actions: {
+            _NavigateIntent: CallbackAction<_NavigateIntent>(
+              onInvoke: (intent) {
+                context.go(intent.location);
+                return null;
+              },
+            ),
+            _BackIntent: CallbackAction<_BackIntent>(
+              onInvoke: (_) {
+                _handleBack();
+                return null;
+              },
+            ),
+          },
+          child: Focus(
+            autofocus: true,
+            child: Responsive.isDesktop(context)
+                ? _DesktopShell(
+                    destinations: destinations,
+                    ru: ru,
+                    child: widget.child,
+                  )
+                : _MobileShell(
+                    destinations: destinations,
+                    ru: ru,
+                    child: widget.child,
+                  ),
+          ),
+        ),
+      ),
+    );
+  }
 }

 class _DesktopShell extends StatefulWidget {
@@ -3,22 +3,91 @@ import 'package:flutter/material.dart';
 import '../../backend/backend.dart';

 class ProviderStatusBadge extends StatelessWidget {
-  const ProviderStatusBadge({required this.health, super.key});
+  const ProviderStatusBadge({
+    required this.health,
+    this.compact = false,
+    super.key,
+  });

  final ProviderHealth? health;
+  final bool compact;

  @override
  Widget build(BuildContext context) {
+    final theme = Theme.of(context);
+    final isDark = theme.brightness == Brightness.dark;
    final status = health?.status ?? ProviderStatus.unknown;
-    final color = switch (status) {
-      ProviderStatus.online => Colors.green,
-      ProviderStatus.offline => Colors.red,
-      ProviderStatus.unknown => Colors.grey,
+
+    final (color, labelRu, labelEn) = switch (status) {
+      ProviderStatus.online => (
+          const Color(0xFF10B981), // Emerald
+          'Онлайн',
+          'Online',
+        ),
+      ProviderStatus.offline => (
+          const Color(0xFFEF4444), // Crimson Red
+          'Офлайн',
+          'Offline',
+        ),
+      ProviderStatus.unknown => (
+          const Color(0xFF94A3B8), // Slate
+          'Не проверен',
+          'Unknown',
+        ),
    };
-    return Chip(
-      avatar: Icon(Icons.circle, color: color, size: 10),
-      label: Text(status.name),
-      visualDensity: VisualDensity.compact,
+
+    final isRu = Localizations.maybeLocaleOf(context)?.languageCode == 'ru';
+    final label = isRu ? labelRu : labelEn;
+
+    return Container(
+      padding: EdgeInsets.symmetric(
+        horizontal: compact ? 8 : 10,
+        vertical: compact ? 3 : 5,
+      ),
+      decoration: BoxDecoration(
+        color: color.withValues(alpha: isDark ? 0.16 : 0.10),
+        borderRadius: BorderRadius.circular(14),
+        border: Border.all(
+          color: color.withValues(alpha: isDark ? 0.45 : 0.32),
+          width: 1.1,
+        ),
+        boxShadow: [
+          BoxShadow(
+            color: color.withValues(alpha: isDark ? 0.18 : 0.08),
+            blurRadius: 6,
+            offset: const Offset(0, 1.5),
+          ),
+        ],
+      ),
+      child: Row(
+        mainAxisSize: MainAxisSize.min,
+        children: [
+          Container(
+            width: 7,
+            height: 7,
+            decoration: BoxDecoration(
+              color: color,
+              shape: BoxShape.circle,
+              boxShadow: [
+                BoxShadow(
+                  color: color.withValues(alpha: 0.8),
+                  blurRadius: 5,
+                  spreadRadius: 0.5,
+                ),
+              ],
+            ),
+          ),
+          const SizedBox(width: 6),
+          Text(
+            label,
+            style: theme.textTheme.labelSmall?.copyWith(
+              color: color,
+              fontWeight: FontWeight.w700,
+              letterSpacing: -0.2,
+            ),
+          ),
+        ],
+      ),
    );
  }
 }