new UI and handle cashing

src/layouts/mobile/MobileAppLayout.vue

@@ -1,12 +1,5 @@
 <template>
   <div>
-    <MobileOverflowMenu
-      :visible="popVisible"
-      :overflow-items="overflowItems"
-      @close="closeOverflowMenu"
-      @navigate="navigateTo"
-    />
-
     <div :class="['main-with-bottom-chrome', { 'main-with-bottom-chrome--no-nav': hideMenu }]">
       <router-view v-slot="{ Component, route }">
         <transition :name="route.meta.transition || 'fade'">
@@ -21,7 +14,6 @@
       :nav-logo="navLogo"
       :nav-item-class="navItemClass"
       @navigate="navigateTo"
-      @toggle-overflow="toggleOverflowMenu"
     />
   </div>
 </template>
@@ -30,28 +22,18 @@
 import { computed } from 'vue'
 import { useConfigStore } from '@/store/configStore'
 import { getProjectMobileNavLogo, isBoursecuProject } from '@/utils/config'
-import { SECONDARY_NAV } from '../config/navigation'
 import { useAppNavigation } from '../composables/useAppNavigation'
 import MobileBottomNav from './MobileBottomNav.vue'
-import MobileOverflowMenu from './MobileOverflowMenu.vue'
 
 const config = useConfigStore()
 const isBoursecu = isBoursecuProject()
 const navLogo = computed(() => getProjectMobileNavLogo(config.config?.avatar))
 
 const {
-  popVisible,
   hideMenu,
   navItemClass,
   navigateTo,
-  toggleOverflowMenu,
-  closeOverflowMenu,
 } = useAppNavigation()
-
-const overflowItems = [
-  { id: 'user', routeName: 'user', label: 'حساب کاربری', icon: 'vuesax-linear:user' },
-  ...SECONDARY_NAV,
-]
 </script>
 
 <style lang="less" src="./mobile-layout.less"></style>

src/layouts/mobile/MobileBottomNav.vue

@@ -61,7 +61,7 @@
           class="circle_in"
           :class="isWhiteNavLogo ? 'is-white-nav-logo' : 'text-white'"
         >
-          <div class="circle_into" @click.stop="$emit('toggle-overflow')">
+          <div class="circle_into">
             <div
               v-if="projectName === 'garoosi'"
               class="p-2 text-tertiary flex flex-col justify-center items-center"
@@ -126,7 +126,6 @@ defineProps<{
 
 defineEmits<{
   navigate: [routeName: string]
-  'toggle-overflow': []
 }>()
 
 const projectName = getConfigApp('name')