From 0628ad507f072520493a901cd819f0d7fc5c567b Mon Sep 17 00:00:00 2001
From: Jet Li <jetli@freeleaps.com>
Date: Sun, 8 Sep 2024 16:15:04 -0700
Subject: [PATCH] Fix the null issue for refresh and access token

---
 frontend/src/pages/guest/FrontDoor.vue |  2 ++
 frontend/src/utils/backend/axios.js    | 17 ++++++++++-------
 2 files changed, 12 insertions(+), 7 deletions(-)

diff --git a/frontend/src/pages/guest/FrontDoor.vue b/frontend/src/pages/guest/FrontDoor.vue
index 550dd8c..e90eb28 100644
--- a/frontend/src/pages/guest/FrontDoor.vue
+++ b/frontend/src/pages/guest/FrontDoor.vue
@@ -57,6 +57,8 @@ export default {
   },
   methods: {
     trySigninWithEmail() {
+    // Prevent the page from refreshing on form submission
+    event.preventDefault();
       this.message = null
       if (this.email === null || this.email.length < 1) {
         this.message = this.$t('Please type in your email')
diff --git a/frontend/src/utils/backend/axios.js b/frontend/src/utils/backend/axios.js
index 6dac1a4..c25eeb5 100644
--- a/frontend/src/utils/backend/axios.js
+++ b/frontend/src/utils/backend/axios.js
@@ -32,13 +32,16 @@ function isTokenExpired(token) {
 backendAxios.interceptors.request.use(
   async (config) => {
     let accessToken = localStorage.getItem('access_token')
-    const refreshToken = localStorage.getItem('refresh_token')
+    let refreshToken = localStorage.getItem('refresh_token')
+    // Fix: handle the case where localStorage returns 'null' as a string
+    if (accessToken === 'null') accessToken = null;
+    if (refreshToken === 'null') refreshToken = null;
 
     // Check if the access token is expired
-    if (!accessToken || isTokenExpired(accessToken)) {
-      if (!refreshToken) {
-        return config
-      }
+    if (accessToken == null || refreshToken == null) {
+      return config
+    }
+    if (isTokenExpired(accessToken)) {
       try {
         // If access token is expired, refresh it using the refresh token
         const response = await axios.post('/api/user/signin/refresh-token', {}, {
@@ -48,11 +51,11 @@ backendAxios.interceptors.request.use(
           }
         });
         accessToken = response.data.access_token
-        const new_refreshToken = response.data.refresh_token
+        refreshToken = response.data.refresh_token
 
         // Save the new access token to localStorage
         localStorage.setItem('access_token', accessToken)
-        localStorage.setItem('refresh_token', new_refreshToken)
+        localStorage.setItem('refresh_token', refreshToken)
       } catch (error) {
         console.error('Token refresh failed. Redirecting to login.')
         // Optionally, handle token refresh failure (e.g., redirect to login)