Jwt rough setup

Seasoned.Frontend/app/app.vue

@@ -50,17 +50,23 @@
 import { onMounted } from 'vue'
 import '@/assets/css/app-theme.css'
 import SessionTimeout from './components/SessionTimeout.vue'
-const authCookie = useCookie('.AspNetCore.Identity.Application')
 const isLoggedIn = useState('isLoggedIn', () => false)
 
 onMounted(() => {
-  if (authCookie.value) isLoggedIn.value = true
+  if (import.meta.client) {
+    const token = localStorage.getItem('auth_token')
+    if (token) {
+      isLoggedIn.value = true
+    }
+  }
 })
 
 const logout = () => {
-  authCookie.value = null
   isLoggedIn.value = false
-  if (import.meta.client) localStorage.removeItem('token')
+  if (import.meta.client) {
+    localStorage.removeItem('auth_token')
+    localStorage.removeItem('token') 
+  }
   navigateTo('/login')
 }
 </script>

Seasoned.Frontend/app/pages/login.vue

@@ -145,23 +145,27 @@ const handleAuth = async () => {
   authLoading.value = true
   const endpoint = isLogin.value ? 'api/auth/login' : 'api/auth/register'
   
-  const url = isLogin.value 
-    ? `${config.public.apiBase}${endpoint}?useCookies=true&useSessionCookies=false` 
-    : `${config.public.apiBase}${endpoint}`
+  const url = `${config.public.apiBase}${endpoint}`
 
   try {
     const response = await $fetch(url, {
       method: 'POST',
       body: {
         email: email.value,
-        password: password.value
-      },
-      credentials: 'include' 
+        password: password.value,
+        useCookies: false,
+        useSessionCookies: false
+      }
     })
 
     if (isLogin.value) {
-      isLoggedIn.value = true
-      navigateTo('/')
+      if (response.accessToken) {
+        localStorage.setItem('auth_token', response.accessToken)
+        isLoggedIn.value = true
+        navigateTo('/')
+      } else {
+        throw new Error('Token not received')
+      }
     } else {
       isLogin.value = true
       authLoading.value = false

Seasoned.Frontend/app/plugins/auth-watch.ts

@@ -3,18 +3,33 @@ export default defineNuxtPlugin((nuxtApp) => {
   const isLoggedIn = useState('isLoggedIn');
 
   nuxtApp.hook('app:created', () => {
-    
     const originalFetch = globalThis.$fetch;
 
     globalThis.$fetch = originalFetch.create({
+      onRequest({ options }) {
+        if (import.meta.client) {
+          const token = localStorage.getItem('auth_token');
+          if (token) {
+            const headers = new Headers(options.headers);
+            headers.set('Authorization', `Bearer ${token}`);
+            options.headers = headers;
+          }
+        }
+      },
+
       onResponseError({ response }) {
-        
         if (response.status === 401) {
           console.warn("Session Interceptor: Caught 401 Unauthorized.");
-        
+          
           const route = useRoute();
+
           if (route.path !== '/login') {
             isLoggedIn.value = false;
+            
+            if (import.meta.client) {
+               localStorage.removeItem('auth_token');
+            }
+            
             showTimeout.value = true;
           }
         }