chore: used debounce function from vueuse and useStorage instead of localStorage

frontend/src/composables/useActiveTabManager.js

@@ -1,54 +1,49 @@
-import { ref, watch } from 'vue';
-
-// Debounce function to delay updates
-function debounce(fn, delay) {
-  let timeout;
-  return (...args) => {
-    clearTimeout(timeout);
-    timeout = setTimeout(() => fn(...args), delay);
-  };
-}
+import { ref, watch } from 'vue'
+import { useDebounceFn, useStorage } from '@vueuse/core'
 
 export function useActiveTabManager(tabs, storageKey) {
-    
-  const preserveLastVisitedTab = debounce((tabName) => {
-    localStorage.setItem(storageKey, tabName.toLowerCase());
-  }, 300);
+  const activieTab = useStorage(storageKey, 'activity')
+
+  const preserveLastVisitedTab = useDebounceFn((tabName) => {
+    activieTab.value = tabName.toLowerCase()
+  }, 300)
 
   function setActiveTabInUrl(tabName) {
-    window.location.hash = '#' + tabName.toLowerCase();
+    window.location.hash = '#' + tabName.toLowerCase()
   }
 
   function getActiveTabFromUrl() {
-    return window.location.hash.replace('#', '');
+    return window.location.hash.replace('#', '')
   }
 
-  function findTabIndex(tabName){
-    return tabs.value.findIndex(tabOptions => tabOptions.name.toLowerCase() === tabName);
+  function findTabIndex(tabName) {
+    return tabs.value.findIndex(
+      (tabOptions) => tabOptions.name.toLowerCase() === tabName,
+    )
   }
 
   function getTabIndex(tabName) {
     let index = findTabIndex(tabName)
-    return index !== -1 ? index : 0; // Default to the first tab if not found
+    return index !== -1 ? index : 0 // Default to the first tab if not found
   }
 
   function getActiveTabFromLocalStorage() {
-    return localStorage.getItem(storageKey);
+    return activieTab.value
   }
 
   function getActiveTab() {
-    let activeTab = getActiveTabFromUrl();
-    if(activeTab){
+    let activeTab = getActiveTabFromUrl()
+    if (activeTab) {
       let index = findTabIndex(activeTab)
-      if(index !== -1){
+      if (index !== -1) {
         preserveLastVisitedTab(activeTab)
         return index
       }
       return 0
     }
 
-    let lastVisitedTab = getActiveTabFromLocalStorage();
-    if(lastVisitedTab){
+    let lastVisitedTab = getActiveTabFromLocalStorage()
+    if (lastVisitedTab) {
       setActiveTabInUrl(lastVisitedTab)
       return getTabIndex(lastVisitedTab)
     }
@@ -56,13 +51,13 @@ export function useActiveTabManager(tabs, storageKey) {
     return 0 // Default to the first tab if nothing is found
   }
 
-  const tabIndex = ref(getActiveTab());
+  const tabIndex = ref(getActiveTab())
 
   watch(tabIndex, (tabIndexValue) => {
-    let currentTab = tabs.value[tabIndexValue].name;
-    setActiveTabInUrl(currentTab);
-    preserveLastVisitedTab(currentTab);
-  });
+    let currentTab = tabs.value[tabIndexValue].name
+    setActiveTabInUrl(currentTab)
+    preserveLastVisitedTab(currentTab)
+  })
 
-  return { tabIndex };
+  return { tabIndex }
 }

frontend/src/pages/Deal.vue

@@ -354,7 +354,7 @@ import {
 } from 'frappe-ui'
 import { ref, computed, h, onMounted, onBeforeUnmount } from 'vue'
 import { useRoute, useRouter } from 'vue-router'
-import {useActiveTabManager} from '@/composables/useActiveTabManager'
+import { useActiveTabManager } from '@/composables/useActiveTabManager'
 
 
 const { $dialog, $socket, makeCall } = globalStore()

frontend/src/pages/Lead.vue

@@ -330,7 +330,7 @@ import {
 } from 'frappe-ui'
 import { ref, computed, onMounted, watch } from 'vue'
 import { useRouter, useRoute } from 'vue-router'
-import {useActiveTabManager} from '@/composables/useActiveTabManager'
+import { useActiveTabManager } from '@/composables/useActiveTabManager'
 
 const { $dialog, $socket, makeCall } = globalStore()
 const { getContactByName, contacts } = contactsStore()