From 7c0accbbceb9aa6065f2e09b37fcafab1d4b5d68 Mon Sep 17 00:00:00 2001
From: Spythere <spythere@protonmail.com>
Date: Sat, 16 Sep 2023 18:59:37 +0200
Subject: [PATCH] =?UTF-8?q?hotfixy=20routing=C3=B3w?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 src/App.vue                 | 16 +++++++---------
 src/mixins/useRouteGuard.ts | 30 ------------------------------
 src/router.ts               |  3 +++
 src/views/LoginView.vue     |  3 +--
 4 files changed, 11 insertions(+), 41 deletions(-)
 delete mode 100644 src/mixins/useRouteGuard.ts

diff --git a/src/App.vue b/src/App.vue
index d358d12..ad3ddd3 100644
--- a/src/App.vue
+++ b/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;
     },
   },
 
diff --git a/src/mixins/useRouteGuard.ts b/src/mixins/useRouteGuard.ts
deleted file mode 100644
index 7afa6a0..0000000
--- a/src/mixins/useRouteGuard.ts
+++ /dev/null
@@ -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,
-  };
-};
-
diff --git a/src/router.ts b/src/router.ts
index 736d049..2ccfd9b 100644
--- a/src/router.ts
+++ b/src/router.ts
@@ -12,6 +12,9 @@ const routes: Array<RouteRecordRaw> = [
   {
     path: '/login',
     name: 'LoginView',
+    meta: {
+      loginPage: true,
+    },
     component: () => import('./views/LoginView.vue'),
   },
 ];
diff --git a/src/views/LoginView.vue b/src/views/LoginView.vue
index e723326..5b7aaf0 100644
--- a/src/views/LoginView.vue
+++ b/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(