Use auth store

frontend/components/Navbar.vue

@@ -17,17 +17,18 @@
             </template>
 
             <v-list>
-                <client-only>
+                <v-list-item
-                    <v-list-item v-if="isAuthenticated" to="/notes">
+                    v-if="loggedIn && !$route.path.includes('/notes')"
+                    to="/notes"
+                >
                     My notes
                 </v-list-item>
-                    <v-list-item v-if="isAuthenticated" @click="logout">
+                <v-list-item v-if="loggedIn" @click="logout">
                     Logout
                 </v-list-item>
                 <v-list-item v-else>
                     <v-btn to="/account" text rounded>Account</v-btn>
                 </v-list-item>
-                </client-only>
             </v-list>
         </v-menu>
     </v-app-bar>
@@ -35,7 +36,7 @@
 
 <script>
 import { mdiDotsVertical, mdiBrightness5, mdiBrightness2 } from '@mdi/js'
-import { mapGetters } from 'vuex'
+import { mapState } from 'vuex'
 
 export default {
     name: 'Navbar',
@@ -45,7 +46,7 @@ export default {
         mdiBrightness2,
     }),
     computed: {
-        ...mapGetters(['isAuthenticated', 'loggedInUser']),
+        ...mapState('auth', ['loggedIn']),
     },
     methods: {
         async logout() {

frontend/store/index.js

@@ -4,12 +4,4 @@ export const mutations = {}
 
 export const actions = {}
 
-export const getters = {
+export const getters = {}
-    isAuthenticated(state) {
-        return state.auth.loggedIn
-    },
-
-    loggedInUser(state) {
-        return state.auth.user
-    },
-}