diff --git a/apps/client/src/contexts/authContext.tsx b/apps/client/src/contexts/authContext.tsx index 45fb9b9..5982236 100644 --- a/apps/client/src/contexts/authContext.tsx +++ b/apps/client/src/contexts/authContext.tsx @@ -1,4 +1,12 @@ -import { createContext, ReactNode, useCallback, useContext, useMemo, useState } from 'react'; +import { + createContext, + ReactNode, + useCallback, + useContext, + useMemo, + useState, + useEffect, +} from 'react'; export interface AuthContext { isAuthenticated: boolean; @@ -8,6 +16,8 @@ export interface AuthContext { accessToken: string; } +export const AUTH_STORAGE_KEY = 'auth_context'; + export const initialAuthContext: AuthContext = { isAuthenticated: false, login: async () => {}, @@ -16,12 +26,34 @@ export const initialAuthContext: AuthContext = { accessToken: '', }; +const loadInitialState = () => { + const savedState = localStorage.getItem(AUTH_STORAGE_KEY); + if (savedState) { + const { isAuthenticated, username, accessToken } = JSON.parse(savedState); + return { isAuthenticated, username, accessToken }; + } + + return { + isAuthenticated: false, + username: '', + accessToken: '', + }; +}; + const AuthContext = createContext(initialAuthContext); export function AuthProvider({ children }: { children: ReactNode }) { - const [isAuthenticated, setIsAuthenticated] = useState(false); - const [username, setUsername] = useState(''); - const [accessToken, setAccessToken] = useState(''); + const initialState = loadInitialState(); + const [isAuthenticated, setIsAuthenticated] = useState(initialState.isAuthenticated); + const [username, setUsername] = useState(initialState.username); + const [accessToken, setAccessToken] = useState(initialState.accessToken); + + useEffect(() => { + localStorage.setItem( + AUTH_STORAGE_KEY, + JSON.stringify({ isAuthenticated, username, accessToken }) + ); + }, [isAuthenticated, username, accessToken]); const login = useCallback(async (username: string, accessToken: string) => { setIsAuthenticated(true); @@ -54,6 +86,5 @@ export const useAuth = () => { if (!context) { throw new Error('useAuth must be used within an AuthProvider'); } - return context; };