TW-548 : add notifications bubble to navigation chat icon

lib/widgets/layouts/adaptive_layout/adaptive_scaffold_view.dart

@@ -2,10 +2,13 @@ import 'package:fluffychat/di/global/get_it_initializer.dart';
 import 'package:fluffychat/pages/chat_list/chat_list.dart';
 import 'package:fluffychat/pages/contacts_tab/contacts_tab.dart';
 import 'package:fluffychat/pages/search/search.dart';
+import 'package:fluffychat/utils/matrix_sdk_extensions/client_stories_extension.dart';
 import 'package:fluffychat/utils/responsive/responsive_utils.dart';
 import 'package:fluffychat/widgets/layouts/adaptive_layout/adaptive_scaffold_primary_navigation.dart';
 import 'package:fluffychat/widgets/layouts/adaptive_layout/adaptive_scaffold.dart';
 import 'package:fluffychat/widgets/layouts/enum/adaptive_destinations_enum.dart';
+import 'package:fluffychat/widgets/twake_components/twake_navigation_icon/twake_navigation_icon.dart';
+import 'package:fluffychat/widgets/unread_rooms_badge.dart';
 import 'package:flutter/material.dart';
 import 'package:flutter_adaptive_scaffold/flutter_adaptive_scaffold.dart';
 import 'package:flutter_gen/gen_l10n/l10n.dart';
@@ -188,15 +191,21 @@ class AppScaffoldView extends StatelessWidget {
   List<NavigationDestination> getNavigationDestinations(BuildContext context) {
     return [
       NavigationDestination(
-        icon: const Icon(Icons.contacts_outlined),
+        icon: const TwakeNavigationIcon(
+          icon: Icons.contacts_outlined,
+        ),
         label: L10n.of(context)!.contacts,
       ),
       NavigationDestination(
-        icon: const Icon(Icons.chat),
+        icon: UnreadRoomsBadge(
+          filter: (room) => !room.isSpace && !room.isStoryRoom,
+        ),
         label: L10n.of(context)!.chat,
       ),
       NavigationDestination(
-        icon: const Icon(Icons.web_stories_outlined),
+        icon: const TwakeNavigationIcon(
+          icon: Icons.web_stories_outlined,
+        ),
         label: L10n.of(context)!.stories,
       ),
     ];

lib/widgets/twake_components/twake_navigation_icon/twake_navigation_icon.dart

@@ -0,0 +1,32 @@
+import 'package:fluffychat/widgets/twake_components/twake_navigation_icon/twake_navigation_icon_style.dart';
+import 'package:flutter/material.dart';
+
+class TwakeNavigationIcon extends StatelessWidget {
+  final IconData icon;
+  final int notificationCount;
+
+  const TwakeNavigationIcon({
+    super.key,
+    required this.icon,
+    this.notificationCount = 0,
+  });
+
+  @override
+  Widget build(BuildContext context) {
+    return Badge(
+      backgroundColor: Theme.of(context).colorScheme.error,
+      isLabelVisible: notificationCount > 0,
+      largeSize: TwakeNavigationIconStyle.badgeHeight,
+      label: Text(
+        notificationCount.toString(),
+        style: Theme.of(context).textTheme.labelSmall?.copyWith(
+              color: Theme.of(context).colorScheme.onError,
+            ),
+      ),
+      child: Icon(
+        icon,
+        color: Theme.of(context).colorScheme.onSurfaceVariant,
+      ),
+    );
+  }
+}

lib/widgets/twake_components/twake_navigation_icon/twake_navigation_icon_style.dart

@@ -0,0 +1,3 @@
+class TwakeNavigationIconStyle {
+  static double get badgeHeight => 16.0;
+}

lib/widgets/unread_rooms_badge.dart

@@ -1,21 +1,17 @@
 import 'package:collection/collection.dart';
+import 'package:fluffychat/widgets/twake_components/twake_navigation_icon/twake_navigation_icon.dart';
 import 'package:flutter/material.dart';
 
-import 'package:badges/badges.dart' as b;
 import 'package:matrix/matrix.dart';
 
 import 'matrix.dart';
 
 class UnreadRoomsBadge extends StatelessWidget {
   final bool Function(Room) filter;
-  final b.BadgePosition? badgePosition;
-  final Widget? child;
 
   const UnreadRoomsBadge({
     Key? key,
     required this.filter,
-    this.badgePosition,
-    this.child,
   }) : super(key: key);
 
   @override
@@ -29,25 +25,9 @@ class UnreadRoomsBadge extends StatelessWidget {
       builder: (context, _) {
         final unreadCount = getNotificationsCount(context);
 
-        return b.Badge(
-          alignment: Alignment.bottomRight,
-          badgeContent: Text(
-            unreadCount.toString(),
-            style: TextStyle(
-              color: Theme.of(context).colorScheme.onPrimary,
-              fontSize: 12,
-            ),
-          ),
-          showBadge: unreadCount != 0,
-          animationType: b.BadgeAnimationType.scale,
-          badgeColor: Theme.of(context).colorScheme.primary,
-          position: badgePosition,
-          elevation: 4,
-          borderSide: BorderSide(
-            color: Theme.of(context).colorScheme.background,
-            width: 2,
-          ),
-          child: child,
+        return TwakeNavigationIcon(
+          icon: Icons.chat,
+          notificationCount: unreadCount,
         );
       },
     );

pubspec.lock

@@ -97,14 +97,6 @@ packages:
       url: "https://pub.dev"
     source: hosted
     version: "3.0.0"
-  badges:
-    dependency: "direct main"
-    description:
-      name: badges
-      sha256: "727580d938b7a1ff47ea42df730d581415606b4224cfa708671c10287f8d3fe6"
-      url: "https://pub.dev"
-    source: hosted
-    version: "2.0.3"
   base58check:
     dependency: transitive
     description:

pubspec.yaml

@@ -10,7 +10,6 @@ dependencies:
   adaptive_dialog: ^1.8.0+1
   flutter_adaptive_scaffold: ^0.1.4
   animations: ^2.0.7
-  badges: ^2.0.3
   blurhash_dart: ^1.1.0
   callkeep: ^0.3.2
   chewie: ^1.3.6