chore: Add Claude Fix some bugs.

src/layouts/MainLayout.vue

@@ -1,5 +1,6 @@
 <template>
   <q-layout view="hHh Lpr fFf">
+    <ToolbarComponent :pageTitle="route.meta.title as string" />
     <q-page-container>
       <router-view />
     </q-page-container>
@@ -11,9 +12,12 @@
 
 <script setup lang="ts">
 import { useQuasar } from 'quasar';
+import { useRoute } from 'vue-router';
 import BottomNavComponent from 'src/components/BottomNavComponent.vue';
+import ToolbarComponent from 'src/components/ToolbarComponent.vue';
 
 const q = useQuasar();
+const route = useRoute();
 // q.fullscreen.request();
 q.addressbarColor.set('#14539a');
 </script>

src/pages/IndexPage.vue

@@ -1,5 +1,4 @@
 <template>
-  <ToolbarComponent />
   <q-page class="row justify-center">
     <q-img alt="OYS Logo" src="~assets/oysqn_logo.png" fit="scale-down" />
     <q-list class="full-width mobile-only">
@@ -24,5 +23,4 @@
 
 <script lang="ts" setup>
 import { enabledLinks } from 'src/router/navlinks.js';
-import ToolbarComponent from 'components/ToolbarComponent.vue';
 </script>

src/pages/ProfilePage.vue

@@ -1,5 +1,4 @@
 <template>
-  <toolbar-component pageTitle="Member Profile" />
   <q-page
     padding
     class="row">
@@ -76,7 +75,6 @@
 </template>
 
 <script setup lang="ts">
-import ToolbarComponent from 'src/components/ToolbarComponent.vue';
 import { useAuthStore } from 'src/stores/auth';
 import { ref } from 'vue';
 

src/pages/schedule/BoatReservationPage.vue

@@ -1,5 +1,7 @@
 <template>
-  <BoatReservationComponent v-model="newReservation" />
+  <q-page>
+    <BoatReservationComponent v-model="newReservation" />
+  </q-page>
 </template>
 
 <script setup lang="ts">

src/pages/schedule/ListReservationsPage.vue

@@ -1,4 +1,5 @@
 <template>
+  <q-page>
   <q-tabs
     v-model="tab"
     inline-label
@@ -57,6 +58,7 @@
       </div>
     </q-tab-panel>
   </q-tab-panels>
+  </q-page>
 </template>
 <script setup lang="ts">
 import { useReservationStore } from 'src/stores/reservation';

src/pages/schedule/ManageCalendar.vue

@@ -1,5 +1,5 @@
 <template>
-  <div class="fit row wrap justify-start items-start content-start">
+  <q-page class="fit row wrap justify-start items-start content-start">
     <div class="q-pa-md">
       <div
         class="scheduler"
@@ -153,6 +153,7 @@
       </q-card-actions>
     </q-card>
   </q-dialog>
+  </q-page>
 </template>
 
 <script setup lang="ts">

src/pages/schedule/ModifyBoatReservation.vue

@@ -1,5 +1,7 @@
 <template>
-  <BoatReservationComponent v-model="reservation" />
+  <q-page>
+    <BoatReservationComponent v-model="reservation" />
+  </q-page>
 </template>
 
 <script setup lang="ts">

src/pages/schedule/SchedulePageView.vue

@@ -1,8 +1,6 @@
 <template>
-  <toolbar-component pageTitle="Schedule" />
   <router-view />
 </template>
 
 <script setup lang="ts">
-import ToolbarComponent from 'src/components/ToolbarComponent.vue';
 </script>

src/router/routes.ts

@@ -13,16 +13,19 @@ const routes: RouteRecordRaw[] = [
         // component: () => import('pages/IndexPage.vue'),
         component: () => import('src/pages/IndexPage.vue'),
         name: 'index',
+        meta: { title: 'OYS Borrow a Boat' },
       },
       {
         path: '/boat',
         component: () => import('src/pages/BoatPage.vue'),
         name: 'boat',
+        meta: { title: 'Boats' },
       },
       {
         path: '/schedule',
         component: () => import('pages/schedule/SchedulePageView.vue'),
         name: 'schedule',
+        meta: { title: 'Schedule' },
         children: [
           {
             path: '',
@@ -64,10 +67,12 @@ const routes: RouteRecordRaw[] = [
         path: '/certification',
         component: () => import('src/pages/CertificationPage.vue'),
         name: 'certification',
+        meta: { title: 'Certifications' },
       },
       {
         path: '/task',
         name: 'task',
+        meta: { title: 'Tasks' },
         children: [
           {
             path: '',
@@ -85,16 +90,19 @@ const routes: RouteRecordRaw[] = [
         path: '/checklist',
         component: () => import('pages/ChecklistPage.vue'),
         name: 'checklist',
+        meta: { title: 'Checklist' },
       },
       {
         path: '/profile',
         component: () => import('src/pages/ProfilePage.vue'),
         name: 'profile',
+        meta: { title: 'Member Profile' },
       },
       {
         path: '/reference',
         component: () => import('src/pages/reference/ReferencePage.vue'),
         name: 'reference',
+        meta: { title: 'Reference' },
         children: [
           {
             path: '',
@@ -103,7 +111,7 @@ const routes: RouteRecordRaw[] = [
             name: 'reference-index',
           },
           {
-            path: '/reference/:id/view',
+            path: 'reference/:id/view',
             component: () =>
               import('src/pages/reference/ReferenceItemPage.vue'),
           },
@@ -117,12 +125,12 @@ const routes: RouteRecordRaw[] = [
     meta: { requiredRoles: ['admin'] },
     children: [
       {
-        path: '/user',
+        path: 'user',
         component: () => import('pages/admin/UserAdminPage.vue'),
         name: 'useradmin',
       },
       {
-        path: '/boat',
+        path: 'boat',
         component: () => import('pages/admin/BoatAdminPage.vue'),
         name: 'boatadmin',
       },
@@ -144,14 +152,6 @@ const routes: RouteRecordRaw[] = [
       publicRoute: true,
     },
   },
-  {
-    path: '/login',
-    component: () => import('pages/LoginPage.vue'),
-    name: 'login',
-    meta: {
-      publicRoute: true,
-    },
-  },
   {
     path: '/terms-of-service',
     component: () => import('pages/TermsOfServicePage.vue'),

src/stores/auth.ts

@@ -100,7 +100,7 @@ export const useAuthStore = defineStore('auth', () => {
   }
 
   function logout() {
-    return account.deleteSession('current').then((currentUser.value = null));
+    return account.deleteSession('current').then(() => { currentUser.value = null; });
   }
 
   async function updateName(name: string) {

src/stores/reference.ts

@@ -113,7 +113,7 @@ export const useReferenceStore = defineStore('reference', {
 
   getters: {
     getCategory(state) {
-      (category: string) => {
+      return (category: string) => {
         return state.allItems.filter((c) => c.category === category);
       };
     },