From 41f3478893c641812cd54a50b2b45447806c81f2 Mon Sep 17 00:00:00 2001 From: Alex Hancock Date: Mon, 31 Mar 2025 15:05:04 -0400 Subject: [PATCH] fix: V2 settings carry extensions over during model change (#1944) --- ui/desktop/src/App.tsx | 33 ++-------- ui/desktop/src/components/ConfigContext.tsx | 2 + .../components/settings_v2/models/index.ts | 61 +++++-------------- .../models/subcomponents/AddModelModal.tsx | 16 +++-- .../providers/ProviderSettingsPage.tsx | 11 ++-- ui/desktop/src/utils/providerUtils.ts | 45 ++++++++++++-- 6 files changed, 80 insertions(+), 88 deletions(-) diff --git a/ui/desktop/src/App.tsx b/ui/desktop/src/App.tsx index d16880cd..31e584c0 100644 --- a/ui/desktop/src/App.tsx +++ b/ui/desktop/src/App.tsx @@ -28,14 +28,8 @@ import ProviderSettings from './components/settings_v2/providers/ProviderSetting import { useChat } from './hooks/useChat'; import 'react-toastify/dist/ReactToastify.css'; -import { FixedExtensionEntry, useConfig } from './components/ConfigContext'; -import { - initializeBuiltInExtensions, - syncBuiltInExtensions, - addExtensionFromDeepLink as addExtensionFromDeepLinkV2, - addToAgentOnStartup, -} from './components/settings_v2/extensions'; -import { extractExtensionConfig } from './components/settings_v2/extensions/utils'; +import { useConfig } from './components/ConfigContext'; +import { addExtensionFromDeepLink as addExtensionFromDeepLinkV2 } from './components/settings_v2/extensions'; // Views and their options export type View = @@ -105,25 +99,10 @@ export default function App() { setView('chat'); try { - await initializeSystem(provider, model); - - // Initialize or sync built-in extensions into config.yaml - let refreshedExtensions = await getExtensions(true); - - if (refreshedExtensions.length === 0) { - await initializeBuiltInExtensions(addExtension); - refreshedExtensions = await getExtensions(true); - } else { - await syncBuiltInExtensions(refreshedExtensions, addExtension); - } - - // Add enabled extensions to agent - for (const extensionEntry of refreshedExtensions) { - if (extensionEntry.enabled) { - const extensionConfig = extractExtensionConfig(extensionEntry); - await addToAgentOnStartup({ addToConfig: addExtension, extensionConfig }); - } - } + await initializeSystem(provider, model, { + getExtensions, + addExtension, + }); } catch (error) { console.error('Error in alpha initialization:', error); setFatalError(`System initialization error: ${error.message || 'Unknown error'}`); diff --git a/ui/desktop/src/components/ConfigContext.tsx b/ui/desktop/src/components/ConfigContext.tsx index 6eaf2231..81b8a0d6 100644 --- a/ui/desktop/src/components/ConfigContext.tsx +++ b/ui/desktop/src/components/ConfigContext.tsx @@ -21,6 +21,8 @@ import type { } from '../api/types.gen'; import { removeShims } from './settings_v2/extensions/utils'; +export type { ExtensionConfig } from '../api/types.gen'; + // Define a local version that matches the structure of the imported one export type FixedExtensionEntry = ExtensionConfig & { enabled: boolean; diff --git a/ui/desktop/src/components/settings_v2/models/index.ts b/ui/desktop/src/components/settings_v2/models/index.ts index 18630d10..59ac26fa 100644 --- a/ui/desktop/src/components/settings_v2/models/index.ts +++ b/ui/desktop/src/components/settings_v2/models/index.ts @@ -1,8 +1,9 @@ -import { initializeAgent } from '../../../agent/index'; +import { initializeSystem } from '../../../utils/providerUtils'; import { toastError, toastSuccess } from '../../../toasts'; import { ProviderDetails } from '@/src/api'; import { getProviderMetadata } from './modelInterface'; import { ProviderMetadata } from '../../../api'; +import type { ExtensionConfig, FixedExtensionEntry } from '../../ConfigContext'; // titles const CHANGE_MODEL_TOAST_TITLE = 'Model selected'; @@ -23,12 +24,23 @@ interface changeModelProps { model: string; provider: string; writeToConfig: (key: string, value: unknown, is_secret: boolean) => Promise; + getExtensions?: (b: boolean) => Promise; + addExtension?: (name: string, config: ExtensionConfig, enabled: boolean) => Promise; } // TODO: error handling -export async function changeModel({ model, provider, writeToConfig }: changeModelProps) { +export async function changeModel({ + model, + provider, + writeToConfig, + getExtensions, + addExtension, +}: changeModelProps) { try { - await initializeAgent({ model: model, provider: provider }); + await initializeSystem(provider, model, { + getExtensions, + addExtension, + }); } catch (error) { console.error(`Failed to change model at agent step -- ${model} ${provider}`); toastError({ @@ -61,49 +73,6 @@ export async function changeModel({ model, provider, writeToConfig }: changeMode } } -interface startAgentFromConfigProps { - readFromConfig: (key: string, is_secret: boolean) => Promise; -} - -// starts agent with the values for GOOSE_PROVIDER and GOOSE_MODEL that are in the config -export async function startAgentFromConfig({ readFromConfig }: startAgentFromConfigProps) { - let modelProvider: { model: string; provider: string }; - - // read from config - try { - modelProvider = await getCurrentModelAndProvider({ readFromConfig: readFromConfig }); - } catch (error) { - toastError({ - title: START_AGENT_TITLE, - msg: CONFIG_READ_MODEL_ERROR_MSG, - traceback: error, - }); - return; - } - - const model = modelProvider.model; - const provider = modelProvider.provider; - - console.log(`Starting agent with GOOSE_MODEL=${model} and GOOSE_PROVIDER=${provider}`); - - try { - await initializeAgent({ model: model, provider: provider }); - } catch (error) { - console.error(`Failed to change model at agent step -- ${model} ${provider}`); - toastError({ - title: CHANGE_MODEL_TOAST_TITLE, - msg: SWITCH_MODEL_AGENT_ERROR_MSG, - traceback: error, - }); - return; - } finally { - toastSuccess({ - title: CHANGE_MODEL_TOAST_TITLE, - msg: `${INITIALIZE_SYSTEM_WITH_MODEL_SUCCESS_MSG} with ${model} from ${provider}`, - }); - } -} - interface getCurrentModelAndProviderProps { readFromConfig: (key: string, is_secret: boolean) => Promise; } diff --git a/ui/desktop/src/components/settings_v2/models/subcomponents/AddModelModal.tsx b/ui/desktop/src/components/settings_v2/models/subcomponents/AddModelModal.tsx index 3dac3141..1437b75c 100644 --- a/ui/desktop/src/components/settings_v2/models/subcomponents/AddModelModal.tsx +++ b/ui/desktop/src/components/settings_v2/models/subcomponents/AddModelModal.tsx @@ -7,7 +7,7 @@ import { QUICKSTART_GUIDE_URL } from '../../providers/modal/constants'; import { Input } from '../../../ui/input'; import { Select } from '../../../ui/Select'; import { useConfig } from '../../../ConfigContext'; -import { changeModel as switchModel } from '../index'; +import { changeModel } from '../index'; import type { View } from '../../../../App'; const ModalButtons = ({ onSubmit, onCancel, isValid, validationErrors }) => ( @@ -36,7 +36,7 @@ type AddModelModalProps = { setView: (view: View) => void; }; export const AddModelModal = ({ onClose, setView }: AddModelModalProps) => { - const { getProviders, upsert } = useConfig(); + const { getProviders, upsert, getExtensions, addExtension } = useConfig(); const [providerOptions, setProviderOptions] = useState([]); const [modelOptions, setModelOptions] = useState([]); const [provider, setProvider] = useState(null); @@ -72,12 +72,18 @@ export const AddModelModal = ({ onClose, setView }: AddModelModalProps) => { return formIsValid; }; - const changeModel = async () => { + const onSubmit = async () => { setAttemptedSubmit(true); const isFormValid = validateForm(); if (isFormValid) { - await switchModel({ model: model, provider: provider, writeToConfig: upsert }); + await changeModel({ + model: model, + provider: provider, + writeToConfig: upsert, + getExtensions, + addExtension, + }); onClose(); } }; @@ -159,7 +165,7 @@ export const AddModelModal = ({ onClose, setView }: AddModelModalProps) => { onClose={onClose} footer={ ([]); const initialLoadDone = useRef(false); @@ -69,13 +69,16 @@ export default function ProviderSettings({ onClose, isOnboarding }: ProviderSett ); // initialize agent - await initializeAgent({ provider: provider.name, model }); + await initializeSystem(provider.name, model, { + getExtensions, + addExtension, + }); } catch (error) { console.error(`Failed to initialize with provider ${provider_name}:`, error); } onClose(); }, - [initializeAgent, onClose, upsert] + [onClose, upsert] ); return ( diff --git a/ui/desktop/src/utils/providerUtils.ts b/ui/desktop/src/utils/providerUtils.ts index 91c0892a..6975d510 100644 --- a/ui/desktop/src/utils/providerUtils.ts +++ b/ui/desktop/src/utils/providerUtils.ts @@ -4,6 +4,13 @@ import { GOOSE_PROVIDER, GOOSE_MODEL } from '../env_vars'; import { Model } from '../components/settings/models/ModelContext'; import { gooseModels } from '../components/settings/models/GooseModels'; import { initializeAgent } from '../agent'; +import { + initializeBuiltInExtensions, + syncBuiltInExtensions, + addToAgentOnStartup, +} from '../components/settings_v2/extensions'; +import { extractExtensionConfig } from '../components/settings_v2/extensions/utils'; +import type { ExtensionConfig, FixedExtensionEntry } from '../components/ConfigContext'; export function getStoredProvider(config: any): string | null { return config.GOOSE_PROVIDER || localStorage.getItem(GOOSE_PROVIDER); @@ -65,7 +72,14 @@ You can also validate your output after you have generated it to ensure it meets There may be (but not always) some tools mentioned in the instructions which you can check are available to this instance of goose (and try to help the user if they are not or find alternatives). `; -export const initializeSystem = async (provider: string, model: string) => { +export const initializeSystem = async ( + provider: string, + model: string, + options?: { + getExtensions?: (b: boolean) => Promise; + addExtension?: (name: string, config: ExtensionConfig, enabled: boolean) => Promise; + } +) => { try { console.log('initializing agent with provider', provider, 'model', model); await initializeAgent({ provider, model }); @@ -104,11 +118,30 @@ export const initializeSystem = async (provider: string, model: string) => { } } - // This will go away after the release of settings v2 as we now handle this via - // - // initializeBuiltInExtensions - // syncBuiltInExtensions - if (!process.env.ALPHA) { + if (process.env.ALPHA) { + if (!options?.getExtensions || !options?.addExtension) { + console.warn('Extension helpers not provided in alpha mode'); + return; + } + + // Initialize or sync built-in extensions into config.yaml + let refreshedExtensions = await options.getExtensions(false); + + if (refreshedExtensions.length === 0) { + await initializeBuiltInExtensions(options.addExtension); + refreshedExtensions = await options.getExtensions(false); + } else { + await syncBuiltInExtensions(refreshedExtensions, options.addExtension); + } + + // Add enabled extensions to agent + for (const extensionEntry of refreshedExtensions) { + if (extensionEntry.enabled) { + const extensionConfig = extractExtensionConfig(extensionEntry); + await addToAgentOnStartup({ addToConfig: options.addExtension, extensionConfig }); + } + } + } else { loadAndAddStoredExtensions().catch((error) => { console.error('Failed to load and add stored extension configs:', error); });