ui: extensions state updates (#1674)

ui/desktop/src/components/ConfigContext.tsx

@@ -5,10 +5,8 @@ import {
   removeConfig,
   upsertConfig,
   getExtensions as apiGetExtensions,
-  toggleExtension as apiToggleExtension,
   addExtension as apiAddExtension,
   removeExtension as apiRemoveExtension,
-  updateExtension as apiUpdateExtension,
   providers,
 } from '../api';
 import { client } from '../api/client.gen';
@@ -17,12 +15,16 @@ import type {
   UpsertConfigQuery,
   ConfigKeyQuery,
   ExtensionResponse,
-  ExtensionEntry,
   ProviderDetails,
   ExtensionQuery,
   ExtensionConfig,
 } from '../api/types.gen';
 
+// Define a local version that matches the structure of the imported one
+export type FixedExtensionEntry = ExtensionConfig & {
+  enabled: boolean;
+};
+
 // Initialize client configuration
 client.setConfig({
   baseUrl: window.appConfig.get('GOOSE_API_HOST') + ':' + window.appConfig.get('GOOSE_PORT'),
@@ -35,15 +37,15 @@ client.setConfig({
 interface ConfigContextType {
   config: ConfigResponse['config'];
   providersList: ProviderDetails[];
+  extensionsList: FixedExtensionEntry[];
   upsert: (key: string, value: unknown, is_secret: boolean) => Promise<void>;
   read: (key: string, is_secret: boolean) => Promise<unknown>;
   remove: (key: string, is_secret: boolean) => Promise<void>;
   addExtension: (name: string, config: ExtensionConfig, enabled: boolean) => Promise<void>;
-  updateExtension: (name: string, config: ExtensionConfig, enabled: boolean) => Promise<void>;
   toggleExtension: (name: string) => Promise<void>;
   removeExtension: (name: string) => Promise<void>;
   getProviders: (b: boolean) => Promise<ProviderDetails[]>;
-  getExtensions: (b: boolean) => Promise<ExtensionEntry[]>;
+  getExtensions: (b: boolean) => Promise<FixedExtensionEntry[]>;
 }
 
 interface ConfigProviderProps {
@@ -55,7 +57,7 @@ const ConfigContext = createContext<ConfigContextType | undefined>(undefined);
 export const ConfigProvider: React.FC<ConfigProviderProps> = ({ children }) => {
   const [config, setConfig] = useState<ConfigResponse['config']>({});
   const [providersList, setProvidersList] = useState<ProviderDetails[]>([]);
-  const [extensionsList, setExtensionsList] = useState<ExtensionEntry[]>([]);
+  const [extensionsList, setExtensionsList] = useState<FixedExtensionEntry[]>([]);
 
   useEffect(() => {
     // Load all configuration data and providers on mount
@@ -128,18 +130,15 @@ export const ConfigProvider: React.FC<ConfigProviderProps> = ({ children }) => {
     await reloadConfig();
   };
 
-  const updateExtension = async (name: string, config: ExtensionConfig, enabled: boolean) => {
-    const query: ExtensionQuery = { name, config, enabled };
-    await apiUpdateExtension({
-      body: query,
-      path: { name: name },
-    });
-    await reloadConfig();
-  };
-
   const toggleExtension = async (name: string) => {
-    await apiToggleExtension({ path: { name: name } });
-    await reloadConfig();
+    // Get current extensions to find the one we need to toggle
+    const exts = await getExtensions(true);
+    const extension = exts.find((ext) => ext.name === name);
+
+    if (extension) {
+      // Toggle the enabled state and update using addExtension
+      await addExtension(name, extension, !extension.enabled);
+    }
   };
 
   const getProviders = async (forceRefresh = false): Promise<ProviderDetails[]> => {
@@ -153,7 +152,7 @@ export const ConfigProvider: React.FC<ConfigProviderProps> = ({ children }) => {
     return providersList;
   };
 
-  const getExtensions = async (forceRefresh = false): Promise<ExtensionEntry[]> => {
+  const getExtensions = async (forceRefresh = false): Promise<FixedExtensionEntry[]> => {
     if (forceRefresh || extensionsList.length === 0) {
       // If a refresh is forced, or we don't have providers yet
       const response = await apiGetExtensions();
@@ -169,17 +168,17 @@ export const ConfigProvider: React.FC<ConfigProviderProps> = ({ children }) => {
     () => ({
       config,
       providersList,
+      extensionsList,
       upsert,
       read,
       remove,
       addExtension,
-      updateExtension,
       removeExtension,
       toggleExtension,
       getProviders,
       getExtensions,
     }),
-    [config, providersList]
+    [config, providersList, extensionsList]
   ); // Functions don't need to be dependencies as they don't change
 
   return <ConfigContext.Provider value={contextValue}>{children}</ConfigContext.Provider>;