From 573220dba0ea5c1b598dafebd78f1191d0bad5c4 Mon Sep 17 00:00:00 2001
From: stianjsu <stianjsu@gmail.com>
Date: Fri, 8 Sep 2023 17:05:47 +0200
Subject: [PATCH 1/3] PB-17h: adds logout endpoint

---
 application/backend/app/api/auth.py | 10 +++++++++-
 1 file changed, 9 insertions(+), 1 deletion(-)

diff --git a/application/backend/app/api/auth.py b/application/backend/app/api/auth.py
index c82fe6bb..70e0e1e8 100644
--- a/application/backend/app/api/auth.py
+++ b/application/backend/app/api/auth.py
@@ -5,7 +5,7 @@
 from app.repositories.user_repository import UserRepository
 from app.models.user_schema import UserSchema
 from app.auth import auth
-from flask_jwt_extended import create_access_token, create_refresh_token, jwt_required, get_jwt_identity, set_access_cookies
+from flask_jwt_extended import create_access_token, create_refresh_token, jwt_required, get_jwt_identity, set_access_cookies, unset_jwt_cookies
 from app.services.slack_organization_service import SlackOrganizationService
 from app.services.injector import injector
 
@@ -123,3 +123,11 @@ def get(self):
             set_access_cookies(response, access_token)
             return response
         return abort(401, message = "User email not available or not verified by Slack.")
+
+
+@bp.route("/logout")
+class Auth(views.MethodView):
+    def delete(self):
+        response = jsonify(msg="Successfully logged out")
+        unset_jwt_cookies(response)
+        return response

From 52974c088c6c5b86045f46e7720cb277621f81a1 Mon Sep 17 00:00:00 2001
From: stianjsu <stianjsu@gmail.com>
Date: Fri, 8 Sep 2023 18:26:41 +0200
Subject: [PATCH 2/3] PB-17h: adds navbar component to Admin page

---
 .../next-frontend/pages/admin/index.tsx       |  3 +-
 .../src/Admin/scenarios/Navbar.tsx            | 34 ++++++++-----------
 2 files changed, 16 insertions(+), 21 deletions(-)

diff --git a/application/next-frontend/pages/admin/index.tsx b/application/next-frontend/pages/admin/index.tsx
index c3e2ce14..41df3301 100644
--- a/application/next-frontend/pages/admin/index.tsx
+++ b/application/next-frontend/pages/admin/index.tsx
@@ -2,6 +2,7 @@ import { GetServerSideProps } from 'next'
 import jwtDecode from 'jwt-decode'
 import type { JwtToken, User } from '@/Admin/types/User'
 import { Home } from 'Admin/scenarios/Home'
+import { Navbar } from '@/Admin/scenarios/Navbar'
 
 export const getServerSideProps: GetServerSideProps = async ({ req }) => {
     const jwt = req.cookies['access_token_cookie']
@@ -18,7 +19,7 @@ export const getServerSideProps: GetServerSideProps = async ({ req }) => {
 const AdminHome = ({ user }: { user: User }) => {
     return (
         <div>
-            <h1>{user.name} logged in as admin</h1>
+            <Navbar user={user} />
             <Home />
         </div>
     )
diff --git a/application/next-frontend/src/Admin/scenarios/Navbar.tsx b/application/next-frontend/src/Admin/scenarios/Navbar.tsx
index 73275fa8..15acc0e4 100644
--- a/application/next-frontend/src/Admin/scenarios/Navbar.tsx
+++ b/application/next-frontend/src/Admin/scenarios/Navbar.tsx
@@ -1,26 +1,20 @@
-import Link from 'next/link'
+import { useRouter } from 'next/router'
+import { User } from '../types/User'
 
-const Navbar = () => {
-    const navbar = [
-        { name: 'Home', link: '/admin' },
-        { name: 'About', link: '/admin/about' },
-        { name: 'Pictures', link: '/admin/pictures' },
-    ]
+const Navbar = ({ user }: { user: User }) => {
+    const router = useRouter()
 
+    const logout = async () => {
+        const res = await fetch('/auth/logout') // TODO: change to apihelper delete method
+
+        if (res.ok) router.push('/login')
+    }
     return (
-        <div className="overflow-hidden bg-teal-400 text-gray-700">
-            <ul className="flex items-center space-x-6 p-4">
-                {navbar.map((entry) => (
-                    <li className="m-3 cursor-pointer" key={entry.name}>
-                        <Link
-                            href={entry.link}
-                            className="text-lg font-bold transition duration-300 hover:text-gray-500"
-                        >
-                            {entry.name}
-                        </Link>
-                    </li>
-                ))}
-            </ul>
+        <div className="flex w-full items-center gap-4 overflow-hidden bg-teal-400 px-8 py-4 text-gray-700">
+            <div className="flex-1">Logged in as {user.name}</div>
+            <button className="m-auto w-fit border border-black px-8 py-2 hover:bg-slate-300" onClick={logout}>
+                Logout
+            </button>
         </div>
     )
 }

From 9266ab263b8f1fa373f44d5c7c726c41e7f91914 Mon Sep 17 00:00:00 2001
From: stianjsu <stianjsu@gmail.com>
Date: Sat, 9 Sep 2023 20:53:41 +0200
Subject: [PATCH 3/3] PB-17h: adds apiHelpermethod for log out request

---
 .../next-frontend/src/Admin/scenarios/Navbar.tsx       | 10 +++++++---
 1 file changed, 7 insertions(+), 3 deletions(-)

diff --git a/application/next-frontend/src/Admin/scenarios/Navbar.tsx b/application/next-frontend/src/Admin/scenarios/Navbar.tsx
index 15acc0e4..f6255e25 100644
--- a/application/next-frontend/src/Admin/scenarios/Navbar.tsx
+++ b/application/next-frontend/src/Admin/scenarios/Navbar.tsx
@@ -1,13 +1,17 @@
 import { useRouter } from 'next/router'
 import { User } from '../types/User'
+import { apiRequestHelper } from '@/api/utils'
 
 const Navbar = ({ user }: { user: User }) => {
     const router = useRouter()
 
     const logout = async () => {
-        const res = await fetch('/auth/logout') // TODO: change to apihelper delete method
-
-        if (res.ok) router.push('/login')
+        try {
+            const res = await apiRequestHelper.del<{ msg: string }>('/auth/logout')
+            if (res) router.push('/login')
+        } catch (err) {
+            console.error(err)
+        }
     }
     return (
         <div className="flex w-full items-center gap-4 overflow-hidden bg-teal-400 px-8 py-4 text-gray-700">