import { createContext, useContext, useEffect, useState, ReactNode, } from "react"; import type { IUser } from "@/types"; import { auth as authAPI } from "@/api"; interface AuthContextType { user: IUser | null; isAuthenticated: boolean; isLoading: boolean; error: string | null; login: (username: string, password: string) => Promise; logout: () => Promise; } const AuthContext = createContext(undefined); export function AuthProvider({ children }: { children: ReactNode }) { const [user, setUser] = useState(null); const [isLoading, setIsLoading] = useState(true); const [error, setError] = useState(null); // Initialize auth state on mount useEffect(() => { async function initAuth() { try { const currentUser = await authAPI.getCurrentUser(); setUser(currentUser); setError(null); } catch (err) { setUser(null); // Not an error if not authenticated — just not logged in } finally { setIsLoading(false); } } initAuth(); // Listen for logout events from other tabs/contexts const handleLogout = () => { setUser(null); }; window.addEventListener("auth:logout", handleLogout); return () => window.removeEventListener("auth:logout", handleLogout); }, []); const login = async (username: string, password: string) => { try { setIsLoading(true); setError(null); await authAPI.login(username, password); const currentUser = await authAPI.getCurrentUser(); setUser(currentUser); } catch (err) { const message = err instanceof Error ? err.message : "Login failed"; setError(message); throw err; } finally { setIsLoading(false); } }; const logout = async () => { try { await authAPI.logout(); setUser(null); setError(null); } catch (err) { console.error("Logout error:", err); // Clear local state even if logout fails setUser(null); } }; return ( {children} ); } export function useAuth() { const context = useContext(AuthContext); if (!context) { throw new Error("useAuth must be used within AuthProvider"); } return context; }