import React, { createContext, useCallback, useContext, useState } from 'react';

type AddOnPayload = {
    id: string;
    name?: string;
    content?: React.ReactNode;
};

type AddOnContextType = {
    addOnOpen: (payload: AddOnPayload) => void;
    addOnClose: () => void;
    activeAddOn: AddOnPayload | null;
    isAddOnActive: boolean;
};

const AddOnContext = createContext<AddOnContextType | undefined>(undefined);

export const AddOnProvider: React.FC<{ children: React.ReactNode }> = ({ children }) => {
    const [active, setActive] = useState<AddOnPayload | null>(null);

    const addOnOpen = useCallback((payload: AddOnPayload) => {
        setActive(payload);
    }, []);

    const addOnClose = useCallback(() => setActive(null), []);

    return (
        <AddOnContext.Provider value={{ addOnOpen, addOnClose, activeAddOn: active, isAddOnActive: active !== null }}>
            {children}
        </AddOnContext.Provider>
    );
};

export function useAddOn() {
    const ctx = useContext(AddOnContext);
    if (!ctx) throw new Error('useAddOn must be used within AddOnProvider');
    return ctx;
}

export default useAddOn;