Merge pull request #5791 from menloresearch/fix/fetch-models-from-custom-endpoint-crashes-app

fix: fetch models from custom provider causes app to crash

web-app/src/hooks/useModelProvider.ts

@@ -36,7 +36,16 @@ export const useModelProvider = create<ModelProviderState>()(
       },
       setProviders: (providers) =>
         set((state) => {
-          const existingProviders = state.providers
+          const existingProviders = state.providers.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
@@ -46,11 +55,17 @@ export const useModelProvider = create<ModelProviderState>()(
             const existingProvider = existingProviders.find(
               (x) => x.provider === provider.provider
             )
-            const models = existingProvider?.models || []
+            const models = (existingProvider?.models || []).filter(
+              (e) =>
+                ('id' in e || 'model' in e) &&
+                typeof (e.id ?? e.model) === 'string'
+            )
             const mergedModels = [
               ...models,
               ...(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)
               ),

web-app/src/services/providers.ts

@@ -210,7 +210,9 @@ export const fetchModelsFromProvider = async (
       return data.data.map((model: { id: string }) => model.id).filter(Boolean)
     } else if (Array.isArray(data)) {
       // Direct array format: ["model-id1", "model-id2", ...]
-      return data.filter(Boolean)
+      return data
+        .filter(Boolean)
+        .map((model) => ('id' in model ? model.id : model))
     } else if (data.models && Array.isArray(data.models)) {
       // Alternative format: { models: [...] }
       return data.models