Refactor frontend: extract widgets and eliminate duplicated scanner state

- Convert ArpScannerCard to a self-managing StatefulWidget (owns its own 5s refresh + 1s tick timers), removing the duplicated state management that existed in both HomeScreen and StatusScreen - Extract NotificationCard to home/notification_card.dart - Extract DeviceSummaryCard (with its 1-min refresh timer) to widgets/device_summary_card.dart - HomeScreen drops from 515 to 253 lines; StatusScreen from 82 to 19 lines Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>
2026-07-08 19:21:54 +02:00 · 2026-05-28 19:23:27 -04:00
parent 251d8a479e
commit f113da9cd0
5 changed files with 322 additions and 362 deletions
@@ -0,0 +1,98 @@
+import 'package:flutter/material.dart';
+import 'package:go_router/go_router.dart';
+
+import '../model/notification.dart' as oott_model;
+import '../utils/friendly_date_formatter.dart';
+
+class NotificationCard extends StatelessWidget {
+  final oott_model.Notification item;
+  final FriendlyDateFormatter formatter;
+  final Future<bool> Function(BuildContext, bool read) onSetRead;
+
+  const NotificationCard({
+    required this.item,
+    required this.formatter,
+    required this.onSetRead,
+    super.key,
+  });
+
+  @override
+  Widget build(BuildContext context) {
+    final theme = Theme.of(context);
+    return Card(
+      color: item.isNew ? theme.colorScheme.secondaryContainer : null,
+      child: Dismissible(
+        key: UniqueKey(),
+        confirmDismiss: (direction) => direction == DismissDirection.startToEnd
+            ? onSetRead(context, false)
+            : onSetRead(context, true),
+        background: Container(
+          color: theme.colorScheme.tertiaryContainer,
+          alignment: Alignment.centerLeft,
+          padding: const EdgeInsets.only(left: 16),
+          child: const Icon(Icons.mark_email_unread),
+        ),
+        secondaryBackground: Container(
+          color: theme.colorScheme.primaryContainer,
+          alignment: Alignment.centerRight,
+          padding: const EdgeInsets.only(right: 16),
+          child: const Icon(Icons.done),
+        ),
+        child: ListTile(
+          leading: Icon(
+            item.notificationType.icon,
+            color: item.isNew ? theme.colorScheme.primary : null,
+          ),
+          title: Text(
+            '${formatter.format(item.createdOn)} - ${item.title}',
+            style: item.isNew
+                ? const TextStyle(fontWeight: FontWeight.bold)
+                : null,
+          ),
+          subtitle: Text(item.body, maxLines: 5),
+          trailing: PopupMenuButton<String>(
+            icon: const Icon(Icons.more_vert),
+            onSelected: (value) async {
+              if (value == 'view_device') {
+                if (item.isNew) await onSetRead(context, true);
+                if (context.mounted) {
+                  context.push('/devices/${item.macAddress}');
+                }
+              } else if (value == 'mark_read') {
+                await onSetRead(context, true);
+              } else if (value == 'mark_new') {
+                await onSetRead(context, false);
+              }
+            },
+            itemBuilder: (context) => [
+              if (item.macAddress != null)
+                const PopupMenuItem(
+                  value: 'view_device',
+                  child: Text('View device'),
+                ),
+              if (item.isNew)
+                const PopupMenuItem(
+                  value: 'mark_read',
+                  child: Text('Mark as read'),
+                ),
+              if (!item.isNew)
+                const PopupMenuItem(
+                  value: 'mark_new',
+                  child: Text('Mark as unread'),
+                ),
+            ],
+          ),
+          onTap: item.macAddress != null
+              ? () async {
+                  if (item.isNew) await onSetRead(context, true);
+                  if (context.mounted) {
+                    context.push('/devices/${item.macAddress}');
+                  }
+                }
+              : null,
+          isThreeLine: true,
+        ),
+      ),
+    );
+  }
+}