import React, { createContext, useContext, useMemo, useState } from 'react';
import { apiFetch, setAuthToken } from '../services/apiClient';

type AuthUser = {
  id: number;
  username: string;
  roles: string[];
};

type AuthContextType = {
  token: string | null;
  user: AuthUser | null;
  isAdmin: boolean;
  login: (username: string, password: string) => Promise<void>;
  logout: () => void;
};

const AuthContext = createContext<AuthContextType | undefined>(undefined);

export function useAuth() {
  const ctx = useContext(AuthContext);
  if (!ctx) throw new Error('useAuth must be used within AuthProvider');
  return ctx;
}

export const AuthProvider: React.FC<{ children: React.ReactNode }>
  = ({ children }) => {
  const [token, setToken] = useState<string | null>(null);
  const [user, setUser] = useState<AuthUser | null>(null);

  const isAdmin = useMemo(() => {
    if (!user) return false;
    return user.roles.includes('administrator') || user.roles.includes('admin');
  }, [user]);

  const login = async (username: string, password: string) => {
    const res = await apiFetch<{ token: string; user: AuthUser }>(`/auth/login`, {
      method: 'POST',
      body: JSON.stringify({ username, password }),
    });
    setToken(res.token);
    setAuthToken(res.token);
    setUser(res.user);
  };

  const logout = () => {
    setToken(null);
    setAuthToken(null);
    setUser(null);
  };

  const value: AuthContextType = { token, user, isAdmin, login, logout };

  return <AuthContext.Provider value={value}>{children}</AuthContext.Provider>;
};