From 31f5dcf00c3a393383b0e5294de07ca07788ec25 Mon Sep 17 00:00:00 2001
From: YAGI <79428926+Yagi-Michael@users.noreply.github.com>
Date: Thu, 9 Apr 2026 13:12:50 -0700
Subject: [PATCH] fix: allow manual model entry when provider model listing
 fails (#8411)

---
 .../models/subcomponents/SwitchModelModal.tsx | 36 ++++++++++++-------
 1 file changed, 24 insertions(+), 12 deletions(-)

diff --git a/ui/desktop/src/components/settings/models/subcomponents/SwitchModelModal.tsx b/ui/desktop/src/components/settings/models/subcomponents/SwitchModelModal.tsx
index 275d779b..ce83f92d 100644
--- a/ui/desktop/src/components/settings/models/subcomponents/SwitchModelModal.tsx
+++ b/ui/desktop/src/components/settings/models/subcomponents/SwitchModelModal.tsx
@@ -841,21 +841,33 @@ export const SwitchModelModal = ({
                       </div>
                     </div>
                   ) : providerErrors[provider] ? (
-                    /* Show error message when provider failed to connect */
-                    <div className="rounded-md bg-red-50 dark:bg-red-900/20 border border-red-200 dark:border-red-800 p-3">
-                      <div className="flex items-start">
-                        <div className="flex-1">
-                          <h3 className="text-sm font-medium text-red-800 dark:text-red-200">
-                            {intl.formatMessage(i18n.couldNotContactProvider)}
-                          </h3>
-                          <div className="mt-1 text-sm text-red-700 dark:text-red-300">
-                            {providerErrors[provider]}
-                          </div>
-                          <div className="mt-2 text-xs text-red-600 dark:text-red-400">
-                            {intl.formatMessage(i18n.checkProviderConfig)}
+                    /* Show error with custom model input so users aren't stuck */
+                    <div className="flex flex-col gap-2">
+                      <div className="rounded-md bg-yellow-50 dark:bg-yellow-900/20 border border-yellow-200 dark:border-yellow-800 p-3">
+                        <div className="flex items-start">
+                          <div className="flex-1">
+                            <h3 className="text-sm font-medium text-yellow-800 dark:text-yellow-200">
+                              {intl.formatMessage(i18n.couldNotContactProvider)}
+                            </h3>
+                            <div className="mt-1 text-sm text-yellow-700 dark:text-yellow-300">
+                              {providerErrors[provider]}
+                            </div>
+                            <div className="mt-2 text-xs text-yellow-600 dark:text-yellow-400">
+                              {intl.formatMessage(i18n.checkProviderConfig)}
+                            </div>
                           </div>
                         </div>
                       </div>
+                      <label className="text-sm text-text-secondary">{intl.formatMessage(i18n.customModelName)}</label>
+                      <Input
+                        className="border-2 px-4 py-5"
+                        placeholder={intl.formatMessage(i18n.typeModelName)}
+                        onChange={(event) => setModel(event.target.value)}
+                        value={model}
+                      />
+                      {attemptedSubmit && validationErrors.model && (
+                        <div className="text-red-500 text-sm mt-1">{validationErrors.model}</div>
+                      )}
                     </div>
                   ) : !isCustomModel ? (
                     <div>