Pause polling and show a banner when the backend is unreachable

Adds a centralized BackendReachability singleton fed by a Dio interceptor (connection-level failures only) and connectivity_plus. PolledValue subscribes to it and pauses on offline / reloads immediately on reconnect, replacing the previous per-card error cascade. MainShell renders a global OfflineBanner with Retry and Settings actions; cards downgrade error→stale when offline so the banner is the only red element. Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>
2026-07-08 19:21:54 +02:00 · 2026-05-31 18:21:55 -04:00
parent 8be65f3ffa
commit b5da90be59
15 changed files with 388 additions and 47 deletions
@@ -0,0 +1,65 @@
+import 'package:flutter/material.dart';
+import 'package:go_router/go_router.dart';
+
+import '../utils/backend_reachability.dart';
+
+class OfflineBanner extends StatelessWidget {
+  const OfflineBanner({super.key});
+
+  @override
+  Widget build(BuildContext context) {
+    final reachability = BackendReachability.instance;
+    return ListenableBuilder(
+      listenable: reachability,
+      builder: (context, _) {
+        if (reachability.isOnline) return const SizedBox.shrink();
+        final theme = Theme.of(context);
+        final message = !reachability.deviceHasNetwork
+            ? 'No network connection.'
+            : reachability.isProbing
+            ? 'Reconnecting to backend…'
+            : reachability.lastErrorMessage ?? 'Cannot reach backend.';
+        return Material(
+          color: theme.colorScheme.errorContainer,
+          child: Padding(
+            padding: const EdgeInsets.symmetric(horizontal: 16, vertical: 8),
+            child: Row(
+              children: [
+                Icon(
+                  Icons.cloud_off,
+                  size: 18,
+                  color: theme.colorScheme.onErrorContainer,
+                ),
+                const SizedBox(width: 12),
+                Expanded(
+                  child: Text(
+                    message,
+                    style: theme.textTheme.bodyMedium?.copyWith(
+                      color: theme.colorScheme.onErrorContainer,
+                    ),
+                  ),
+                ),
+                TextButton(
+                  onPressed: reachability.isProbing
+                      ? null
+                      : () => reachability.probe(),
+                  style: TextButton.styleFrom(
+                    foregroundColor: theme.colorScheme.onErrorContainer,
+                  ),
+                  child: const Text('Retry'),
+                ),
+                TextButton(
+                  onPressed: () => context.go('/settings'),
+                  style: TextButton.styleFrom(
+                    foregroundColor: theme.colorScheme.onErrorContainer,
+                  ),
+                  child: const Text('Settings'),
+                ),
+              ],
+            ),
+          ),
+        );
+      },
+    );
+  }
+}