import { Role } from '@/types';
import { createContext, ReactNode, use, useState, useTransition } from 'react';

type RoleContextType = {
    open: boolean;
    isPending: boolean;
    setOpen: (state: boolean | false, role: Role | null) => void;
};

const RoleContext = createContext<RoleContextType>({
    open: false,
    isPending: false,
    setOpen: () => {},
});

export const RoleProvider = ({ children }: { children: ReactNode }) => {
    const [open, setOpen] = useState(false);
    const [isPending, startTransition] = useTransition();

    const handleOpen = (state: boolean, role: Role | null = null) => {
        startTransition(() => {
            setOpen(state);
        });
    };

    return (
        <RoleContext.Provider
            value={{
                open,
                isPending,
                setOpen: handleOpen,
            }}
        >
            {children}
        </RoleContext.Provider>
    );
};

export const useRole = () => {
    const context = use(RoleContext);
    if (!context) throw new Error('useRole must be used within a RoleProvider');
    return context;
};