Function SettingsProvider

packages/web/src/components/use-settings.tsx:60–111

({ config, children }: ProviderPropsType)

 * An interface for working with our config.
 */
export function SettingsProvider({ config, children }: ProviderPropsType) {
  const revalidator = useRevalidator();
  const [openRouterModels, setOpenRouterModels] = useState<GroupedOpenRouterModels>({});
  const [isLoadingOpenRouterModels, setIsLoadingOpenRouterModels] = useState(false);

  const updateConfig = async (newConfig: Partial<SettingsType>) => {
    // Filter out null values and convert back to an object
    const changeSet = Object.fromEntries(
      Object.entries(newConfig).filter(([_, value]) => value !== null),
    );

    await updateConfigServer(changeSet);
    revalidator.revalidate();
  };

  const refreshOpenRouterModels = async () => {
    setIsLoadingOpenRouterModels(true);
    try {
      const models = await fetchOpenRouterModels();
      const grouped = groupModelsByProvider(models);
      setOpenRouterModels(grouped);
    } finally {
      setIsLoadingOpenRouterModels(false);
    }
  };

  useEffect(() => {
    if (config.aiProvider === 'openrouter') {
      refreshOpenRouterModels();
    }
  }, [config.aiProvider]);

  const aiEnabled =
    (config.openaiKey && config.aiProvider === 'openai') ||
    (config.anthropicKey && config.aiProvider === 'anthropic') ||
    (config.xaiKey && config.aiProvider === 'Xai') ||
    (config.geminiKey && config.aiProvider === 'Gemini') ||
    (config.openrouterKey && config.aiProvider === 'openrouter') ||
    (config.aiProvider === 'custom' && !!config.aiBaseUrl) ||
    false;

  const context: SettingsContextValue = {
    ...config,
    aiEnabled,
    updateConfig,
    openRouterModels,
    isLoadingOpenRouterModels,
    refreshOpenRouterModels,
  };

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

export function useSettings() {
  const context = useContext(SettingsContext);