From 5c5b35b1b5626f5f52722f10b4f75fc82aa00cfd Mon Sep 17 00:00:00 2001
From: LittleSheep <littlesheep.code@hotmail.com>
Date: Fri, 26 Sep 2025 01:11:58 +0800
Subject: [PATCH] :bug: Fix authorization

---
 app/composables/useSolarNetwork.ts |  7 ++++++-
 app/pages/auth/authorize.vue       |  2 +-
 app/plugins/01.auth.ts             | 24 ++++++++++++++++++++++++
 app/stores/user.ts                 |  5 +----
 4 files changed, 32 insertions(+), 6 deletions(-)
 create mode 100644 app/plugins/01.auth.ts

diff --git a/app/composables/useSolarNetwork.ts b/app/composables/useSolarNetwork.ts
index b30f85f..76a7c6c 100644
--- a/app/composables/useSolarNetwork.ts
+++ b/app/composables/useSolarNetwork.ts
@@ -8,12 +8,15 @@ export const useSolarNetwork = (withoutProxy = false) => {
     baseURL: apiBase,
     credentials: "include",
     // Add Authorization header with Bearer token
-    onRequest: ({ options }) => {
+    onRequest: ({ request, options }) => {
+      const side = process.server ? 'SERVER' : 'CLIENT'
+      console.log(`[useSolarNetwork] onRequest for ${request} on ${side}`)
       // Get token from user store
       const userStore = useUserStore()
       const token = userStore.token
 
       if (token) {
+        console.log('[useSolarNetwork] Token found, adding Authorization header.')
         if (!options.headers) {
           options.headers = new Headers()
         }
@@ -23,6 +26,8 @@ export const useSolarNetwork = (withoutProxy = false) => {
           // eslint-disable-next-line @typescript-eslint/no-explicit-any
           ;(options.headers as any)["Authorization"] = `Bearer ${token}`
         }
+      } else {
+        console.log('[useSolarNetwork] No token found, skipping Authorization header.')
       }
 
       // Transform request data from camelCase to snake_case
diff --git a/app/pages/auth/authorize.vue b/app/pages/auth/authorize.vue
index 1f3d6c2..cae3cde 100644
--- a/app/pages/auth/authorize.vue
+++ b/app/pages/auth/authorize.vue
@@ -53,7 +53,7 @@
                 <v-card variant="outlined" class="pa-4 mb-4 text-left">
                   <h4 class="font-medium mb-2">
                     This will allow
-                    {{ clientInfo.clientName || "the app" }} to:
+                    {{ clientInfo.clientName || "the app" }} to
                   </h4>
                   <ul class="space-y-1">
                     <li
diff --git a/app/plugins/01.auth.ts b/app/plugins/01.auth.ts
new file mode 100644
index 0000000..7c682bc
--- /dev/null
+++ b/app/plugins/01.auth.ts
@@ -0,0 +1,24 @@
+import { useUserStore } from '~/stores/user'
+
+export default defineNuxtPlugin(() => {
+  const side = process.server ? 'SERVER' : 'CLIENT'
+  console.log(`[AUTH PLUGIN] Running on ${side}`)
+  const userStore = useUserStore()
+
+  // Prevent fetching if it's already in progress
+  if (userStore.isLoading) {
+    console.log(`[AUTH PLUGIN] User fetch already in progress on ${side}. Skipping.`)
+    return
+  }
+
+  // On initial app load, fetch the user if a token exists but the user object isn't populated.
+  if (userStore.token && !userStore.user) {
+    console.log(`[AUTH PLUGIN] Token found, user not loaded. Fetching user on ${side}.`)
+    userStore.fetchUser()
+  } else {
+    console.log(`[AUTH PLUGIN] Conditions not met for fetching user on ${side}.`, {
+      hasToken: !!userStore.token,
+      hasUser: !!userStore.user
+    })
+  }
+})
\ No newline at end of file
diff --git a/app/stores/user.ts b/app/stores/user.ts
index 58a4e3e..c080c38 100644
--- a/app/stores/user.ts
+++ b/app/stores/user.ts
@@ -11,7 +11,7 @@ export const useUserStore = defineStore("user", () => {
   const error = ref<string | null>(null)
 
   // The name is match with the remote one (set by server Set-Cookie)
-  const token = useCookie<string | null>("AuthToken", {
+  const token = useCookie<string | null>("fl_AuthToken", {
     default: () => null,
     path: "/",
     maxAge: 60 * 60 * 24 * 365 * 10
@@ -20,9 +20,6 @@ export const useUserStore = defineStore("user", () => {
   // Getters
   const isAuthenticated = computed(() => !!user.value && !!token.value)
 
-  // Call fetchUser immediately
-  fetchUser()
-
   // Actions
   async function fetchUser(reload = true) {
     if (!reload && user.value) return // Skip fetching if already loaded and not forced to