Merge branch 'feature/login-page' into feature/profile-page

frontend/src/main.js

@@ -13,7 +13,7 @@ console.log('[main.js] ws connection', wsConnection)
 
 const app = createApp(App)
 
-app.provide('socket', io(wsConnection))
+//app.provide('socket', io(wsConnection))
 app.provide('serverBaseURL', `http://${apiDomain}`)
 app.provide('apiBaseURL', `http://${apiDomain}/api`)
 

frontend/src/pages/login/LoginPage.vue

@@ -1,5 +1,5 @@
 <template>
-    <div class="flex min-h-screen items-center justify-center bg-gray-50 px-4 py-12 sm:px-6 lg:px-8">
+    <div class="flex min-h-screen items-center justify-center px-4 py-12 sm:px-6 lg:px-8">
         <div class="w-full max-w-md space-y-8">
             <div>
                 <h2 class="mt-6 text-center text-3xl font-bold tracking-tight text-gray-900">
@@ -64,13 +64,13 @@ const formData = ref({
 
 
 const handleSubmit = async () => {
-
+    console.log(formData, authStore)
     toast.promise(authStore.login(formData.value), {
         loading: 'Calling API',
         success: (data) => {
             return `Login Sucessfull - ${data?.name}`
         },
-        error: (data) => `[API] Error saving game - ${data?.response?.data?.message}`,
+        error: (data) => `[API] Error - ${data?.response?.data?.message}`
     })
 
 

frontend/src/stores/auth.js

@@ -6,18 +6,36 @@ export const useAuthStore = defineStore('auth', () => {
   const apiStore = useAPIStore()
 
   const currentUser = ref(undefined)
+  const token = ref(localStorage.getItem('token') || null)
 
   const isLoggedIn = computed(() => {
-    return currentUser.value !== undefined
+    return currentUser.value !== undefined && token.value !== null
   })
 
   const currentUserID = computed(() => {
     return currentUser.value?.id
   })
 
+  const setToken = (jwtToken) => {
+    token.value = jwtToken
+    if (jwtToken) {
+      localStorage.setItem('token', jwtToken)
+    } else {
+      localStorage.removeItem('token')
+    }
+  }
+
+  const getToken = () => {
+    return token.value
+  }
+
   const login = async (credentials) => {
     await apiStore.postLogin(credentials)
     const response = await apiStore.getAuthUser()
+    const jwtToken = response
+    const user = response.data
+
+    setToken(jwtToken)
     currentUser.value = response.data
     return response.data
   }
@@ -25,12 +43,16 @@ export const useAuthStore = defineStore('auth', () => {
   const logout = async () => {
     await apiStore.postLogout()
     currentUser.value = undefined
+    setToken(null)
   }
 
   return {
     currentUser,
     isLoggedIn,
     currentUserID,
+    token,
+    setToken,
+    getToken,
     login,
     logout,
   }