import { useContext, useEffect, useState } from "react";
import {
	type BungeeConfig,
	WidgetConfigContext,
} from "../Providers/ConfigProvider";

interface ExtendedBungeeConfig extends BungeeConfig {
	/** To toggle multi-output */
	enableMultiOutput: boolean;

	/** Max number of tokens supported for multi output */
	multiOutputCap: number;
}

const defaultValues: Partial<ExtendedBungeeConfig> = {
	baseUrl: "https://api.bungee.exchange",
	theme: {
		colors: {
			success: "#8AE8B6", // @fixme: will this be a problem?
		},
	},
	enableMultiOutput: true,
	multiOutputCap: 2,
	maxCap: 1000,
};

export const useConfig = (): Partial<ExtendedBungeeConfig> => {
	const configContext = useContext(WidgetConfigContext);
	const [widgetConfig, setWidgetConfig] =
		useState<Partial<BungeeConfig>>(defaultValues);
	useEffect(() => {
		const config = {
			...defaultValues,
			...configContext,
		};

		setWidgetConfig(config);
	}, [configContext]);

	return widgetConfig;
};
