fix: persist model capabilities refresh app

web-app/src/hooks/useModelProvider.ts

@@ -28,104 +28,104 @@
       selectedModel: null,
       deletedModels: [],
       getModelBy: (modelId: string) => {
         const provider = get().providers.find(
           (provider) => provider.provider === get().selectedProvider
         )
         if (!provider) return undefined
         return provider.models.find((model) => model.id === modelId)
       },
       setProviders: (providers) =>
         set((state) => {
           const existingProviders = state.providers
             // Filter out legacy llama.cpp provider for migration
             // Can remove after a couple of releases
             .filter((e) => e.provider !== 'llama.cpp')
             .map((provider) => {
               return {
                 ...provider,
                 models: provider.models.filter(
                   (e) =>
                     ('id' in e || 'model' in e) &&
                     typeof (e.id ?? e.model) === 'string'
                 ),
               }
             })
           // Ensure deletedModels is always an array
           const currentDeletedModels = Array.isArray(state.deletedModels)
             ? state.deletedModels
             : []
 
           const updatedProviders = providers.map((provider) => {
             const existingProvider = existingProviders.find(
               (x) => x.provider === provider.provider
             )
             const models = (existingProvider?.models || []).filter(
               (e) =>
                 ('id' in e || 'model' in e) &&
                 typeof (e.id ?? e.model) === 'string'
             )
             const mergedModels = [
               ...(provider?.models ?? []).filter(
                 (e) =>
                   ('id' in e || 'model' in e) &&
                   typeof (e.id ?? e.model) === 'string' &&
                   !models.some((m) => m.id === e.id) &&
                   !currentDeletedModels.includes(e.id)
               ),
               ...models,
             ]
             const updatedModels = provider.models?.map((model) => {
+              const existingModel = models.find((m) => m.id === model.id)
               return {
                 ...model,
-                settings:
-                  models.find((m) => m.id === model.id)?.settings ||
-                  model.settings,
+                settings: existingModel?.settings || model.settings,
+                capabilities: existingModel?.capabilities || model.capabilities,
               }
             })
             return {
               ...provider,
               models: provider.persist ? updatedModels : mergedModels,
               settings: provider.settings.map((setting) => {
                 const existingSetting = provider.persist
                   ? undefined
                   : existingProvider?.settings?.find(
                       (x) => x.key === setting.key
                     )
                 return {
                   ...setting,
                   controller_props: {
                     ...setting.controller_props,
                     ...(existingSetting?.controller_props || {}),
                   },
                 }
               }),
               api_key: existingProvider?.api_key || provider.api_key,
               base_url: existingProvider?.base_url || provider.base_url,
               active: existingProvider ? existingProvider?.active : true,
             }
           })
           return {
             providers: [
               ...updatedProviders,
               ...existingProviders.filter(
                 (e) => !updatedProviders.some((p) => p.provider === e.provider)
               ),
             ],
           }
         }),
       updateProvider: (providerName, data) => {
         set((state) => ({
           providers: state.providers.map((provider) => {
             if (provider.provider === providerName) {
               return {
                 ...provider,
                 ...data,
               }
             }
             return provider
           }),
         }))
       },
       getProviderByName: (providerName: string) => {
         const provider = get().providers.find(
           (provider) => provider.provider === providerName
@@ -135,21 +135,21 @@
       },
       selectModelProvider: (providerName: string, modelName: string) => {
         // Find the model object
         const provider = get().providers.find(
           (provider) => provider.provider === providerName
         )
 
         let modelObject: Model | undefined = undefined
 
         if (provider && provider.models) {
           modelObject = provider.models.find((model) => model.id === modelName)
         }
 
         // Update state with provider name and model object
         set({
           selectedProvider: providerName,
           selectedModel: modelObject || null,
         })
 
         return modelObject
       },

web-app/src/types/models.ts

@@ -19,4 +19,5 @@ export enum ModelCapabilities {
 export enum DefaultToolUseSupportedModels {
   JanNano = 'jan-nano',
   Qwen3 = 'qwen3',
+  Lucy = 'lucy',
 }