💄 Optimize chat appbar

lib/screens/chat/chat.dart

@@ -468,43 +468,54 @@ class ChatListScreen extends HookConsumerWidget {
       return const EmptyPageHolder();
     }
 
+    final appbarFeColor = Theme.of(context).appBarTheme.foregroundColor;
+
     return AppScaffold(
       extendBody: false, // Prevent conflicts with tabs navigation
       appBar: AppBar(
-        title: const Text('chat').tr(),
+        flexibleSpace: Container(
-        bottom: TabBar(
+          height: 48,
-          controller: tabController,
+          margin: EdgeInsets.only(
-          tabs: [
+            left: 8,
-            Tab(
+            right: 8,
-              child: Text(
+            top: 4 + MediaQuery.of(context).padding.top,
-                'chatTabAll'.tr(),
+            bottom: 4,
-                textAlign: TextAlign.center,
-                style: TextStyle(
-                  color: Theme.of(context).appBarTheme.foregroundColor!,
           ),
+          child: Padding(
+            padding: const EdgeInsets.symmetric(horizontal: 8),
+            child: Row(
+              children: [
+                Expanded(
+                  child: Row(
+                    spacing: 8,
+                    children: [
+                      IconButton(
+                        icon: Icon(
+                          Symbols.inbox,
+                          fill: tabController.index == 0 ? 1 : 0,
                         ),
+                        color: appbarFeColor,
+                        onPressed: () => tabController.animateTo(0),
                       ),
-            Tab(
+                      IconButton(
-              child: Text(
+                        icon: Icon(
-                'chatTabDirect'.tr(),
+                          Symbols.person,
-                textAlign: TextAlign.center,
+                          fill: tabController.index == 1 ? 1 : 0,
-                style: TextStyle(
-                  color: Theme.of(context).appBarTheme.foregroundColor!,
                         ),
+                        color: appbarFeColor,
+                        onPressed: () => tabController.animateTo(1),
                       ),
+                      IconButton(
+                        icon: Icon(
+                          Symbols.group,
+                          fill: tabController.index == 2 ? 1 : 0,
                         ),
-            Tab(
+                        color: appbarFeColor,
-              child: Text(
+                        onPressed: () => tabController.animateTo(2),
-                'chatTabGroup'.tr(),
-                textAlign: TextAlign.center,
-                style: TextStyle(
-                  color: Theme.of(context).appBarTheme.foregroundColor!,
-                ),
-              ),
                       ),
                     ],
                   ),
-        actions: [
+                ),
                 IconButton(
                   icon: Badge(
                     label: Text(
@@ -521,6 +532,7 @@ class ChatListScreen extends HookConsumerWidget {
                     ),
                     child: const Icon(Symbols.email),
                   ),
+                  color: appbarFeColor,
                   onPressed: () {
                     showModalBottomSheet(
                       useRootNavigator: true,
@@ -530,9 +542,11 @@ class ChatListScreen extends HookConsumerWidget {
                     );
                   },
                 ),
-          const Gap(8),
               ],
             ),
+          ),
+        ),
+      ),
       body: ChatListBodyWidget(
         isFloating: false,
         tabController: tabController,

lib/screens/explore.dart

@@ -362,7 +362,6 @@ class ExploreScreen extends HookConsumerWidget {
     final foregroundColor = Theme.of(context).appBarTheme.foregroundColor;
 
     return AppBar(
-      toolbarHeight: 48,
       flexibleSpace: Container(
         height: 48,
         margin: EdgeInsets.only(
@@ -371,6 +370,8 @@ class ExploreScreen extends HookConsumerWidget {
           top: 4 + MediaQuery.of(context).padding.top,
           bottom: 4,
         ),
+        child: Padding(
+          padding: const EdgeInsets.symmetric(horizontal: 8),
           child: Row(
             spacing: 8,
             children: [
@@ -458,6 +459,7 @@ class ExploreScreen extends HookConsumerWidget {
             ],
           ),
         ),
+      ),
     );
   }