add / edit / delete user warrens

frontend/layouts/default.vue

@@ -8,17 +8,18 @@ const uploadStore = useUploadStore();
 const route = useRoute();
 const store = useWarrenStore();
 
-store.warrens = await getWarrens();
+await useAsyncData('warrens', async () => {
+    const warrens = await getWarrens();
+    store.warrens = warrens;
+});
 </script>
 
 <template>
     <SidebarProvider>
         <AppSidebar />
-        <main
-            class="flex w-full grow flex-col-reverse overflow-hidden md:flex-col"
-        >
+        <SidebarInset class="flex flex-col-reverse md:flex-col">
             <header
-                class="flex h-16 items-center gap-2 border-t transition-[width,height] ease-linear group-has-[[data-collapsible=icon]]/sidebar-wrapper:h-12 md:border-t-0 md:border-b"
+                class="bg-background sticky bottom-0 z-10 flex h-16 items-center gap-2 border-t transition-[width,height] ease-linear group-has-[[data-collapsible=icon]]/sidebar-wrapper:h-12 md:top-0 md:bottom-[unset] md:border-t-0 md:border-b"
             >
                 <div class="flex w-full items-center gap-4 px-4">
                     <SidebarTrigger class="[&_svg]:size-4" />
@@ -61,6 +62,6 @@ store.warrens = await getWarrens();
             <div class="flex flex-1 flex-col p-4">
                 <slot />
             </div>
-        </main>
+        </SidebarInset>
     </SidebarProvider>
 </template>