From 0e12d4209c5bd0865ae8e9db3c0f012c103e7e54 Mon Sep 17 00:00:00 2001
From: Your Name <your.email@example.com>
Date: Sun, 26 Apr 2026 13:38:41 +0800
Subject: [PATCH] fix: show preset toolbar for generated image result nodes

---
 .../canvas/LiblibVideoCanvasReplica.tsx       | 50 ++++++++++++++++---
 1 file changed, 43 insertions(+), 7 deletions(-)

diff --git a/components/canvas/LiblibVideoCanvasReplica.tsx b/components/canvas/LiblibVideoCanvasReplica.tsx
index 9b7902c6f..c29e12c29 100644
--- a/components/canvas/LiblibVideoCanvasReplica.tsx
+++ b/components/canvas/LiblibVideoCanvasReplica.tsx
@@ -77,6 +77,18 @@ type ActivePanel =
   | null;
 
 type ActiveStarterScene = "story-script" | "character-three-view" | "first-frame" | "audio-to-video" | null;
+type ActivePresetControlMode =
+  | "story-script"
+  | "character-three-view"
+  | "first-frame"
+  | "audio-to-video"
+  | "story-beat-grid-4"
+  | "multi-view-nine-grid"
+  | "continuous-storyboard-grid-25"
+  | "cinematic-lighting-correction"
+  | "frame-prediction-plus-3s"
+  | "frame-prediction-minus-5s"
+  | null;
 type SceneToolbarMenu = "panorama" | "orbit" | "lighting" | "grid" | "hd" | "crop" | null;
 type ComposerMenu =
   | "style"
@@ -1270,6 +1282,18 @@ function isWideImageGenerationFunction(functionKey: string) {
   );
 }
 
+function isOfficialImagePresetFunctionKey(functionKey: string) {
+  return (
+    functionKey === STORY_BEAT_GRID_FUNCTION_KEY ||
+    functionKey === MULTI_VIEW_NINE_GRID_FUNCTION_KEY ||
+    functionKey === CONTINUOUS_STORYBOARD_GRID_FUNCTION_KEY ||
+    functionKey === CINEMATIC_LIGHTING_CORRECTION_FUNCTION_KEY ||
+    functionKey === CHARACTER_THREE_VIEW_FUNCTION_KEY ||
+    functionKey === FRAME_PREDICTION_PLUS_3S_FUNCTION_KEY ||
+    functionKey === FRAME_PREDICTION_MINUS_5S_FUNCTION_KEY
+  );
+}
+
 function getPresetGridLayout(functionKey: string) {
   if (functionKey === STORY_BEAT_GRID_FUNCTION_KEY) return { columns: 2, rows: 2 };
   if (functionKey === MULTI_VIEW_NINE_GRID_FUNCTION_KEY) return { columns: 3, rows: 3 };
@@ -1615,8 +1639,19 @@ function getPresetMode(node: CloneNode | null | undefined): ActiveStarterScene {
   return null;
 }
 
+function getPresetControlMode(node: CloneNode | null | undefined): ActivePresetControlMode {
+  const starterMode = getPresetMode(node);
+  if (starterMode) return starterMode;
+  const functionKey = resolveOfficialImagePresetFunctionKey({
+    fallbackKey: getNodeFunctionKey(node),
+    option: getNodeParams(node).option || node?.draftValues?.toolbarOption,
+    title: node?.title,
+  });
+  return functionKey && isOfficialImagePresetFunctionKey(functionKey) ? functionKey : null;
+}
+
 function isOfficialImageControlNode(node: CloneNode | null | undefined): node is CloneNode {
-  return !!node && (node.kind === "media" || node.kind === "script") && !!getPresetMode(node);
+  return !!node && (node.kind === "media" || node.kind === "script") && !!getPresetControlMode(node);
 }
 
 function getTargetModuleKind(node: CloneNode): AddModuleKind | null {
@@ -3420,12 +3455,13 @@ export function LiblibVideoCanvasReplica({ canvasId, isLoading = false }: Liblib
   const runPresetComposerSubmit = useCallback(
     async (
       nodeId: string,
-      mode: Exclude<ActiveStarterScene, null>,
+      mode: Exclude<ActivePresetControlMode, null>,
       draftPrompt: string,
       settings?: ComposerSettings,
     ) => {
       const node = nodes.find((item) => item.id === nodeId);
       if (!node) return;
+      if (isOfficialImagePresetFunctionKey(mode)) return;
       const incomingNodes = edges
         .filter((edge) => edge.target === nodeId)
         .map((edge) => nodes.find((item) => item.id === edge.source))
@@ -4023,7 +4059,7 @@ export function LiblibVideoCanvasReplica({ canvasId, isLoading = false }: Liblib
 
   const isBusy = isLoading || isProjectLoading;
   const selectedPresetControlNode = isOfficialImageControlNode(selectedNode) ? selectedNode : null;
-  const selectedPresetMode = getPresetMode(selectedPresetControlNode);
+  const selectedPresetMode = getPresetControlMode(selectedPresetControlNode);
   const selectedTargetModuleKind = selectedNode ? getTargetModuleKind(selectedNode) : null;
   const selectedTextResourceNode =
     selectedNode && getDraftString(selectedNode, "action") === "TEXT_RESOURCE" ? selectedNode : null;
@@ -4922,7 +4958,7 @@ function PresetWorkflowControls({
 }: {
   anchor: PresetControlAnchor;
   functionConfig: VideoCanvasFunctionConfig;
-  mode: Exclude<ActiveStarterScene, null>;
+  mode: Exclude<ActivePresetControlMode, null>;
   modelOptions: CanvasModelOption[];
   nodes: CloneNode[];
   onComposerSubmit: (payload: ComposerSubmitPayload) => void;
@@ -4930,8 +4966,8 @@ function PresetWorkflowControls({
   onPresetSubmit: (prompt: string, settings?: ComposerSettings) => void;
   selectedNode: CloneNode;
 }) {
-  if (mode === CHARACTER_THREE_VIEW_FUNCTION_KEY) {
-    const definition = getConfiguredFunction(functionConfig, CHARACTER_THREE_VIEW_FUNCTION_KEY);
+  if (isOfficialImagePresetFunctionKey(mode)) {
+    const definition = getConfiguredFunction(functionConfig, mode);
     return (
       <div className="pointer-events-none absolute inset-0 z-30" data-canvas-overlay="true">
         <CharacterPresetToolbar anchor={anchor} onToolAction={onImageToolAction} />
@@ -4942,7 +4978,7 @@ function PresetWorkflowControls({
           modelOptions={modelOptions}
           nodes={nodes}
           onSubmit={onComposerSubmit}
-          referenceThumbnailUrl={getNodeMediaUrl(selectedNode) || CHARACTER_IMAGE_URL}
+          referenceThumbnailUrl={getNodeSourceMediaUrl(selectedNode) || getNodeMediaUrl(selectedNode) || CHARACTER_IMAGE_URL}
         />
       </div>
     );