From d404c702090be6ca1d6f2625ad6f07e7d61354fa Mon Sep 17 00:00:00 2001
From: shrimbly <falloon.willie@gmail.com>
Date: Wed, 15 Apr 2026 19:48:04 +1200
Subject: [PATCH] fix: fallback model UI consistency across node types

- ModelSearchDialog: show "Remove fallback" button even when no models match
- Generate3DNode: reset settingsTab to "primary" when fallback is removed
- GenerateAudioNode: same settingsTab reset fix

Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com>
---
 src/components/modals/ModelSearchDialog.tsx | 14 ++++++++++++++
 src/components/nodes/Generate3DNode.tsx     |  6 ++++++
 src/components/nodes/GenerateAudioNode.tsx  |  6 ++++++
 3 files changed, 26 insertions(+)

diff --git a/src/components/modals/ModelSearchDialog.tsx b/src/components/modals/ModelSearchDialog.tsx
index 51917f9e..2c7b6835 100644
--- a/src/components/modals/ModelSearchDialog.tsx
+++ b/src/components/modals/ModelSearchDialog.tsx
@@ -805,6 +805,20 @@ export function ModelSearchDialog({
             </div>
           ) : models.length === 0 ? (
             <div className="flex flex-col items-center justify-center h-48 gap-2">
+              {showClearOption && onClearSelection && (
+                <button
+                  onClick={() => onClearSelection()}
+                  className="w-full flex items-center justify-between px-3 py-2 mb-2 bg-neutral-800/60 hover:bg-neutral-700/60 border border-neutral-700 hover:border-red-500/50 rounded-lg transition-colors text-left group"
+                >
+                  <div className="flex items-center gap-2">
+                    <svg className="w-4 h-4 text-red-400 group-hover:text-red-300" fill="none" viewBox="0 0 24 24" stroke="currentColor" strokeWidth={2}>
+                      <path strokeLinecap="round" strokeLinejoin="round" d="M6 18L18 6M6 6l12 12" />
+                    </svg>
+                    <span className="text-sm text-neutral-200 group-hover:text-white">Remove fallback</span>
+                  </div>
+                  <span className="text-xs text-neutral-500">Clear current selection</span>
+                </button>
+              )}
               <svg
                 className="w-10 h-10 text-neutral-500"
                 fill="none"
diff --git a/src/components/nodes/Generate3DNode.tsx b/src/components/nodes/Generate3DNode.tsx
index 63d95562..8f313f5f 100644
--- a/src/components/nodes/Generate3DNode.tsx
+++ b/src/components/nodes/Generate3DNode.tsx
@@ -28,6 +28,12 @@ export function Generate3DNode({ id, data, selected }: NodeProps<Generate3DNodeT
   const [isBrowseDialogOpen, setIsBrowseDialogOpen] = useState(false);
   const [settingsTab, setSettingsTab] = useState<"primary" | "fallback">("primary");
 
+  useEffect(() => {
+    if (!nodeData.fallbackModel && settingsTab === "fallback") {
+      setSettingsTab("primary");
+    }
+  }, [nodeData.fallbackModel, settingsTab]);
+
   // Inline parameters infrastructure
   const { inlineParametersEnabled } = useInlineParameters();
 
diff --git a/src/components/nodes/GenerateAudioNode.tsx b/src/components/nodes/GenerateAudioNode.tsx
index 8f269459..5009bf52 100644
--- a/src/components/nodes/GenerateAudioNode.tsx
+++ b/src/components/nodes/GenerateAudioNode.tsx
@@ -27,6 +27,12 @@ export function GenerateAudioNode({ id, data, selected }: NodeProps<GenerateAudi
   const [isLoadingCarouselAudio, setIsLoadingCarouselAudio] = useState(false);
   const [settingsTab, setSettingsTab] = useState<"primary" | "fallback">("primary");
 
+  useEffect(() => {
+    if (!nodeData.fallbackModel && settingsTab === "fallback") {
+      setSettingsTab("primary");
+    }
+  }, [nodeData.fallbackModel, settingsTab]);
+
   // Inline parameters infrastructure
   const { inlineParametersEnabled } = useInlineParameters();