diff --git a/src/components/Login/Form/index.jsx b/src/components/Login/Form/index.jsx index cac22bd..41444fb 100644 --- a/src/components/Login/Form/index.jsx +++ b/src/components/Login/Form/index.jsx @@ -14,7 +14,7 @@ import { object, string } from "yup"; const LoginForm = () => { const [showPassword, setShowPassword] = useState(false); const requestServer = useRequest(); - const { getUser } = useAuth(); + const { setToken } = useAuth(); const defaultValues = { username: "", password: "", @@ -42,11 +42,11 @@ const LoginForm = () => { const formData = new FormData(); formData.append("username", data.username); formData.append("password", data.password); - await requestServer(GET_USER_LOGIN_ROUTE, "post", { + const response = await requestServer(GET_USER_LOGIN_ROUTE, "post", { data: formData, }); - getUser(); - } catch (error) {} + setToken(response.data.data.token); + } catch (error) { } }; return ( diff --git a/src/lib/contexts/auth.js b/src/lib/contexts/auth.js index a8d3784..9482dab 100644 --- a/src/lib/contexts/auth.js +++ b/src/lib/contexts/auth.js @@ -6,6 +6,7 @@ import { createContext, useCallback, useContext, useEffect, useReducer, useState const initAuth = { initAuthState: false, isAuth: false, + token: null, user: {}, }; @@ -19,6 +20,12 @@ const authReducer = (state, action) => { return { ...state, isAuth: action.isAuth }; case "CHANGE_INIT_AUTH": return { ...state, initAuthState: action.initAuthState }; + case "CLEAR_TOKEN": + localStorage.removeItem("_token"); + return { ...state, token: null }; + case "SET_TOKEN": + localStorage.setItem("_token", action.token); + return { ...state, token: action.token }; default: return state; } @@ -46,7 +53,16 @@ export const AuthProvider = ({ children }) => { dispatch({ type: "CHANGE_INIT_AUTH", initAuthState }); }, []); + const clearToken = useCallback(() => { + dispatch({ type: "CLEAR_TOKEN" }); + }, []); + + const setToken = useCallback((token) => { + dispatch({ type: "SET_TOKEN", token }); + }, []); + const logout = () => { + clearToken() clearUser(); changeAuthState(false); changeInitAuth(true); @@ -55,7 +71,7 @@ export const AuthProvider = ({ children }) => { const getUser = useCallback(async () => { try { const { data } = await axios.get(GET_USER_ROUTE, { - withCredentials: true, + headers: { authorization: `Bearer ${state.token}` }, }); changeUser(data.data); changeAuthState(true); @@ -74,20 +90,33 @@ export const AuthProvider = ({ children }) => { message: " مشکلی در احراز هویت رخ داده است . دقایقی بعد امتحان کنید!!!", }); } - }, [clearUser, changeUser, changeAuthState, changeInitAuth]); + }, [state.token, clearUser, changeUser, changeAuthState, changeInitAuth]); useEffect(() => { - getUser(); + const localToken = localStorage.getItem("_token"); + if (localToken) dispatch({ type: "SET_TOKEN", token: localToken }); }, []); + useEffect(() => { + if (!state.token) { + clearUser(); + changeAuthState(false); + changeInitAuth(true); + return; + } + getUser(); + }, [state.token]); + return ( diff --git a/src/lib/hooks/useRequest.js b/src/lib/hooks/useRequest.js index 547161e..6859052 100644 --- a/src/lib/hooks/useRequest.js +++ b/src/lib/hooks/useRequest.js @@ -6,9 +6,7 @@ import { useSidebarBadge } from "./useSidebarBadge"; const defaultOptions = { data: {}, - requestOptions: { - headers: {}, - }, + headers: {}, notificationShow: true, notificationSuccess: false, notificationFailed: true, @@ -21,7 +19,7 @@ const useRequest = (initOptions) => { const { mutate: sidebarUpdate } = useSidebarBadge({ enable: _options.hasSidebarUpdate, }); - const { logout } = useAuth(); + const { token, logout } = useAuth(); /** * Performs an HTTP request. @@ -37,8 +35,7 @@ const useRequest = (initOptions) => { url, method, data: method === "get" ? null : mergedOptions.data, - withCredentials: true, - ...mergedOptions.requestOptions, + headers: { authorization: `Bearer ${token}`, ...mergedOptions.headers, }, }); if (mergedOptions.hasSidebarUpdate) { if (method === "post" || method === "put" || method === "delete") sidebarUpdate();