elmeg-demo/frontend/contexts/auth-context.tsx

79 lines
2 KiB
TypeScript

"use client"
import React, { createContext, useContext, useState, useEffect } from "react"
import { getApiUrl } from "@/lib/api-config"
interface User {
id: number
email: string
is_active: boolean
is_superuser: boolean
role: string
}
interface AuthContextType {
user: User | null
loading: boolean
login: (token: string) => Promise<void>
logout: () => void
}
const AuthContext = createContext<AuthContextType>({
user: null,
loading: true,
login: async () => { },
logout: () => { },
})
export function AuthProvider({ children }: { children: React.ReactNode }) {
const [user, setUser] = useState<User | null>(null)
const [loading, setLoading] = useState(true)
useEffect(() => {
const initAuth = async () => {
const token = localStorage.getItem("token")
if (token) {
try {
await fetchUser(token)
} catch (err) {
console.error("Auth init failed", err)
localStorage.removeItem("token")
}
}
setLoading(false)
}
initAuth()
}, [])
const fetchUser = async (token: string) => {
const res = await fetch(`${getApiUrl()}/auth/users/me`, {
headers: {
Authorization: `Bearer ${token}`
}
})
if (res.ok) {
const userData = await res.json()
setUser(userData)
} else {
throw new Error("Failed to fetch user")
}
}
const login = async (token: string) => {
localStorage.setItem("token", token)
await fetchUser(token)
}
const logout = () => {
localStorage.removeItem("token")
setUser(null)
}
return (
<AuthContext.Provider value={{ user, loading, login, logout }}>
{children}
</AuthContext.Provider>
)
}
export const useAuth = () => useContext(AuthContext)