api/sample-requests.http

@@ -0,0 +1,9 @@
+### Get All Students
+POST http://localhost:8000/api/login
+content-Type: application/json
+Accept: application/json
+
+{
+    "email": "[email protected]",
+    "password": "123"
+}

frontend/src/pages/login/LoginPage.vue

@@ -64,16 +64,16 @@ const formData = ref({
 
 
 const handleSubmit = async () => {
-    console.log(formData, authStore)
+    const promise = authStore.login(formData.value)
-    toast.promise(authStore.login(formData.value), {
+    toast.promise(promise, {
-        loading: 'Calling API',
+      loading: 'Calling API',
-        success: (data) => {
+      success: (user) => {
-            return `Login Sucessfull - ${data?.name}`
+        router.push('/')
-        },
+        return `Login Successful - ${user.name}`
-        error: (data) => `[API] Error - ${data?.response?.data?.message}`
+      },
+      error: (error) =>
+        error.response?.data?.message
     })
-
-
     router.push('/')
 }
 </script>

frontend/src/stores/api.js

@@ -16,12 +16,16 @@ export const useAPIStore = defineStore('api', () => {
     },
   })
 
-  // AUTH
   const postLogin = async (credentials) => {
-    const response = await axios.post(`${API_BASE_URL}/login`, credentials)
+  const response = await axios.post(`${API_BASE_URL}/login`, credentials)
-    token.value = response.data.token
+
-    axios.defaults.headers.common['Authorization'] = `Bearer ${token.value}`
+  if (!response.data.token) throw response
-  }
+
+  token.value = response.data.token
+  axios.defaults.headers.common['Authorization'] = `Bearer ${token.value}`
+
+  return response
+}
   const postLogout = async () => {
     await axios.post(`${API_BASE_URL}/logout`)
     token.value = undefined

frontend/src/stores/auth.js

@@ -30,14 +30,12 @@ export const useAuthStore = defineStore('auth', () => {
   }
 
   const login = async (credentials) => {
-    await apiStore.postLogin(credentials)
+      const loginResp = await apiStore.postLogin(credentials)
-    const response = await apiStore.getAuthUser()
+      const userResp = await apiStore.getAuthUser()
-    const jwtToken = response
+      const jwtToken = loginResp.data.token
-    const user = response.data
+      setToken(jwtToken)
-
+      currentUser.value = userResp.data
-    setToken(jwtToken)
+      return userResp.data
-    currentUser.value = response.data
-    return response.data
   }
 
   const logout = async () => {

frontend/src/stores/socket.js

@@ -2,18 +2,24 @@ import { defineStore } from 'pinia'
 import { inject } from 'vue'
 
 export const useSocketStore = defineStore('socket', () => {
-  const socket = inject('socket')
+  try {
+    const socket = inject('socket')
 
-  const handleConnection = () => {
+    const handleConnection = () => {
-    socket.on('connect', () => {
+      try {
-      console.log(`[Socket] Connected -- ${socket.id}`)
+        socket.on('connect', () => {
-    })
+          console.log(`[Socket] Connected -- ${socket.id}`)
-    socket.on('disconnect', () => {
+        })
-      console.log(`[Socket] Disconnected -- ${socket.id}`)
+        socket.on('disconnect', () => {
-    })
+          console.log(`[Socket] Disconnected -- ${socket.id}`)
-  }
+        })
+      } catch (error) {}
+    }
 
-  return {
+    return {
-    handleConnection,
+      handleConnection,
+    }
+  } catch (error) {
   }
+  
 })