/**
 * Settings Context.
 *
 * @package Sideconvo
 */

import {
	createContext,
	useContext,
	ReactNode,
} from '@wordpress/element';

interface SettingsContextType {
	showNotification: (
		type: 'error' | 'success' | 'info' | 'warning',
		message: string,
		position?: string,
		autoClose?: number | false
	) => void;
}

const SettingsContext = createContext< SettingsContextType | undefined >(
	undefined
);

interface SettingsProviderProps {
	children: ReactNode;
}

/**
 * Settings Provider component.
 *
 * @param {SettingsProviderProps} props Component props.
 * @return {JSX.Element} Provider component.
 */
export function SettingsProvider( { children }: SettingsProviderProps ) {
	/**
	 * Show notification.
	 *
	 * @param {string}        type      Notification type.
	 * @param {string}        message   Message to display.
	 * @param {ToastPosition} position  Toast position.
	 * @param {number|false}  autoClose Auto close duration.
	 */
	// eslint-disable-next-line @typescript-eslint/no-unused-vars
	const showNotification = ( _type: string, _message: string, _position?: string, _autoClose?: number | false ) => {};

	const value = {
		showNotification,
	};

	return (
		<SettingsContext.Provider value={ value }>
			{ children }
		</SettingsContext.Provider>
	);
}

/**
 * Use settings hook.
 *
 * @return {SettingsContextType} Settings context.
 */
export function useSettings(): SettingsContextType {
	const context = useContext( SettingsContext );
	if ( context === undefined ) {
		throw new Error( 'useSettings must be used within SettingsProvider' );
	}
	return context;
}