"use client";

import React, { createContext, useContext, useState } from "react";

interface SelectedRole {
    id: number,
    name: string
}

interface StateContextType {
    isDrawerOpen: boolean;
    setIsDrawerOpen: React.Dispatch<React.SetStateAction<boolean>>;
    drawerContent: string;
    setDrawerContent: React.Dispatch<React.SetStateAction<string>>;
    refresh: boolean;
    setRefresh: React.Dispatch<React.SetStateAction<boolean>>;
    itemID: number | undefined;
    setItemID: React.Dispatch<React.SetStateAction<number | undefined>>;
    loading: boolean;
    setLoading: React.Dispatch<React.SetStateAction<boolean>>;
    selectedRole: SelectedRole;
    setSelectedRole: React.Dispatch<React.SetStateAction<SelectedRole>>;
   
}

const StateContext = createContext<StateContextType | undefined>(undefined);


export const StateProvider: React.FC<{ children: React.ReactNode }> = ({ children }) => {
    const [isDrawerOpen, setIsDrawerOpen] = useState<boolean>(false);
    const [refresh, setRefresh] = useState<boolean>(false);
    const [loading, setLoading] = useState<boolean>(false);
    const [itemID, setItemID] = useState<number | undefined>(undefined);
    const [selectedRole, setSelectedRole] = useState({
        id: 0,
        name: ''
    });
    const [drawerContent, setDrawerContent] = useState('');

    return (
        <StateContext.Provider value={{ isDrawerOpen, selectedRole, setSelectedRole, drawerContent, setDrawerContent, setIsDrawerOpen, refresh, setRefresh, itemID, setItemID, loading, setLoading }}>
            {children}
        </StateContext.Provider>
    );
};


export const useStateContext = (): StateContextType => {
    const context = useContext(StateContext);
    if (!context) {
        throw new Error("useStateContext must be used within a StateProvider");
    }
    return context;
};