fixed routing issue on logout

front/src/AddBook.vue

@@ -1,7 +1,7 @@
 <script setup>
   import { ref, reactive, computed } from 'vue'
   import { postBook, extractFormErrorFromField } from './api.js'
-  import { useRouter, useRoute } from 'vue-router'
+  import { useRouter } from 'vue-router'
 
   const router = useRouter();
 

front/src/AppNavBar.vue

@@ -1,8 +1,15 @@
 <script setup>
   import { RouterLink } from 'vue-router'
   import { useAuthStore } from './auth.store.js'
+  import { useRouter } from 'vue-router'
 
   const authStore = useAuthStore();
+  const router = useRouter();
+
+  function logout() {
+    authStore.logout();
+    router.push('/');
+  }
 </script>
 
 <template>

front/src/auth.store.js

@@ -1,5 +1,5 @@
 import { defineStore } from 'pinia';
-import { useRouter } from 'vue-router'
+
 
 export const useAuthStore = defineStore('auth', {
   state: () => ({
@@ -15,7 +15,6 @@ export const useAuthStore = defineStore('auth', {
     logout() {
       this.user = null;
       localStorage.removeItem('user');
-      useRouter().push('/');
     }
   }
 });

front/src/main.js

@@ -1,13 +1,8 @@
 import { createApp } from 'vue'
 import { createI18n } from "vue-i18n";
 import { createPinia } from 'pinia'
-import { createRouter, createWebHistory } from 'vue-router'
+import { router } from './router.js'
 import App from './App.vue'
-import BooksBrowser from './BooksBrowser.vue'
-import AddBook from './AddBook.vue'
-import SignUp from './SignUp.vue'
-import LogIn from './LogIn.vue'
-import Home from './Home.vue'
 
 import fr from './locales/fr.json';
 import en from './locales/en.json';
@@ -21,19 +16,6 @@ const i18n = createI18n({
 });
 
 
-const routes = [
-  { path: '/', component: Home },
-  { path: '/books', component: BooksBrowser },
-  { path: '/add', component: AddBook },
-  { path: '/signup', component: SignUp },
-  { path: '/login', component: LogIn },
-]
-
-export const router = createRouter({
-  history: createWebHistory(),
-  routes,
-})
-
 const pinia = createPinia()
 
 createApp(App).use(i18n).use(pinia).use(router).mount('#app')

front/src/router.js

@@ -0,0 +1,20 @@
+import { createRouter, createWebHistory } from 'vue-router'
+
+import BooksBrowser from './BooksBrowser.vue'
+import AddBook from './AddBook.vue'
+import SignUp from './SignUp.vue'
+import LogIn from './LogIn.vue'
+import Home from './Home.vue'
+
+const routes = [
+  { path: '/', component: Home },
+  { path: '/books', component: BooksBrowser },
+  { path: '/add', component: AddBook },
+  { path: '/signup', component: SignUp },
+  { path: '/login', component: LogIn },
+]
+
+export const router = createRouter({
+  history: createWebHistory(),
+  routes,
+})