- {/* Gemini-specific controls */}
- {isGeminiProvider && currentModelId && (() => {
- const controls: React.ReactNode[] = [
-
-
-
-
,
-
-
-
-
,
- ];
-
- if (supportsResolution) {
- controls.push(
-
-
-
-
- );
- }
-
- if (currentModelId === "nano-banana-pro" || currentModelId === "nano-banana-2") {
- controls.push(
-
- );
- }
-
- if (currentModelId === "nano-banana-2") {
- controls.push(
-
- );
- }
+ {/* Tab bar for primary/fallback settings */}
+ {nodeData.fallbackModel && (
+
+ )}
- const display = useGeminiGrid && geminiColCount > 1
- ? reorderColumnFirst(controls, geminiColCount)
- : controls;
+ {/* Primary tab content */}
+ {settingsTab === "primary" && (
+ <>
+ {/* Gemini-specific controls */}
+ {isGeminiProvider && currentModelId && (() => {
+ const controls: React.ReactNode[] = [
+
+
+
+
,
+
+
+
+
,
+ ];
+
+ if (supportsResolution) {
+ controls.push(
+
+
+
+
+ );
+ }
- return (
-
+
+ Google Search
+
+ );
}
- >
- {display}
-
- );
- })()}
- {/* External provider parameters - reuse ModelParameters component */}
- {!isGeminiProvider && nodeData.selectedModel?.modelId && (
+ if (currentModelId === "nano-banana-2") {
+ controls.push(
+
+ );
+ }
+
+ const display = useGeminiGrid && geminiColCount > 1
+ ? reorderColumnFirst(controls, geminiColCount)
+ : controls;
+
+ return (
+
+ {display}
+
+ );
+ })()}
+
+ {/* External provider parameters - reuse ModelParameters component */}
+ {!isGeminiProvider && nodeData.selectedModel?.modelId && (
+
+ )}
+ >
+ )}
+
+ {/* Fallback tab content */}
+ {settingsTab === "fallback" && nodeData.fallbackModel && (
updateNodeData(id, { fallbackParameters: p })}
/>
)}
diff --git a/src/components/nodes/GenerateVideoNode.tsx b/src/components/nodes/GenerateVideoNode.tsx
index 603e0336..9dbf4944 100644
--- a/src/components/nodes/GenerateVideoNode.tsx
+++ b/src/components/nodes/GenerateVideoNode.tsx
@@ -16,6 +16,7 @@ import { useVideoBlobUrl } from "@/hooks/useVideoBlobUrl";
import { useVideoAutoplay } from "@/hooks/useVideoAutoplay";
import { useInlineParameters } from "@/hooks/useInlineParameters";
import { InlineParameterPanel } from "./InlineParameterPanel";
+import { SettingsTabBar } from "./SettingsTabBar";
import { browseRegistry } from "@/utils/browseRegistry";
// Video generation capabilities
@@ -54,6 +55,7 @@ export function GenerateVideoNode({ id, data, selected }: NodeProps(null);
const [isBrowseDialogOpen, setIsBrowseDialogOpen] = useState(false);
const [isLoadingCarouselVideo, setIsLoadingCarouselVideo] = useState(false);
+ const [settingsTab, setSettingsTab] = useState<"primary" | "fallback">("primary");
const videoBlobUrl = useVideoBlobUrl(nodeData.outputVideo ?? null);
const videoAutoplayRef = useVideoAutoplay(id, selected);
@@ -395,8 +397,18 @@ export function GenerateVideoNode({ id, data, selected }: NodeProps
- {/* External provider parameters - reuse ModelParameters component */}
- {nodeData.selectedModel?.modelId && (
+ {/* Tab bar for primary/fallback settings */}
+ {nodeData.fallbackModel && (
+
+ )}
+
+ {/* Primary tab: external provider parameters */}
+ {settingsTab === "primary" && nodeData.selectedModel?.modelId && (
)}
+
+ {/* Fallback tab: fallback model parameters */}
+ {settingsTab === "fallback" && nodeData.fallbackModel && (
+ updateNodeData(id, { fallbackParameters: p })}
+ />
+ )}
) : undefined}
>