drawer closing

Author: simon-kramer

db.json

@@ -12,7 +12,7 @@
       "first_name": "Janette",
       "last_name": "Kereluk",
       "email": "boomhandmade@live.com",
-      "status": false
+      "status": true
     },
     {
       "id": "8d1c1c46-9b97-45e0-a8fb-68a0785ad05b",
@@ -153,6 +153,13 @@
       "last_name": "Heisenberg",
       "email": "werner@heisenberg.de",
       "status": true
+    },
+    {
+      "id": "acafdb3c-699c-4f9a-a9e5-cefb739383c6",
+      "first_name": "Niels",
+      "last_name": "Bohr",
+      "email": "niels@bohr.com",
+      "status": true
     }
   ]
 }

layouts/default.vue

@@ -1,9 +1,10 @@
 <script setup lang="ts">
 // Consts & imports
 const isOpen = ref(false)
+const route = useRoute()
+
 const colorMode = useColorMode()
 const colorModeButtonLabel = ref('Enable Light Mode')
-const route = useRoute()
 const capitalizeFirstLetter = (string: string) =>
   string.charAt(0).toUpperCase() + string.slice(1)
 
@@ -116,7 +117,11 @@ const navigation = [
         </template>
 
         <!-- Main Navigation Items -->
-        <UVerticalNavigation :links="navigation" :ui="{ base: 'gap-4' }" />
+        <UVerticalNavigation
+          :links="navigation"
+          :ui="{ base: 'gap-4' }"
+          @click="() => (isOpen = false)"
+        />
         <template #footer>
           <div class="flex items-center justify-between">
             <UButton variant="outline">Logout</UButton>

pages/customers/index.vue

@@ -1,5 +1,5 @@
 <script lang="ts" setup>
-import { v4 as uuidv4 } from 'uuid'
+import { v4 as uuidv4 } from 'uuid' // needs to get typed
 import type { Customer } from '@/models/customers'
 const customerStore = useCustomerStore()