From ebb41dfc3993e000c6584d22acbe467f9707c08c Mon Sep 17 00:00:00 2001
From: kodaline <doncheva.adelina@gmail.com>
Date: Thu, 10 Oct 2024 00:19:23 +0200
Subject: [PATCH 1/9] add: user dropdown

Added a user dropdown to manage logout, theme change

Current logged username is displayed as additional info

refers to issue #93
---
 components.d.ts                 |  6 ++++
 src/components/Header.vue       |  2 +-
 src/components/Logout.vue       | 13 +++++++
 src/components/ThemeButton.vue  |  7 ++--
 src/components/UserDropdown.vue | 61 +++++++++++++++++++++++++++++++++
 src/stores/useMainStore.ts      | 12 +++++++
 6 files changed, 96 insertions(+), 5 deletions(-)
 create mode 100644 src/components/Logout.vue
 create mode 100644 src/components/UserDropdown.vue

diff --git a/components.d.ts b/components.d.ts
index fc6c119..d782beb 100644
--- a/components.d.ts
+++ b/components.d.ts
@@ -28,18 +28,23 @@ declare module 'vue' {
     HeroiconsHome20Solid: typeof import('~icons/heroicons/home20-solid')['default']
     HeroiconsInformationCircleSolid: typeof import('~icons/heroicons/information-circle-solid')['default']
     HeroiconsLink20Solid: typeof import('~icons/heroicons/link20-solid')['default']
+    HeroiconsLogout: typeof import('~icons/heroicons/logout')['default']
+    HeroiconsLogoutSolid: typeof import('~icons/heroicons/logout-solid')['default']
     HeroiconsMagnifyingGlass20Solid: typeof import('~icons/heroicons/magnifying-glass20-solid')['default']
     HeroiconsMicrophoneSolid: typeof import('~icons/heroicons/microphone-solid')['default']
     HeroiconsMoonSolid: typeof import('~icons/heroicons/moon-solid')['default']
+    'HeroiconsOutline:logout': typeof import('~icons/heroicons-outline/logout')['default']
     HeroiconsPaperAirplaneSolid: typeof import('~icons/heroicons/paper-airplane-solid')['default']
     HeroiconsSunSolid: typeof import('~icons/heroicons/sun-solid')['default']
     HeroiconsTrashSolid: typeof import('~icons/heroicons/trash-solid')['default']
+    HeroiconsUserSolid: typeof import('~icons/heroicons/user-solid')['default']
     HeroiconsXMark20Solid: typeof import('~icons/heroicons/x-mark20-solid')['default']
     InputBox: typeof import('./src/components/InputBox.vue')['default']
     Listbox: typeof import('@headlessui/vue')['Listbox']
     ListboxButton: typeof import('@headlessui/vue')['ListboxButton']
     ListboxOption: typeof import('@headlessui/vue')['ListboxOption']
     ListboxOptions: typeof import('@headlessui/vue')['ListboxOptions']
+    Logout: typeof import('./src/components/Logout.vue')['default']
     MemorySelect: typeof import('./src/components/MemorySelect.vue')['default']
     Menu: typeof import('@headlessui/vue')['Menu']
     MenuButton: typeof import('@headlessui/vue')['MenuButton']
@@ -80,5 +85,6 @@ declare module 'vue' {
     TransitionChild: typeof import('@headlessui/vue')['TransitionChild']
     TransitionRoot: typeof import('@headlessui/vue')['TransitionRoot']
     UseImage: typeof import('@vueuse/components')['UseImage']
+    UserDropdown: typeof import('./src/components/UserDropdown.vue')['default']
   }
 }
diff --git a/src/components/Header.vue b/src/components/Header.vue
index e4cf21a..8f30bb4 100644
--- a/src/components/Header.vue
+++ b/src/components/Header.vue
@@ -81,7 +81,7 @@ const showSettings = computed(
 			</ul>
 		</div>
 		<div class="navbar-end">
-			<ThemeButton />
+			<UserDropdown />
 		</div>
 	</div>
 </template>
diff --git a/src/components/Logout.vue b/src/components/Logout.vue
new file mode 100644
index 0000000..03868ae
--- /dev/null
+++ b/src/components/Logout.vue
@@ -0,0 +1,13 @@
+<script setup lang="ts">
+import { useMainStore } from '@/stores/useMainStore';
+
+const store = useMainStore()
+const { logoutCurrentUser } = store
+
+</script>
+
+<template>
+	<button class="opacity-50" @click="logoutCurrentUser()">
+    <heroicons-outline:logout class="size-5" />
+  </button>
+</template>
diff --git a/src/components/ThemeButton.vue b/src/components/ThemeButton.vue
index 8a3dfbb..337ef79 100644
--- a/src/components/ThemeButton.vue
+++ b/src/components/ThemeButton.vue
@@ -4,7 +4,6 @@ import githubLight from 'highlight.js/styles/github.css?raw'
 import githubDark from 'highlight.js/styles/github-dark.css?raw'
 
 const store = useMainStore()
-const { toggleDark } = store
 const { isDark } = storeToRefs(store)
 
 const { css } = useStyleTag(isDark.value ? githubDark : githubLight)
@@ -15,9 +14,9 @@ watchEffect(() => {
 </script>
 
 <template>
-	<button class="btn btn-circle btn-ghost swap" @click="toggleDark()">
+	<button class="swap opacity-50">
 		<input v-model="isDark" type="checkbox" class="modal-toggle" />
-		<heroicons-sun-solid class="swap-on size-6" />
-		<heroicons-moon-solid class="swap-off size-6" />
+		<heroicons-sun-solid class="swap-on size-5" />
+		<heroicons-moon-solid class="swap-off size-5" />
 	</button>
 </template>
diff --git a/src/components/UserDropdown.vue b/src/components/UserDropdown.vue
new file mode 100644
index 0000000..d765da4
--- /dev/null
+++ b/src/components/UserDropdown.vue
@@ -0,0 +1,61 @@
+<script setup lang="ts">
+import { useMainStore } from '@stores/useMainStore'
+import githubLight from 'highlight.js/styles/github.css?raw'
+import githubDark from 'highlight.js/styles/github-dark.css?raw'
+
+const store = useMainStore()
+console.log('jwtPayload store', store.jwtPayload)
+console.log('cookie store', store.cookie)
+console.log('document cookie', document.cookie)
+const { toggleDark } = store
+const { logoutCurrentUser } = store
+const { isDark } = storeToRefs(store)
+const { css } = useStyleTag(isDark.value ? githubDark : githubLight)
+
+watchEffect(() => {
+	css.value = isDark.value ? githubDark : githubLight
+})
+</script>
+
+<template>
+    <div class="dropdown dropdown-bottom">
+    <button class="btn btn-circle btn-primary shadow-lg">
+      <heroicons-user-solid class="size-6" />
+    </button>
+      <ul tabindex="0" class="text-sm dropdown-content join join-vertical !right-0 z-10 mt-6 w-48 p-0">
+        <li>
+          <button
+					class="btn join-item w-full flex-nowrap px-2 text-left font-small opacity-100 pointer-events-none cursor-not-allowed">
+					<span class="grow text-left">Signed in as</span>
+          <span class="grow text-right text-primary">
+            {{ store.jwtPayload?.username }}
+          </span>
+          </button>
+        </li>
+        <li>
+          <button
+					class="btn join-item w-full flex-nowrap px-2 text-left font-small"
+          @click="toggleDark()">
+					<span class="grow text-left">
+            Change Theme
+          </span>
+          <span class="rounded-lg p-1">
+						<ThemeButton />
+					</span>
+          </button>
+        </li>
+        <li>
+          <button
+					class="btn join-item w-full flex-nowrap px-2 text-left font-small"
+          @click="logoutCurrentUser()">
+					<span class="grow text-left">
+            Logout
+          </span>
+          <span class="rounded-lg p-1">
+						<Logout />
+					</span>
+          </button>
+        </li>
+      </ul>
+    </div>
+</template>
diff --git a/src/stores/useMainStore.ts b/src/stores/useMainStore.ts
index 013e86e..72609c1 100644
--- a/src/stores/useMainStore.ts
+++ b/src/stores/useMainStore.ts
@@ -83,12 +83,24 @@ export const useMainStore = defineStore('main', () => {
 		},
 	})
 
+	const logoutCurrentUser = () => {
+		const cookies = document.cookie.split(";");
+
+		cookies.forEach(cookie => {
+			const name = cookie.split("=")[0].trim();
+			document.cookie = `${name}=;path=/;domain=${window.location.hostname};`;
+		})
+		cookie.value = ''
+		window.location.href = window.location.origin + '/auth/login' // this is horrible coding, TODO also use parameter for /auth/login
+	}
+
 	return {
 		isDark,
 		pluginsFilters,
 		toggleDark,
 		cookie,
 		jwtPayload,
+		logoutCurrentUser,
 	}
 })
 

From e28cee3812ed7ac3cc2b999c0d9d4e215fc33c19 Mon Sep 17 00:00:00 2001
From: kodaline <doncheva.adelina@gmail.com>
Date: Thu, 10 Oct 2024 00:30:58 +0200
Subject: [PATCH 2/9] imp: user button styling change

---
 src/components/UserDropdown.vue | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/src/components/UserDropdown.vue b/src/components/UserDropdown.vue
index d765da4..ee16636 100644
--- a/src/components/UserDropdown.vue
+++ b/src/components/UserDropdown.vue
@@ -19,7 +19,7 @@ watchEffect(() => {
 
 <template>
     <div class="dropdown dropdown-bottom">
-    <button class="btn btn-circle btn-primary shadow-lg">
+    <button class="btn btn-circle btn-ghost">
       <heroicons-user-solid class="size-6" />
     </button>
       <ul tabindex="0" class="text-sm dropdown-content join join-vertical !right-0 z-10 mt-6 w-48 p-0">

From 3210344f9607cf8db8f3acfbedb15a2450b92d15 Mon Sep 17 00:00:00 2001
From: kodaline <doncheva.adelina@gmail.com>
Date: Thu, 10 Oct 2024 09:59:35 +0200
Subject: [PATCH 3/9] imp: moved components

Component ThemeButton and Logout moved inside UserDropdown
---
 src/components/Logout.vue       | 13 -------------
 src/components/ThemeButton.vue  | 22 ----------------------
 src/components/UserDropdown.vue | 10 ++++++++--
 3 files changed, 8 insertions(+), 37 deletions(-)
 delete mode 100644 src/components/Logout.vue
 delete mode 100644 src/components/ThemeButton.vue

diff --git a/src/components/Logout.vue b/src/components/Logout.vue
deleted file mode 100644
index 03868ae..0000000
--- a/src/components/Logout.vue
+++ /dev/null
@@ -1,13 +0,0 @@
-<script setup lang="ts">
-import { useMainStore } from '@/stores/useMainStore';
-
-const store = useMainStore()
-const { logoutCurrentUser } = store
-
-</script>
-
-<template>
-	<button class="opacity-50" @click="logoutCurrentUser()">
-    <heroicons-outline:logout class="size-5" />
-  </button>
-</template>
diff --git a/src/components/ThemeButton.vue b/src/components/ThemeButton.vue
deleted file mode 100644
index 337ef79..0000000
--- a/src/components/ThemeButton.vue
+++ /dev/null
@@ -1,22 +0,0 @@
-<script setup lang="ts">
-import { useMainStore } from '@stores/useMainStore'
-import githubLight from 'highlight.js/styles/github.css?raw'
-import githubDark from 'highlight.js/styles/github-dark.css?raw'
-
-const store = useMainStore()
-const { isDark } = storeToRefs(store)
-
-const { css } = useStyleTag(isDark.value ? githubDark : githubLight)
-
-watchEffect(() => {
-	css.value = isDark.value ? githubDark : githubLight
-})
-</script>
-
-<template>
-	<button class="swap opacity-50">
-		<input v-model="isDark" type="checkbox" class="modal-toggle" />
-		<heroicons-sun-solid class="swap-on size-5" />
-		<heroicons-moon-solid class="swap-off size-5" />
-	</button>
-</template>
diff --git a/src/components/UserDropdown.vue b/src/components/UserDropdown.vue
index ee16636..75fe7c0 100644
--- a/src/components/UserDropdown.vue
+++ b/src/components/UserDropdown.vue
@@ -40,7 +40,11 @@ watchEffect(() => {
             Change Theme
           </span>
           <span class="rounded-lg p-1">
-						<ThemeButton />
+            <button class="swap opacity-50">
+              <input v-model="isDark" type="checkbox" class="modal-toggle" />
+              <heroicons-sun-solid class="swap-on size-5" />
+              <heroicons-moon-solid class="swap-off size-5" />
+            </button>
 					</span>
           </button>
         </li>
@@ -52,7 +56,9 @@ watchEffect(() => {
             Logout
           </span>
           <span class="rounded-lg p-1">
-						<Logout />
+            <button class="opacity-50" @click="logoutCurrentUser()">
+              <heroicons-outline:logout class="size-5" />
+            </button>
 					</span>
           </button>
         </li>

From 32474504c7713394b033b7051480fbbf38c52808 Mon Sep 17 00:00:00 2001
From: kodaline <doncheva.adelina@gmail.com>
Date: Thu, 10 Oct 2024 10:46:52 +0200
Subject: [PATCH 4/9] imp: useCookies

---
 src/stores/useMainStore.ts | 11 ++++-------
 1 file changed, 4 insertions(+), 7 deletions(-)

diff --git a/src/stores/useMainStore.ts b/src/stores/useMainStore.ts
index 72609c1..3c3e678 100644
--- a/src/stores/useMainStore.ts
+++ b/src/stores/useMainStore.ts
@@ -7,6 +7,7 @@ import { createMongoAbility } from '@casl/ability'
 
 import { instantiateApiClient } from '@services/ApiService'
 import LogService from '@services/LogService'
+import type { LocationQueryRaw } from 'vue-router'
 
 interface Filter {
 	[k: string]: {
@@ -84,14 +85,10 @@ export const useMainStore = defineStore('main', () => {
 	})
 
 	const logoutCurrentUser = () => {
-		const cookies = document.cookie.split(";");
-
-		cookies.forEach(cookie => {
-			const name = cookie.split("=")[0].trim();
-			document.cookie = `${name}=;path=/;domain=${window.location.hostname};`;
-		})
+		const cookies = useCookies().getAll()
+		Object.keys(cookies).forEach(key => delete cookies[key])
 		cookie.value = ''
-		window.location.href = window.location.origin + '/auth/login' // this is horrible coding, TODO also use parameter for /auth/login
+		//window.location.href = window.location.origin + '/auth/login'
 	}
 
 	return {

From 3bf0c257402c6de3e9aebbeae9ca73eeaf37a7ec Mon Sep 17 00:00:00 2001
From: kodaline <doncheva.adelina@gmail.com>
Date: Thu, 10 Oct 2024 10:49:05 +0200
Subject: [PATCH 5/9] edit: redirect

---
 src/stores/useMainStore.ts | 3 ++-
 1 file changed, 2 insertions(+), 1 deletion(-)

diff --git a/src/stores/useMainStore.ts b/src/stores/useMainStore.ts
index 3c3e678..1a80fc5 100644
--- a/src/stores/useMainStore.ts
+++ b/src/stores/useMainStore.ts
@@ -88,7 +88,8 @@ export const useMainStore = defineStore('main', () => {
 		const cookies = useCookies().getAll()
 		Object.keys(cookies).forEach(key => delete cookies[key])
 		cookie.value = ''
-		//window.location.href = window.location.origin + '/auth/login'
+		// find different solution for this redirect, maybe having a LoginView and moving login page to frontend is an idea
+		window.location.href = window.location.origin + '/auth/login'
 	}
 
 	return {

From de6a474e5710e5aad423dd174cded08aafe43ae4 Mon Sep 17 00:00:00 2001
From: kodaline <doncheva.adelina@gmail.com>
Date: Thu, 10 Oct 2024 15:07:05 +0200
Subject: [PATCH 6/9] fix: text aligned to the right

---
 src/components/UserDropdown.vue | 11 +++++------
 1 file changed, 5 insertions(+), 6 deletions(-)

diff --git a/src/components/UserDropdown.vue b/src/components/UserDropdown.vue
index 75fe7c0..e747a2c 100644
--- a/src/components/UserDropdown.vue
+++ b/src/components/UserDropdown.vue
@@ -26,9 +26,8 @@ watchEffect(() => {
         <li>
           <button
 					class="btn join-item w-full flex-nowrap px-2 text-left font-small opacity-100 pointer-events-none cursor-not-allowed">
-					<span class="grow text-left">Signed in as</span>
-          <span class="grow text-right text-primary">
-            {{ store.jwtPayload?.username }}
+          <span class="grow text-right">
+            Signed in as <span class="text-primary">{{ store.jwtPayload?.username }}</span>
           </span>
           </button>
         </li>
@@ -36,7 +35,7 @@ watchEffect(() => {
           <button
 					class="btn join-item w-full flex-nowrap px-2 text-left font-small"
           @click="toggleDark()">
-					<span class="grow text-left">
+					<span class="grow text-right">
             Change Theme
           </span>
           <span class="rounded-lg p-1">
@@ -50,9 +49,9 @@ watchEffect(() => {
         </li>
         <li>
           <button
-					class="btn join-item w-full flex-nowrap px-2 text-left font-small"
+					class="btn join-item w-full flex-nowrap px-2 text-right font-small"
           @click="logoutCurrentUser()">
-					<span class="grow text-left">
+					<span class="grow text-right">
             Logout
           </span>
           <span class="rounded-lg p-1">

From f4eccb39cae53b08ae1af51ba70b2a5b0331c2fc Mon Sep 17 00:00:00 2001
From: kodaline <doncheva.adelina@gmail.com>
Date: Thu, 10 Oct 2024 16:12:40 +0200
Subject: [PATCH 7/9] fix: signed in as area

---
 src/components/UserDropdown.vue | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/src/components/UserDropdown.vue b/src/components/UserDropdown.vue
index e747a2c..9277e36 100644
--- a/src/components/UserDropdown.vue
+++ b/src/components/UserDropdown.vue
@@ -27,7 +27,7 @@ watchEffect(() => {
           <button
 					class="btn join-item w-full flex-nowrap px-2 text-left font-small opacity-100 pointer-events-none cursor-not-allowed">
           <span class="grow text-right">
-            Signed in as <span class="text-primary">{{ store.jwtPayload?.username }}</span>
+            <span class="opacity-60">Signed in as</span> {{ store.jwtPayload?.username }}
           </span>
           </button>
         </li>

From d2dea0ae6a99d2dd1263fe2db7ec1ea946bcef0e Mon Sep 17 00:00:00 2001
From: Dany <zdanymc@gmail.com>
Date: Mon, 14 Oct 2024 14:18:32 +0200
Subject: [PATCH 8/9] small tweaks

---
 components.d.ts                 |  2 +-
 src/components/UserDropdown.vue | 83 ++++++++++++++-------------------
 src/stores/useMainStore.ts      |  3 +-
 3 files changed, 36 insertions(+), 52 deletions(-)

diff --git a/components.d.ts b/components.d.ts
index d782beb..97ff18c 100644
--- a/components.d.ts
+++ b/components.d.ts
@@ -17,6 +17,7 @@ declare module 'vue' {
     HeroiconsAdjustmentsVertical: typeof import('~icons/heroicons/adjustments-vertical')['default']
     HeroiconsArrowDown20Solid: typeof import('~icons/heroicons/arrow-down20-solid')['default']
     HeroiconsArrowPath: typeof import('~icons/heroicons/arrow-path')['default']
+    HeroiconsArrowRightOnRectangle: typeof import('~icons/heroicons/arrow-right-on-rectangle')['default']
     HeroiconsBars3Solid: typeof import('~icons/heroicons/bars3-solid')['default']
     HeroiconsBoltSolid: typeof import('~icons/heroicons/bolt-solid')['default']
     HeroiconsChevronUpDown20Solid: typeof import('~icons/heroicons/chevron-up-down20-solid')['default']
@@ -33,7 +34,6 @@ declare module 'vue' {
     HeroiconsMagnifyingGlass20Solid: typeof import('~icons/heroicons/magnifying-glass20-solid')['default']
     HeroiconsMicrophoneSolid: typeof import('~icons/heroicons/microphone-solid')['default']
     HeroiconsMoonSolid: typeof import('~icons/heroicons/moon-solid')['default']
-    'HeroiconsOutline:logout': typeof import('~icons/heroicons-outline/logout')['default']
     HeroiconsPaperAirplaneSolid: typeof import('~icons/heroicons/paper-airplane-solid')['default']
     HeroiconsSunSolid: typeof import('~icons/heroicons/sun-solid')['default']
     HeroiconsTrashSolid: typeof import('~icons/heroicons/trash-solid')['default']
diff --git a/src/components/UserDropdown.vue b/src/components/UserDropdown.vue
index 9277e36..33d8fad 100644
--- a/src/components/UserDropdown.vue
+++ b/src/components/UserDropdown.vue
@@ -4,12 +4,8 @@ import githubLight from 'highlight.js/styles/github.css?raw'
 import githubDark from 'highlight.js/styles/github-dark.css?raw'
 
 const store = useMainStore()
-console.log('jwtPayload store', store.jwtPayload)
-console.log('cookie store', store.cookie)
-console.log('document cookie', document.cookie)
-const { toggleDark } = store
-const { logoutCurrentUser } = store
-const { isDark } = storeToRefs(store)
+const { logoutCurrentUser, toggleDark } = store
+const { isDark, jwtPayload } = storeToRefs(store)
 const { css } = useStyleTag(isDark.value ? githubDark : githubLight)
 
 watchEffect(() => {
@@ -18,49 +14,38 @@ watchEffect(() => {
 </script>
 
 <template>
-    <div class="dropdown dropdown-bottom">
-    <button class="btn btn-circle btn-ghost">
-      <heroicons-user-solid class="size-6" />
-    </button>
-      <ul tabindex="0" class="text-sm dropdown-content join join-vertical !right-0 z-10 mt-6 w-48 p-0">
-        <li>
-          <button
-					class="btn join-item w-full flex-nowrap px-2 text-left font-small opacity-100 pointer-events-none cursor-not-allowed">
-          <span class="grow text-right">
-            <span class="opacity-60">Signed in as</span> {{ store.jwtPayload?.username }}
-          </span>
-          </button>
-        </li>
-        <li>
-          <button
-					class="btn join-item w-full flex-nowrap px-2 text-left font-small"
-          @click="toggleDark()">
-					<span class="grow text-right">
-            Change Theme
-          </span>
-          <span class="rounded-lg p-1">
-            <button class="swap opacity-50">
-              <input v-model="isDark" type="checkbox" class="modal-toggle" />
-              <heroicons-sun-solid class="swap-on size-5" />
-              <heroicons-moon-solid class="swap-off size-5" />
-            </button>
+	<div class="dropdown dropdown-bottom">
+		<button class="btn btn-circle btn-ghost">
+			<heroicons-user-solid class="size-6" />
+		</button>
+		<ul tabindex="0" class="dropdown-content join join-vertical !right-0 z-10 mt-6 w-40 p-0 text-sm">
+			<li>
+				<button class="font-small btn join-item pointer-events-none w-full cursor-not-allowed flex-nowrap px-2 text-left opacity-100">
+					<span class="grow text-right"> <span class="opacity-60">Signed in as</span> {{ jwtPayload?.username }} </span>
+				</button>
+			</li>
+			<li>
+				<button class="font-small btn join-item w-full flex-nowrap px-2 text-left" @click="toggleDark()">
+					<span class="grow text-right"> Change Theme </span>
+					<span class="rounded-lg p-1">
+						<button class="swap opacity-50">
+							<input v-model="isDark" type="checkbox" class="modal-toggle" />
+							<heroicons-sun-solid class="swap-on size-5" />
+							<heroicons-moon-solid class="swap-off size-5" />
+						</button>
 					</span>
-          </button>
-        </li>
-        <li>
-          <button
-					class="btn join-item w-full flex-nowrap px-2 text-right font-small"
-          @click="logoutCurrentUser()">
-					<span class="grow text-right">
-            Logout
-          </span>
-          <span class="rounded-lg p-1">
-            <button class="opacity-50" @click="logoutCurrentUser()">
-              <heroicons-outline:logout class="size-5" />
-            </button>
+				</button>
+			</li>
+			<li>
+				<button class="font-small btn join-item w-full flex-nowrap px-2 text-right" @click="logoutCurrentUser()">
+					<span class="grow text-right"> Logout </span>
+					<span class="rounded-lg p-1">
+						<button class="opacity-50" @click="logoutCurrentUser()">
+							<heroicons-arrow-right-on-rectangle class="size-5" />
+						</button>
 					</span>
-          </button>
-        </li>
-      </ul>
-    </div>
+				</button>
+			</li>
+		</ul>
+	</div>
 </template>
diff --git a/src/stores/useMainStore.ts b/src/stores/useMainStore.ts
index 1a80fc5..7f79370 100644
--- a/src/stores/useMainStore.ts
+++ b/src/stores/useMainStore.ts
@@ -7,7 +7,6 @@ import { createMongoAbility } from '@casl/ability'
 
 import { instantiateApiClient } from '@services/ApiService'
 import LogService from '@services/LogService'
-import type { LocationQueryRaw } from 'vue-router'
 
 interface Filter {
 	[k: string]: {
@@ -88,7 +87,7 @@ export const useMainStore = defineStore('main', () => {
 		const cookies = useCookies().getAll()
 		Object.keys(cookies).forEach(key => delete cookies[key])
 		cookie.value = ''
-		// find different solution for this redirect, maybe having a LoginView and moving login page to frontend is an idea
+		// TODO: find different solution for this redirect, maybe having a LoginView and moving login page to frontend is an idea
 		window.location.href = window.location.origin + '/auth/login'
 	}
 

From bf7430dfa0c52763a3d33b112d77aef9c1c1f8f0 Mon Sep 17 00:00:00 2001
From: Dany <zdanymc@gmail.com>
Date: Mon, 14 Oct 2024 14:22:39 +0200
Subject: [PATCH 9/9] Update components.d.ts

---
 components.d.ts | 2 --
 1 file changed, 2 deletions(-)

diff --git a/components.d.ts b/components.d.ts
index 97ff18c..11e9065 100644
--- a/components.d.ts
+++ b/components.d.ts
@@ -44,7 +44,6 @@ declare module 'vue' {
     ListboxButton: typeof import('@headlessui/vue')['ListboxButton']
     ListboxOption: typeof import('@headlessui/vue')['ListboxOption']
     ListboxOptions: typeof import('@headlessui/vue')['ListboxOptions']
-    Logout: typeof import('./src/components/Logout.vue')['default']
     MemorySelect: typeof import('./src/components/MemorySelect.vue')['default']
     Menu: typeof import('@headlessui/vue')['Menu']
     MenuButton: typeof import('@headlessui/vue')['MenuButton']
@@ -81,7 +80,6 @@ declare module 'vue' {
     RouterView: typeof import('vue-router')['RouterView']
     SelectBox: typeof import('./src/components/SelectBox.vue')['default']
     SidePanel: typeof import('./src/components/SidePanel.vue')['default']
-    ThemeButton: typeof import('./src/components/ThemeButton.vue')['default']
     TransitionChild: typeof import('@headlessui/vue')['TransitionChild']
     TransitionRoot: typeof import('@headlessui/vue')['TransitionRoot']
     UseImage: typeof import('@vueuse/components')['UseImage']