fix: use model-specific resolution lists and normalize on model switch

Nano Banana Pro supports 1K/2K/4K, while Nano Banana 2 also supports 512.
Split the shared RESOLUTIONS constant into RESOLUTIONS_PRO and RESOLUTIONS_NB2,
and use the correct list based on the selected model in both GenerateImageNode
and SplitGridSettingsModal. Also normalize aspect ratio and resolution to valid
defaults when switching models in the SplitGrid modal.

Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com>

src/components/SplitGridSettingsModal.tsx

@@ -22,7 +22,8 @@ const LAYOUT_OPTIONS = [
 
 const BASE_ASPECT_RATIOS: AspectRatio[] = ["1:1", "2:3", "3:2", "3:4", "4:3", "4:5", "5:4", "9:16", "16:9", "21:9"];
 const EXTENDED_ASPECT_RATIOS: AspectRatio[] = ["1:1", "1:4", "1:8", "2:3", "3:2", "3:4", "4:1", "4:3", "4:5", "5:4", "8:1", "9:16", "16:9", "21:9"];
-const RESOLUTIONS: Resolution[] = ["1K", "2K", "4K"];
+const RESOLUTIONS_PRO: Resolution[] = ["1K", "2K", "4K"];
+const RESOLUTIONS_NB2: Resolution[] = ["512", "1K", "2K", "4K"];
 const MODELS: { value: ModelType; label: string }[] = [
   { value: "nano-banana", label: "Nano Banana" },
   { value: "nano-banana-2", label: "Nano Banana 2" },
@@ -55,6 +56,7 @@ export function SplitGridSettingsModal({
   const targetCount = rows * cols;
   const isNanoBananaPro = model === "nano-banana-pro" || model === "nano-banana-2";
   const aspectRatios = model === "nano-banana-2" ? EXTENDED_ASPECT_RATIOS : BASE_ASPECT_RATIOS;
+  const resolutions = model === "nano-banana-2" ? RESOLUTIONS_NB2 : RESOLUTIONS_PRO;
 
   const handleCreate = useCallback(() => {
     const splitNode = getNodeById(nodeId);
@@ -267,7 +269,20 @@ export function SplitGridSettingsModal({
                 </label>
                 <select
                   value={model}
-                  onChange={(e) => setModel(e.target.value as ModelType)}
+                  onChange={(e) => {
+                    const newModel = e.target.value as ModelType;
+                    setModel(newModel);
+                    // Normalize aspect ratio for the new model's allowed set
+                    const newAspectRatios = newModel === "nano-banana-2" ? EXTENDED_ASPECT_RATIOS : BASE_ASPECT_RATIOS;
+                    if (!newAspectRatios.includes(aspectRatio)) {
+                      setAspectRatio(newAspectRatios[0]);
+                    }
+                    // Normalize resolution for the new model's allowed set
+                    const newResolutions = newModel === "nano-banana-2" ? RESOLUTIONS_NB2 : RESOLUTIONS_PRO;
+                    if (!newResolutions.includes(resolution)) {
+                      setResolution(newResolutions[0]);
+                    }
+                  }}
                   className="w-full px-3 py-2 bg-neutral-900 border border-neutral-600 rounded text-neutral-100 text-sm focus:outline-none focus:border-neutral-500"
                 >
                   {MODELS.map((m) => (
@@ -302,7 +317,7 @@ export function SplitGridSettingsModal({
                       onChange={(e) => setResolution(e.target.value as Resolution)}
                       className="w-full px-3 py-2 bg-neutral-900 border border-neutral-600 rounded text-neutral-100 text-sm focus:outline-none focus:border-neutral-500"
                     >
-                      {RESOLUTIONS.map((res) => (
+                      {resolutions.map((res) => (
                         <option key={res} value={res}>{res}</option>
                       ))}
                     </select>

src/components/nodes/GenerateImageNode.tsx

@@ -20,8 +20,9 @@ const BASE_ASPECT_RATIOS: AspectRatio[] = ["1:1", "2:3", "3:2", "3:4", "4:3", "4
 // Extended 14 aspect ratios (Nano Banana 2 adds extreme ratios)
 const EXTENDED_ASPECT_RATIOS: AspectRatio[] = ["1:1", "1:4", "1:8", "2:3", "3:2", "3:4", "4:1", "4:3", "4:5", "5:4", "8:1", "9:16", "16:9", "21:9"];
 
-// Resolutions for Nano Banana Pro and Nano Banana 2
-const RESOLUTIONS: Resolution[] = ["512", "1K", "2K", "4K"];
+// Resolutions per model (nano-banana-pro: 1K-4K, nano-banana-2: 512-4K)
+const RESOLUTIONS_PRO: Resolution[] = ["1K", "2K", "4K"];
+const RESOLUTIONS_NB2: Resolution[] = ["512", "1K", "2K", "4K"];
 
 // Hardcoded Gemini image models (always available)
 const GEMINI_IMAGE_MODELS: { value: ModelType; label: string }[] = [
@@ -407,6 +408,7 @@ export function GenerateImageNode({ id, data, selected }: NodeProps<NanoBananaNo
   const currentModelId = isGeminiProvider ? (nodeData.selectedModel?.modelId || nodeData.model) : null;
   const supportsResolution = currentModelId === "nano-banana-pro" || currentModelId === "nano-banana-2";
   const aspectRatios = currentModelId === "nano-banana-2" ? EXTENDED_ASPECT_RATIOS : BASE_ASPECT_RATIOS;
+  const resolutions = currentModelId === "nano-banana-2" ? RESOLUTIONS_NB2 : RESOLUTIONS_PRO;
   const hasCarouselImages = (nodeData.imageHistory || []).length > 1;
 
   // Track previous status to detect error transitions
@@ -714,7 +716,7 @@ export function GenerateImageNode({ id, data, selected }: NodeProps<NanoBananaNo
                 onChange={handleResolutionChange}
                 className="w-12 text-[10px] py-1 px-1.5 border border-neutral-700 rounded bg-neutral-900/50 focus:outline-none focus:ring-1 focus:ring-neutral-600 text-neutral-300"
               >
-                {RESOLUTIONS.map((res) => (
+                {resolutions.map((res) => (
                   <option key={res} value={res}>
                     {res}
                   </option>