From c57fb23a5666611710903c7cddcb2089b080e803 Mon Sep 17 00:00:00 2001
From: Filip Borum Poulsen <fbp@deif.com>
Date: Thu, 27 Apr 2023 10:13:20 +0200
Subject: [PATCH] Added logout button

---
 client/src/components/NavBar.vue |  1 +
 client/src/router/index.ts       |  8 ++++++++
 client/src/views/Logout.vue      | 23 +++++++++++++++++++++++
 server/src/routes/index.ts       |  2 ++
 server/src/routes/logout.ts      | 11 +++++++++++
 5 files changed, 45 insertions(+)
 create mode 100644 client/src/views/Logout.vue
 create mode 100644 server/src/routes/logout.ts

diff --git a/client/src/components/NavBar.vue b/client/src/components/NavBar.vue
index 90450e4..00ad9a2 100644
--- a/client/src/components/NavBar.vue
+++ b/client/src/components/NavBar.vue
@@ -63,6 +63,7 @@ export default {
                 <RouterLink to="/admin/trainer" v-if="loggedIn && user.isAdmin">Trænere</RouterLink>
                 <RouterLink to="/admin/center" v-if="loggedIn && user.isAdmin">Centre</RouterLink>
                 <RouterLink to="/user/profile" v-if="loggedIn">Profil</RouterLink>
+                <RouterLink to="/logout" v-if="loggedIn">Log ud</RouterLink>
             </div>
         </div>
     </div>
diff --git a/client/src/router/index.ts b/client/src/router/index.ts
index cc9ef6c..c6d673d 100644
--- a/client/src/router/index.ts
+++ b/client/src/router/index.ts
@@ -72,6 +72,14 @@ const router = createRouter({
       // this generates a separate chunk (About.[hash].js) for this route
       // which is lazy-loaded when the route is visited.
       component: () => import('../views/user/UserProfile.vue')
+    },
+    {
+      path: '/logout',
+      name: 'Logout',
+      // route level code-splitting
+      // this generates a separate chunk (About.[hash].js) for this route
+      // which is lazy-loaded when the route is visited.
+      component: () => import('../views/Logout.vue')
     }
   ]
 })
diff --git a/client/src/views/Logout.vue b/client/src/views/Logout.vue
new file mode 100644
index 0000000..a5fbcd4
--- /dev/null
+++ b/client/src/views/Logout.vue
@@ -0,0 +1,23 @@
+<template></template>
+
+<script lang="ts">
+import { useLoginStore } from '@/stores/login'
+
+export default {
+    name: "Logout",
+    setup() {
+        const loginStore = useLoginStore();
+        const { setLoginState } = loginStore;
+
+        return { setLoginState };
+    },
+    async created() {
+        await fetch(`${import.meta.env.VITE_BASE_API_URL}/logout`, {
+            credentials: import.meta.env.DEV ? "include" : undefined,
+            method: "POST"
+        });
+        this.setLoginState(false);
+        this.$router.push({ path: "/" });
+    }
+}
+</script>
\ No newline at end of file
diff --git a/server/src/routes/index.ts b/server/src/routes/index.ts
index 2a07aa9..47538b2 100644
--- a/server/src/routes/index.ts
+++ b/server/src/routes/index.ts
@@ -3,6 +3,7 @@ import express, { Express, Router } from "express";
 const router: Router = express.Router();
 
 import login from "./login"
+import logout from "./logout"
 import register from "./register"
 import center from "./center";
 import trainer from "./trainer/index";
@@ -18,6 +19,7 @@ import { bodyParserErrorHandler } from "../middlewares/bodyParserErrorHandler";
 router.use(stripeWebhook);
 router.use(express.json(), bodyParserErrorHandler());
 router.use(login);
+router.use(logout);
 router.use(register);
 router.use(center);
 router.use(trainer);
diff --git a/server/src/routes/logout.ts b/server/src/routes/logout.ts
new file mode 100644
index 0000000..732d349
--- /dev/null
+++ b/server/src/routes/logout.ts
@@ -0,0 +1,11 @@
+import express, { Express, Router, Request, Response } from "express";
+
+const router: Router = express.Router();
+
+router.post("/logout", async (req: Request, res: Response) => {
+    res.clearCookie("auth-token");
+
+    return res.sendStatus(204);
+})
+
+export default router;
\ No newline at end of file