feat(gui-v2): use useSidebar with storageKey

packages/nc-gui-v2/components/smartsheet/sidebar/index.vue

@@ -21,9 +21,9 @@ const route = useRoute()
 provide(ViewListInj, views)
 
 /** Sidebar visible */
-const sidebarOpen = inject(RightSidebarInj, ref(true))
+const { isOpen } = useSidebar({ storageKey: 'nc-right-sidebar' })
 
-const sidebarCollapsed = computed(() => !sidebarOpen.value)
+const sidebarCollapsed = computed(() => !isOpen.value)
 
 /** Sidebar ref */
 const sidebar = ref()
@@ -96,21 +96,21 @@ function onCreate(view: GridType | FormType | KanbanType | GalleryType) {
           class="group color-transition cursor-pointer hover:ring active:ring-pink-500 z-1 flex items-center p-[1px] absolute top-1/2 left-[-1rem] shadow bg-gray-100 rounded-full"
         >
           <MaterialSymbolsChevronRightRounded
-            v-if="sidebarOpen"
+            v-if="isOpen"
             class="transform group-hover:(scale-115 text-pink-500) text-xl text-gray-400 nc-right-sidebar-toggle"
-            @click="sidebarOpen = false"
+            @click="isOpen = false"
           />
 
           <MaterialSymbolsChevronLeftRounded
             v-else
             class="transform group-hover:(scale-115 text-pink-500) text-xl text-gray-400 nc-right-sidebar-toggle"
-            @click="sidebarOpen = true"
+            @click="isOpen = true"
           />
         </div>
       </Transition>
     </a-tooltip>
 
-    <Toolbar v-if="sidebarOpen" class="flex items-center py-3 px-3 justify-between border-b-1" />
+    <Toolbar v-if="isOpen" class="flex items-center py-3 px-3 justify-between border-b-1" />
 
     <Toolbar v-else class="py-3 px-2 max-w-[50px] flex !flex-col-reverse gap-4 items-center mt-[-1px]">
       <template #start>
@@ -136,7 +136,7 @@ function onCreate(view: GridType | FormType | KanbanType | GalleryType) {
       </template>
     </Toolbar>
 
-    <div v-if="sidebarOpen" class="flex-1 flex flex-col">
+    <div v-if="isOpen" class="flex-1 flex flex-col">
       <MenuTop @open-modal="openModal" @deleted="loadViews" @sorted="loadViews" />
 
       <a-divider v-if="isUIAllowed('virtualViewsCreateOrEdit')" class="my-2" />