fix settings navigation

apps/mobile/src/components/sidemenu/index.js

@@ -17,6 +17,7 @@ import { ColorSection } from './color-section';
 import { MenuItem } from './menu-item';
 import { TagsSection } from './pinned-section';
 import { UserStatus } from './user-status';
+import Navigation from '../../services/navigation';
 
 export const SideMenu = React.memo(
   () => {
@@ -39,7 +40,13 @@ export const SideMenu = React.memo(
       {
         name: 'Settings',
         icon: 'cog-outline',
-        close: true
+        close: true,
+        func: () => {
+          Navigation.navigate({
+            name: 'Settings',
+            title: 'Settings'
+          });
+        }
       }
     ];
 

apps/mobile/src/screens/settings/group.tsx

@@ -1,8 +1,7 @@
 import { NativeStackScreenProps } from '@react-navigation/native-stack';
 import React, { useEffect } from 'react';
 import { FlatList, View } from 'react-native';
-import { ContainerHeader } from '../../components/container/containerheader';
-import { Header } from '../../components/header';
+import useNavigationStore from '../../stores/use-navigation-store';
 import { tabBarRef } from '../../utils/global-refs';
 import { useNavigationFocus } from '../../utils/hooks/use-navigation-focus';
 import { SectionItem } from './section-item';
@@ -12,6 +11,15 @@ const Group = ({ navigation, route }: NativeStackScreenProps<RouteParams, 'Setti
   useNavigationFocus(navigation, {
     onFocus: () => {
       tabBarRef.current?.lock();
+      console.log('called');
+      useNavigationStore.getState().update(
+        {
+          name: 'SettingsGroup',
+          //@ts-ignore
+          title: route.params.name
+        },
+        true
+      );
       return false;
     }
   });
@@ -26,10 +34,6 @@ const Group = ({ navigation, route }: NativeStackScreenProps<RouteParams, 'Setti
 
   return (
     <View>
-      <ContainerHeader>
-        <Header title={route.params.name} isBack={true} screen={route.name} />
-      </ContainerHeader>
-
       {route.params.sections ? (
         <FlatList
           data={route.params.sections}

apps/mobile/src/screens/settings/home.tsx

@@ -24,7 +24,7 @@ const Home = ({ navigation, route }: NativeStackScreenProps<RouteParams, 'Settin
   const isFocused = useNavigationFocus(navigation, {
     onFocus: () => {
       useNavigationStore.getState().update({
-        name: route.name
+        name: 'Settings'
       });
       return true;
     },
@@ -49,10 +49,6 @@ const Home = ({ navigation, route }: NativeStackScreenProps<RouteParams, 'Settin
 
   return (
     <View>
-      <ContainerHeader>
-        <Header title="Settings" isBack={false} screen="Settings" />
-      </ContainerHeader>
-
       {loading && (
         <BaseDialog animated={false} bounce={false} visible={true}>
           <View

apps/mobile/src/screens/settings/sectionitem.tsx

@@ -7,6 +7,7 @@ import { PressableButton } from '../../components/ui/pressable';
 import Seperator from '../../components/ui/seperator';
 import Paragraph from '../../components/ui/typography/paragraph';
 import SettingsService from '../../services/settings';
+import useNavigationStore from '../../stores/use-navigation-store';
 import { useSettingStore } from '../../stores/use-setting-store';
 import { useThemeStore } from '../../stores/use-theme-store';
 import { SIZE } from '../../utils/size';
@@ -63,6 +64,13 @@ export const SectionItem = React.memo(
           switch (item.type) {
             case 'screen':
               navigation.dispatch(StackActions.push('SettingsGroup', item));
+              useNavigationStore.getState().update(
+                {
+                  name: 'SettingsGroup',
+                  title: typeof item.name === 'function' ? item.name(current) : item.name
+                },
+                true
+              );
               break;
             case 'switch':
               onChangeSettings();