hotfixy routingów

src/App.vue

@@ -1,7 +1,7 @@
 <template>
   <PopUpCard v-if="store.alertMessage || store.confirmMessage" />
 
-  <router-view></router-view>
+  <router-view v-if="!tokenLoading"></router-view>
 </template>
 
 <script lang="ts">
@@ -9,7 +9,6 @@ import { defineComponent } from 'vue';
 import PopUpCard from './components/PopUpCard.vue';
 import { RouterView } from 'vue-router';
 import { AuthState } from './types/types';
-import useRouteGuard from './mixins/useRouteGuard';
 import { baseURL, useStore } from './store';
 import useLocalStorage from './mixins/useLocalStorage';
 import axios from 'axios';
@@ -18,21 +17,20 @@ export default defineComponent({
   components: { PopUpCard },
 
   setup() {
-    const { routeAuthGuard } = useRouteGuard();
     const { setupStorage } = useLocalStorage();
 
-    // routeAuthGuard();
     setupStorage();
 
     return {
       store: useStore(),
+      tokenLoading: false,
     };
   },
 
   methods: {
     async autoLogin() {
       try {
-        this.store.authState = AuthState.LOADING;
+        this.tokenLoading = true;
 
         const response = await axios.post(
           '/auth/token',
@@ -43,14 +41,14 @@ export default defineComponent({
           }
         );
 
-        this.store.user = response.data;
-        this.store.authState = AuthState.AUTHORIZED;
-
         this.$router.push('/');
+        this.store.user = response.data;
       } catch (error) {
         this.$router.push('/login');
-        this.store.authState = AuthState.UNAUTHORIZED;
+        this.store.user = null;
       }
+
+      this.tokenLoading = false;
     },
   },
 

src/mixins/useRouteGuard.ts

@@ -1,30 +0,0 @@
-import { computed, defineComponent, watch } from 'vue';
-import { useRouter } from 'vue-router';
-import { useStore } from '../store';
-import { AuthState } from '../types/types';
-
-export default () => {
-  const store = useStore();
-  const router = useRouter();
-
-  const routeAuthGuard = () => {
-    router.beforeEach(async (to, from, next) => {
-      if (store.authState == AuthState.AUTHORIZED && to.path == '/login') return next({ path: '/' });
-
-      return next();
-    });
-
-    watch(
-      computed(() => store.authState),
-      (state) => {
-        if (router.currentRoute.value.path == '/login' && state == AuthState.AUTHORIZED) router.push('/');
-        if (state == AuthState.UNAUTHORIZED) router.push('/login');
-      }
-    );
-  };
-
-  return {
-    routeAuthGuard,
-  };
-};
-

src/router.ts

@@ -12,6 +12,9 @@ const routes: Array<RouteRecordRaw> = [
   {
     path: '/login',
     name: 'LoginView',
+    meta: {
+      loginPage: true,
+    },
     component: () => import('./views/LoginView.vue'),
   },
 ];

src/views/LoginView.vue

@@ -1,5 +1,5 @@
 <template>
-  <div class="login" v-if="store.authState != AuthState.LOADING">
+  <div class="login">
     <div class="login-header">
       <img src="/icon-logo.svg" alt="logo" />
       <h1>Stacjownik Station Manager</h1>
@@ -55,7 +55,6 @@ export default defineComponent({
   methods: {
     async signIn(e: Event) {
       this.loginState = LoginState.LOADING;
-      this.store.authState = AuthState.LOADING;
 
       try {
         const response = await axios.post(