From 2cb8b1dc15d51b1cfec6d492af5c45d7860054e3 Mon Sep 17 00:00:00 2001
From: Spythere <spythere@protonmail.com>
Date: Tue, 31 Jan 2023 17:13:34 +0100
Subject: [PATCH] =?UTF-8?q?auth:=20dodano=20guard=20=C5=9Bcie=C5=BCek?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 .env                        |  2 +-
 src/App.vue                 | 32 +++++++++++---------------------
 src/mixins/useRouteGuard.ts | 30 ++++++++++++++++++++++++++++++
 src/store.ts                |  5 +++--
 src/types/types.ts          |  2 ++
 5 files changed, 47 insertions(+), 24 deletions(-)
 create mode 100644 src/mixins/useRouteGuard.ts

diff --git a/.env b/.env
index 6d8c16e..add8602 100644
--- a/.env
+++ b/.env
@@ -1,2 +1,2 @@
 VITE_API_URL="https://spythere.pl"
-VITE_API_URL_DEV="http://localhost:3000"
\ No newline at end of file
+VITE_API_URL_DEV="https://spythere.pl"
\ No newline at end of file
diff --git a/src/App.vue b/src/App.vue
index 60df669..9b6cad2 100644
--- a/src/App.vue
+++ b/src/App.vue
@@ -5,38 +5,28 @@
 </template>
 
 <script lang="ts">
-import { computed, defineComponent, watch } from 'vue';
+import { defineComponent } from 'vue';
 import dataMixin from './mixins/dataMixin';
-import { useStore } from './store';
 import PopUpCard from './components/PopUpCard.vue';
-import axios, { AxiosResponse } from 'axios';
-import { RouterView, useRouter } from 'vue-router';
-import { ILoginResponse, IUser, AuthState } from './types/types';
+import axios from 'axios';
+import { RouterView } from 'vue-router';
+import { IUser, AuthState } from './types/types';
+import useRouteGuard from './mixins/useRouteGuard';
+import { useStore } from './store';
 
 export default defineComponent({
   mixins: [dataMixin],
   components: { PopUpCard },
+
   setup() {
-    const store = useStore();
-    const router = useRouter();
-
-    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('/');
-      }
-    );
+    const { routeAuthGuard } = useRouteGuard();
+    routeAuthGuard();
 
     return {
-      store,
+      store: useStore(),
     };
   },
+
   methods: {
     async autoLogin() {
       const token = window.localStorage.getItem('auth-token');
diff --git a/src/mixins/useRouteGuard.ts b/src/mixins/useRouteGuard.ts
new file mode 100644
index 0000000..7afa6a0
--- /dev/null
+++ b/src/mixins/useRouteGuard.ts
@@ -0,0 +1,30 @@
+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/store.ts b/src/store.ts
index 89e392a..3fab221 100644
--- a/src/store.ts
+++ b/src/store.ts
@@ -1,6 +1,5 @@
 import { defineStore } from 'pinia';
-import { AuthState, Availability, ChangeProp, HeaderTypes, IStore } from './types/types';
-import { getAvailabilityValue } from './types/typeUitls';
+import { AuthState, IStore } from './types/types';
 
 export const useStore = defineStore('store', {
   state: () =>
@@ -26,6 +25,8 @@ export const useStore = defineStore('store', {
       alertMessage: '',
       confirmMessage: '',
 
+      maxVisibleResults: 15,
+
       changesResponse: [],
     } as IStore),
 });
diff --git a/src/types/types.ts b/src/types/types.ts
index c9ce655..516fa4a 100644
--- a/src/types/types.ts
+++ b/src/types/types.ts
@@ -89,6 +89,8 @@ export interface IStore {
   alertMessage: string;
   confirmMessage: string;
 
+  maxVisibleResults: number;
+
   changesResponse: string[];
 }