Merge branch 'mhmfajar-dev' into mhmfajar

frontend/client-portal/src/contexts/LaravelAuthContext.tsx

@@ -1,18 +1,17 @@
 import { createContext, ReactNode, useEffect, useReducer } from 'react';
 // utils
 import axios from '../utils/axios';
-// import { isValidToken, setSession } from '../utils/jwt';
-import { setSession, getSession, getUser } from '../utils/token';
+import { setSession, getSession } from '../utils/token';
 // @types
 import { ActionMap, AuthState, AuthUser, JWTContextType } from '../@types/auth';
+
 // ----------------------------------------------------------------------
-// import { Navigate, useLocation } from 'react-router-dom';
 
 enum Types {
   Initial = 'INITIALIZE',
   Login = 'LOGIN',
+  ValidateOtp = 'VALIDATE-OTP',
   Logout = 'LOGOUT',
-  Register = 'REGISTER',
 }
 
 type JWTAuthPayload = {
@@ -20,13 +19,11 @@ type JWTAuthPayload = {
     isAuthenticated: boolean;
     user: AuthUser;
   };
-  [Types.Login]: {
+  [Types.Login]: undefined;
+  [Types.ValidateOtp]: {
     user: AuthUser;
   };
   [Types.Logout]: undefined;
-  [Types.Register]: {
-    user: AuthUser;
-  };
 };
 
 export type JWTActions = ActionMap<JWTAuthPayload>[keyof ActionMap<JWTAuthPayload>];
@@ -46,6 +43,12 @@ const JWTReducer = (state: AuthState, action: JWTActions) => {
         user: action.payload.user,
       };
     case 'LOGIN':
+      return {
+        ...state,
+        isAuthenticated: false,
+        user: null,
+      };
+    case 'VALIDATE-OTP':
       return {
         ...state,
         isAuthenticated: true,
@@ -57,14 +60,6 @@ const JWTReducer = (state: AuthState, action: JWTActions) => {
         isAuthenticated: false,
         user: null,
       };
-
-    case 'REGISTER':
-      return {
-        ...state,
-        isAuthenticated: true,
-        user: action.payload.user,
-      };
-
     default:
       return state;
   }
@@ -80,11 +75,11 @@ type AuthProviderProps = {
 
 function AuthProvider({ children }: AuthProviderProps) {
   const [state, dispatch] = useReducer(JWTReducer, initialState);
-  // let location = useLocation();
 
   useEffect(() => {
-    const initialize = async () => {
+    (async () => {
       console.log('initialize', state);
+
       try {
         const accessToken = getSession();
 
@@ -120,51 +115,43 @@ function AuthProvider({ children }: AuthProviderProps) {
           },
         });
       }
-    };
-
-    initialize();
+    })();
   }, []);
 
-  // const login = async (phone_or_email: string) => {
-  //   axios
-  //     .post('/otp-request', { phone_or_email })
-  //     .then((response: any) => {
-  //       const { user, token } = response.data;
-  //       setSession(token);
+  const login = async (phoneOrEmail: string) =>
+    axios
+      .post('/login', { phoneOrEmail })
+      .then(() => {
+        dispatch({
+          type: Types.Login,
+        });
+      })
+      .catch((error) => {
+        if (error.response.status !== 404) throw error.response;
+        if (error.response.status !== 422) throw error.response;
+      });
 
-  //       dispatch({
-  //         type: Types.Login,
-  //         payload: {
-  //           user,
-  //         },
-  //       });
-  //     })
-  //     .catch((error) => {
-  //       if (error.response.status !== 404) throw error.response;
-  //       if (error.response.status !== 422) throw error.response;
-  //     });
-  // };
+  const validateOtp = async (phoneOrEmail: string, otp: string) =>
+    axios
+      .post('/verify-code', { phoneOrEmail: phoneOrEmail, otp })
+      .then((response) => {
+        const { user, token } = response.data.data;
+        setSession(token);
 
-  // const register = async (email: string, password: string, firstName: string, lastName: string) => {
-  //   const response = await axios.post('/api/register', {
-  //     email,
-  //     password,
-  //     firstName,
-  //     lastName,
-  //   });
-  //   const { accessToken, user } = response.data;
-
-  //   window.localStorage.setItem('accessToken', accessToken);
-  //   dispatch({
-  //     type: Types.Register,
-  //     payload: {
-  //       user,
-  //     },
-  //   });
-  // };
+        dispatch({
+          type: Types.ValidateOtp,
+          payload: {
+            user,
+          },
+        });
+      })
+      .catch((error) => {
+        if (error.response.status !== 404) throw error.response;
+        if (error.response.status !== 422) throw error.response;
+      });
 
   const logout = async () => {
-    await axios.post('/logout', { token: getSession() });
+    await axios.post('/logout');
     setSession(null);
     dispatch({ type: Types.Logout });
   };
@@ -174,6 +161,8 @@ function AuthProvider({ children }: AuthProviderProps) {
       value={{
         ...state,
         method: 'jwt',
+        login,
+        validateOtp,
         logout,
       }}
     >