add notification page filter

lib/controllers/notification.dart

@@ -33,7 +33,10 @@ class NotificationController
           if (navigatorKey.currentContext case final context?) {
             Navigator.of(context).push(
               MaterialPageRoute(
-                builder: (_) => NotificationsPage(eventId: eventId),
+                builder: (_) => NotificationsPage(
+                  eventId: eventId,
+                  defaultToAllNotifications: true,
+                ),
               ),
             );
           }

lib/pages/notifications.dart

@@ -1,7 +1,9 @@
+import "package:m3e_buttons/m3e_buttons.dart";
 import "package:material_ui/material_ui.dart";
 import "package:flutter_hooks/flutter_hooks.dart";
 import "package:hooks_riverpod/hooks_riverpod.dart";
 import "package:nexus/controllers/notifications.dart";
+import "package:nexus/models/event.dart";
 import "package:nexus/widgets/appbar.dart";
 import "package:nexus/widgets/error_dialog.dart";
 import "package:nexus/widgets/highlight_wrapper.dart";
@@ -9,11 +11,29 @@ import "package:nexus/widgets/loading.dart";
 import "package:nexus/widgets/renderers/event.dart";
 import "package:super_sliver_list/super_sliver_list.dart";
 
-class const NotificationsPage({final String? eventId, super.key})
+class const NotificationsPage({
-    extends HookConsumerWidget {
+  final String? eventId,
+  final bool defaultToAllNotifications = false,
+  super.key,
+}) extends HookConsumerWidget {
   @override
   Widget build(BuildContext context, WidgetRef ref) {
-    final provider = NotificationsController.provider(null);
+    final options = <M3EToggleButtonGroupAction, UnreadType>{
+      M3EToggleButtonGroupAction(
+        label: Text("Mentions"),
+        icon: Icon(Icons.alternate_email),
+      ): .highlight,
+      M3EToggleButtonGroupAction(
+        label: Text("All Notifications"),
+        icon: Icon(Icons.notifications),
+      ): .notify,
+    };
+    final unreadTypeIndex = useState(defaultToAllNotifications ? 1 : 0);
+
+    final provider = NotificationsController.provider((
+      options.values.toList()[unreadTypeIndex.value],
+      null,
+    ));
     final notifications = ref.watch(provider);
     final notifier = ref.watch(provider.notifier);
 
@@ -35,7 +55,9 @@ class const NotificationsPage({final String? eventId, super.key})
 
     return Scaffold(
       appBar: Appbar(title: Text("Notifications")),
-      body: Column(
+      body: Stack(
+        children: [
+          Column(
             children: [
               if (notifications is AsyncLoading && notifications.value != null)
                 const LinearProgressIndicator(minHeight: 2),
@@ -61,7 +83,9 @@ class const NotificationsPage({final String? eventId, super.key})
                               final event = value[index];
                               final isHighlighted = event.eventId == eventId;
 
-                          return HighlightWrapper(
+                              return Padding(
+                                padding: .only(top: 8),
+                                child: HighlightWrapper(
                                   InkWell(
                                     onTap: () {
                                       //TODO
@@ -69,6 +93,7 @@ class const NotificationsPage({final String? eventId, super.key})
                                     child: EventRenderer(event),
                                   ),
                                   isHighlighted: isHighlighted,
+                                ),
                               );
                             },
                           ),
@@ -81,6 +106,23 @@ class const NotificationsPage({final String? eventId, super.key})
               ),
             ],
           ),
+          Align(
+            alignment: .topRight,
+            child: Card(
+              color: Theme.of(context).colorScheme.surfaceContainer,
+              child: Padding(
+                padding: .all(12),
+                child: M3EToggleButtonGroup(
+                  selectedIndex: unreadTypeIndex.value,
+                  onSelectedIndexChanged: (index) =>
+                      unreadTypeIndex.value = index ?? unreadTypeIndex.value,
+                  actions: options.keys.toList(),
+                ),
+              ),
+            ),
+          ),
+        ],
+      ),
     );
   }
 }