fix loginu

.env

@@ -1,3 +1,3 @@
 VITE_API_URL="https://stacjownik.spythere.pl"
 VITE_API_URL_DEV="http://localhost:3001"
-VITE_API_DEV=1
+VITE_API_DEV=0

src/App.vue

@@ -12,6 +12,7 @@ import { AuthState } from './types/types';
 import { baseURL, useStore } from './store';
 import useLocalStorage from './mixins/useLocalStorage';
 import axios from 'axios';
+import { IUser } from './types/types';
 
 export default defineComponent({
   components: { PopUpCard },
@@ -32,7 +33,7 @@ export default defineComponent({
       try {
         this.tokenLoading = true;
 
-        const response = await axios.post(
+        const response = await axios.post<IUser>(
           '/auth/token',
           {},
           {
@@ -41,11 +42,11 @@ export default defineComponent({
           }
         );
 
+        this.store.setUserData(response.data);
         this.$router.push('/');
-        this.store.user = response.data;
       } catch (error) {
+        this.store.removeUserData();
         this.$router.push('/login');
-        this.store.user = null;
       }
 
       this.tokenLoading = false;

src/components/TableActions.vue

@@ -157,7 +157,9 @@ export default defineComponent({
 
     async signOut() {
       await axios.post('/auth/logout', {}, { baseURL, withCredentials: true });
+
       this.$router.push('/login');
+      this.store.removeUserData();
     },
 
     onNotifyCheckboxChange(value: boolean) {

src/main.ts

@@ -15,7 +15,7 @@ app.mount('#app');
 router.beforeEach((to, from, next) => {
   const store = useStore();
 
-  if (to.meta.protected && !store.user) {
+  if (to.meta.protected && !store.user && !window.localStorage.getItem('user')) {
     next('/login');
     return;
   }

src/store.ts

@@ -2,7 +2,7 @@ import { defineStore } from 'pinia';
 import { AuthState, ILoginResponse, IStore, IUser, SceneryRowItem } from './types/types';
 import axios from 'axios';
 
-export const baseURL = import.meta.env[`VITE_API_URL${import.meta.env.DEV ? '_DEV' : ''}`];
+export const baseURL = import.meta.env[`VITE_API_URL${import.meta.env.DEV === '1' ? '_DEV' : ''}`];
 
 export const useStore = defineStore('store', {
   state: () =>
@@ -20,7 +20,7 @@ export const useStore = defineStore('store', {
       currentStation: null,
       searchedSceneryName: '',
       selectedStationName: '',
-      
+
       user: null,
       notifyDiscord: true,
 
@@ -70,6 +70,18 @@ export const useStore = defineStore('store', {
 
       return response;
     },
+
+    setUserData(responseData: IUser) {
+      this.authState = AuthState.AUTHORIZED;
+      this.user = responseData;
+      window.localStorage.setItem('user', JSON.stringify(responseData));
+    },
+
+    removeUserData() {
+      this.authState = AuthState.UNAUTHORIZED;
+      this.user = null;
+      window.localStorage.removeItem('user');
+    },
   },
 
   getters: {

src/types/types.ts

@@ -90,6 +90,7 @@ export enum AuthState {
 export interface IUser {
   name: string;
   id: number;
+  iat?: number;
 }
 
 export interface IStore {

src/views/LoginView.vue

@@ -23,7 +23,7 @@
 <script lang="ts">
 import { defineComponent } from 'vue';
 import { useStore, baseURL } from '../store';
-import { AuthState } from '../types/types';
+import { AuthState, IUser } from '../types/types';
 import axios from 'axios';
 
 enum LoginState {
@@ -57,7 +57,7 @@ export default defineComponent({
       this.loginState = LoginState.LOADING;
 
       try {
-        const response = await axios.post(
+        const response = await axios.post<IUser>(
           'auth/login',
           { username: this.name, password: this.password },
           {
@@ -66,16 +66,13 @@ export default defineComponent({
           }
         );
 
+        this.store.setUserData(response.data);
+
         this.loginState = LoginState.LOADED;
-
-        this.store.authState = AuthState.AUTHORIZED;
-        this.store.user = response.data;
         this.$router.push('/');
-
-        this.store.fetchSceneriesData();
       } catch (e: any) {
         this.loginState = LoginState.ERROR;
-        this.store.authState = AuthState.UNAUTHORIZED;
+        this.store.removeUserData();
 
         if (!e.response || e.response.status === undefined) {
           this.errorMessage = 'Wystąpił błąd podczas łączenia z serwerem!';

src/views/ManagerView.vue

@@ -1,5 +1,5 @@
 <template>
-  <div class="manager">
+  <div class="manager" v-if="store.user">
     <RoutesModal v-if="store.currentStation" />
     <UpdateCard v-if="store.changesResponse.length > 0" />