refactor(gui-v2): use collapsible prop on views sidebar

packages/nc-gui-v2/app.vue

@@ -30,7 +30,7 @@ const toggleSidebar = () => {
 </script>
 
 <template>
-  <a-layout>
+  <a-layout class="min-h-[100vh]">
     <a-layout-header class="flex !bg-primary items-center text-white px-4 shadow-md">
       <MaterialSymbolsMenu v-if="$state.signedIn.value" class="text-xl cursor-pointer" @click="toggleSidebar" />
 

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

@@ -21,6 +21,8 @@ provide(ViewListInj, views)
 /** Sidebar visible */
 const drawerOpen = inject('navDrawerOpen', ref(true))
 
+const sidebarCollapsed = computed(() => !drawerOpen.value)
+
 /** View type to create from modal */
 let viewCreateType = $ref<ViewTypes>()
 
@@ -57,7 +59,15 @@ function onCreate(view: GridType | FormType | KanbanType | GalleryType) {
 </script>
 
 <template>
-  <a-layout-sider class="shadow !mt-[-9px]" style="height: calc(100% + 9px)" theme="light" :width="drawerOpen ? 250 : 50">
+  <a-layout-sider
+    :collapsed="sidebarCollapsed"
+    collapsiple
+    collapsed-width="50"
+    width="250"
+    class="shadow !mt-[-9px]"
+    style="height: calc(100% + 9px)"
+    theme="light"
+  >
     <Toolbar v-if="drawerOpen" 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]">