Added auth functionality, initial work with views and field types

frontend/components/AppSidebar.vue

@@ -16,7 +16,13 @@ import {
   SidebarRail,
 } from '@/components/ui/sidebar'
 import { Collapsible, CollapsibleContent, CollapsibleTrigger } from '@/components/ui/collapsible'
-import { LayoutGrid, Boxes, Settings, Home, ChevronRight, Database, Layers } from 'lucide-vue-next'
+import { LayoutGrid, Boxes, Settings, Home, ChevronRight, Database, Layers, LogOut } from 'lucide-vue-next'
+
+const { logout } = useAuth()
+
+const handleLogout = async () => {
+  await logout()
+}
 
 const menuItems = [
   {
@@ -95,7 +101,7 @@ const menuItems = [
               <Collapsible v-else as-child :default-open="false" class="group/collapsible">
                 <SidebarMenuItem>
                   <CollapsibleTrigger as-child>
-                    <SidebarMenuButton tooltip="{item.title}">
+                    <SidebarMenuButton :tooltip="item.title">
                       <component :is="item.icon" />
                       <span>{{ item.title }}</span>
                       <ChevronRight
@@ -125,8 +131,9 @@ const menuItems = [
     <SidebarFooter>
       <SidebarMenu>
         <SidebarMenuItem>
-          <SidebarMenuButton>
-            <span class="text-sm text-muted-foreground">Logged in as user</span>
+          <SidebarMenuButton @click="handleLogout" class="cursor-pointer hover:bg-accent">
+            <LogOut class="h-4 w-4" />
+            <span>Logout</span>
           </SidebarMenuButton>
         </SidebarMenuItem>
       </SidebarMenu>