fix: linking of pages

composables/auth.ts

@@ -3,19 +3,10 @@ import { acceptHMRUpdate, defineStore } from 'pinia'
 export const useAuthStore = defineStore('auth', () => {
   const { $api } = useNuxtApp()
 
-  const firstName = ref('')
-  const lastName = ref('')
-  const email = ref('')
-  const points = ref(0)
-  const pointsAwardedCount = ref(0)
-  const pointsAwardedResetTime = ref(new Date(Date.now()))
-  const godMode = ref(false)
+  const user = ref<User | null>()
+  const institution = ref<Institution | null>()
 
-  const institutionName = ref('')
-  const institutionShortName = ref('')
-  const institutionDescription = ref('')
-
-  const authenticated = computed(() => !!email.value)
+  const authenticated = computed(() => !!user.value)
 
   /**
    * init populates the store with the current user data, and does nothing
@@ -35,24 +26,6 @@ export const useAuthStore = defineStore('auth', () => {
           : undefined,
       })
       populate(res)
-      await getuserinstitution(cookie)
-    }
-    catch (e) {
-      console.error('[composables/user.ts] failed to init store', e)
-      return parseError(e)
-    }
-  }
-
-  async function getuserinstitution(cookie?: string) {
-    try {
-      const res = await $api<Institution>('/auth/myinstitution', {
-        headers: cookie
-          ? {
-              cookie,
-            }
-          : undefined,
-      })
-      populateInst(res)
     }
     catch (e) {
       console.error('[composables/user.ts] failed to init store', e)
@@ -75,7 +48,6 @@ export const useAuthStore = defineStore('auth', () => {
         },
       })
       populate(res)
-      await getuserinstitution()
     }
     catch (e) {
       console.error('[composables/user.ts] failed to login', e)
@@ -106,7 +78,6 @@ export const useAuthStore = defineStore('auth', () => {
         },
       })
       populate(res)
-      await getuserinstitution()
     }
     catch (e) {
       console.error('[composables/user.ts] failed to register', e)
@@ -119,45 +90,34 @@ export const useAuthStore = defineStore('auth', () => {
    * @param data data to populate the store with
    */
   function populate(data: User) {
-    firstName.value = data.firstName
-    lastName.value = data.lastName
-    email.value = data.email
+    user.value = {
+      ...data,
 
-    if (data.godMode)
-      godMode.value = data.godMode
+    }
+    institution.value = data.institution
 
-    if (data.points)
-      points.value = data.points
+    // firstName.value = data.firstName
+    // lastName.value = data.lastName
+    // email.value = data.email
 
-    if (data.pointsAwardedCount)
-      pointsAwardedCount.value = data.pointsAwardedCount
+    // if (data.godMode)
+    //   godMode.value = data.godMode
 
-    if (data.pointsAwardedResetTime) {
-      const d = new Date(data.pointsAwardedResetTime)
-      if (d.getFullYear() !== 1) { // Zero value in Go time.TIme
-        pointsAwardedResetTime.value = d
-      }
-    }
-  }
+    // if (data.points)
+    //   points.value = data.points
 
-  function populateInst(data: Institution) {
-    institutionName.value = data.name
-    institutionShortName.value = data.shortName
-    institutionDescription.value = data.description
-  }
+    // if (data.pointsAwardedCount)
+    //   pointsAwardedCount.value = data.pointsAwardedCount
 
+    // if (data.pointsAwardedResetTime) {
+    //   const d = new Date(data.pointsAwardedResetTime)
+    //   if (d.getFullYear() !== 1) { // Zero value in Go time.TIme
+    //     pointsAwardedResetTime.value = d
+    //   }
+    // }
+  }
   return {
-    firstName,
-    lastName,
-    email,
-    points,
-    pointsAwardedCount,
-    pointsAwardedResetTime,
-    godMode,
-
-    institutionName,
-    institutionShortName,
-    institutionDescription,
+    ...user.value,
 
     authenticated,
 

layouts/app.vue

@@ -41,7 +41,7 @@ useAsyncData(async () => {
     <header>
       <div mx-auto container>
         <div flex items-center justify-between px5 py8>
-          <NuxtLink :to="`/@${auth.institutionShortName}/dashboard`">
+          <NuxtLink :to="`/@${auth.institution?.shortName}/dashboard`">
             <CommonAppLogo h-8 />
           </NuxtLink>
 

pages/@[[institution]]/dashboard/index.vue

@@ -1,12 +1,47 @@
 <script setup lang="ts">
+import Breadcrumb from 'primevue/breadcrumb'
+
 definePageMeta({
   layout: 'app',
   middleware: 'auth',
 })
+
+interface MenuContent {
+  options: string
+  icon: string
+}
+
+const menu = [
+  {
+    options: 'Groups',
+    icon: 'i-fluent-emoji-graduation-cap',
+  },
+  {
+    options: 'Rewards',
+    icon: 'i-fluent-emoji-money-bag',
+  },
+  {
+    options: 'Visit Pet',
+    icon: 'i-fluent-emoji-paw-prints',
+  },
+  {
+    options: 'Calander',
+    icon: 'i-fluent-emoji-calendar',
+  },
+] satisfies MenuContent[]
 </script>
 
 <template>
-  <div>
-    this is the dashboard!
+  <div class="card justify-content-center flex flex-row">
+    <Breadcrumb :model="menu">
+      <template #item="{ item }">
+        <a>
+          <div flex>
+            <div :class="item.icon" />
+            {{ item.options }}
+          </div>
+        </a>
+      </template>
+    </Breadcrumb>
   </div>
 </template>

pages/@[[institution]]/manage/groups/[shortName].vue

@@ -75,7 +75,7 @@ async function update() {
       summary: 'Success',
       detail: 'Group updated',
     })
-    navigateTo(`/@${auth.institutionShortName}/manage/groups/${formData.value.shortName}`)
+    navigateTo(`/@${auth.institution?.shortName}/manage/groups/${formData.value.shortName}`)
   }
 }
 
@@ -90,7 +90,7 @@ async function del() {
       summary: 'Success',
       detail: 'Group deleted',
     })
-    navigateTo(`/@${auth.institutionShortName}/manage/groups`)
+    navigateTo(`/@${auth.institution?.shortName}/manage/groups`)
   }
 }
 

pages/@[[institution]]/manage/groups/new.vue

@@ -46,7 +46,7 @@ async function create() {
       summary: 'Success',
       detail: 'Group created',
     })
-    navigateTo(`/@${auth.institutionShortName}/manage/groups/${formData.value.shortName}`)
+    navigateTo(`/@${auth.institution?.shortName}/manage/groups/${formData.value.shortName}`)
   }
 }
 </script>

pages/login.vue

@@ -28,7 +28,7 @@ async function login() {
   formData.isLoading = true
   const err = await auth.login(formData.email, formData.password)
   if (!err)
-    return navigateTo(`/@${auth.institutionShortName}/dashboard`)
+    return navigateTo(`/@${auth.institution?.shortName}/dashboard`)
   formData.error = err
   formData.isLoading = false
 }

utils/api.ts

@@ -6,6 +6,7 @@ interface Institution {
 }
 
 interface User {
+  institution: Institution | null | undefined
   firstName: string
   lastName: string
   email: string