video model plumbing

frontend/apps/editor3d/app/src/pages/PageImage/TextToImage.tsx

@@ -26,11 +26,6 @@ const TextToImage = ({ imageMediaId, imageUrl }: TextToImageProps) => {
 
   const selectedModelInfo : ModelInfo | undefined = IMAGE_MODELS_BY_LABEL[selectedModel];
 
-  console.log("TextToImage - selectedModels", selectedModels);
-  console.log("TextToImage - selectedModel", selectedModel);
-  console.log("TextToImage - selectedModelInfo", selectedModelInfo);
-
-
   const jobContext: JobContextType = {
     jobTokens: [],
     addJobToken: () => {},

frontend/apps/editor3d/app/src/pages/PageVideo/ImageToVideo.tsx

@@ -8,6 +8,8 @@ import {
   useModelSelectorStore,
   videoGenerationModels,
 } from "@storyteller/ui-model-selector";
+import { VIDEO_MODELS_BY_LABEL } from "@storyteller/model-list";
+import { ModelInfo } from "@storyteller/model-list";
 
 interface ImageToVideoProps {
   imageMediaId?: string;
@@ -17,13 +19,12 @@ interface ImageToVideoProps {
 const ImageToVideo = ({ imageMediaId, imageUrl }: ImageToVideoProps) => {
   const containerRef = useRef<HTMLDivElement>(null);
   const { selectedModels } = useModelSelectorStore();
+
   const selectedModel =
     selectedModels[ModelCategory.ImageToVideo] ||
     videoGenerationModels[0]?.label;
 
-  console.log("Selected model:", selectedModel)
-  console.log("Image Media Id:", imageMediaId)
-  console.log("Image URL:", imageUrl)
+  const selectedModelInfo : ModelInfo | undefined = VIDEO_MODELS_BY_LABEL[selectedModel];
 
   const jobContext: JobContextType = {
     jobTokens: [],
@@ -53,6 +54,7 @@ const ImageToVideo = ({ imageMediaId, imageUrl }: ImageToVideoProps) => {
               return jobContext;
             }}
             model={selectedModel}
+            modelInfo={selectedModelInfo}
             imageMediaId={imageMediaId}
             url={imageUrl ?? undefined}
             onEnqueuePressed={async () => {

frontend/libs/components/promptbox/src/lib/PromptBoxVideo.tsx

@@ -6,7 +6,7 @@ import { PopoverMenu, PopoverItem } from "@storyteller/ui-popover";
 import { Tooltip } from "@storyteller/ui-tooltip";
 import { Button, ToggleButton } from "@storyteller/ui-button";
 import { Modal } from "@storyteller/ui-modal";
-import { FalKlingImageToVideo } from "@storyteller/tauri-api";
+import { EnqueueImageToVideo } from "@storyteller/tauri-api";
 import {
   faMessageXmark,
   faMessageCheck,
@@ -20,6 +20,7 @@ import { faRectangle } from "@fortawesome/pro-regular-svg-icons";
 import { FontAwesomeIcon } from "@fortawesome/react-fontawesome";
 import { IsDesktopApp } from "@storyteller/tauri-utils";
 import { GalleryItem, GalleryModal } from "@storyteller/ui-gallery-modal";
+import { ModelInfo } from "@storyteller/model-list";
 
 interface ReferenceImage {
   id: string;
@@ -32,6 +33,7 @@ interface PromptBoxVideoProps {
   useJobContext: () => JobContextType;
   onEnqueuePressed?: () => void | Promise<void>;
   model: string;
+  modelInfo?: ModelInfo;
   imageMediaId?: string;
   url?: string;
 }
@@ -40,6 +42,7 @@ export const PromptBoxVideo = ({
   useJobContext,
   onEnqueuePressed,
   model,
+  modelInfo,
   imageMediaId,
   url,
 }: PromptBoxVideoProps) => {
@@ -183,7 +186,7 @@ export const PromptBoxVideo = ({
   const handleEnqueue = async () => {
     setIsEnqueueing(true);
 
-    console.log("Handle Enqueue");
+    console.log("PromptBoxVideo - Prompting with model", modelInfo);
 
     setTimeout(() => {
       // TODO(bt,2025-05-08): This is a hack so we don't accidentally wind up with a permanently disabled prompt box if
@@ -192,8 +195,10 @@ export const PromptBoxVideo = ({
       setIsEnqueueing(false);
     }, 10000);
 
-    const generateResponse = await FalKlingImageToVideo({
+    const generateResponse = await EnqueueImageToVideo({
+      model: modelInfo,
       image_media_token: referenceImages[0].mediaToken,
+      //prompt: prompt,
     });
 
     console.log("generateResponse", generateResponse);

frontend/libs/model-list/src/index.ts

@@ -2,4 +2,5 @@ export * from './lib/model-list.js';
 export * from './lib/ModelInfo.js';
 export * from './lib/ModelCreator.js';
 export * from './lib/ImageModels.js';
+export * from './lib/VideoModels.js';
 

frontend/libs/model-list/src/lib/VideoModels.ts

@@ -0,0 +1,41 @@
+import { ModelCreator } from "./ModelCreator.js";
+import { ModelInfo } from "./ModelInfo.js";
+
+export const VIDEO_MODELS: Record<string, ModelInfo> = {
+  kling_1_6_pro: {
+    name: "Kling 1.6 Pro",
+    tauri_id: "kling_1.6_pro",
+    creator: ModelCreator.Kling,
+  },
+  kling_2_1_pro: {
+    name: "Kling 2.1 Pro",
+    tauri_id: "kling_2.1_pro",
+    creator: ModelCreator.Kling,
+  },
+  kling_2_1_master: {
+    name: "Kling 2.1 Master",
+    tauri_id: "kling_2.1_master",
+    creator: ModelCreator.Kling,
+  },
+  seedance_1_0_lite: {
+    name: "Seedance 1.0 Lite",
+    tauri_id: "seedance_1.0_lite",
+    creator: ModelCreator.Bytedance,
+  },
+  veo_2: {
+    name: "Google Veo 2",
+    tauri_id: "veo_2",
+    creator: ModelCreator.Google,
+  }
+}
+
+// This is a hack to get the old model selector code to work since it's keyed off 
+// of the human-readable label of the model. Long term, that should be fixed.
+export const VIDEO_MODELS_BY_LABEL: Record<string, ModelInfo> = {
+  "Kling 1.6 Pro": VIDEO_MODELS.kling_1_6_pro,
+  "Kling 2.1 Pro": VIDEO_MODELS.kling_2_1_pro,
+  "Kling 2.1 Master": VIDEO_MODELS.kling_2_1_master,
+  "Seedance 1.0 Lite": VIDEO_MODELS.seedance_1_0_lite,
+  "Google Veo 2": VIDEO_MODELS.veo_2,
+}
+

frontend/libs/tauri-api/src/index.ts

@@ -1,18 +1,19 @@
 export * from "./lib/common/CommandStatus.js";
-export * from "./lib/enqueue/EnqueueTextToImage.js";
 export * from "./lib/enqueue/EnqueueImageTo3dObject.js";
+export * from "./lib/enqueue/EnqueueTextToImage.js";
+export * from "./lib/enqueue/EnqueueImageToVideo.js";
 export * from "./lib/fal/FalBackgroundRemoval.js";
 export * from "./lib/fal/FalHunyuanImageTo3d.js";
 export * from "./lib/fal/FalKlingImageToVideo.js";
 export * from "./lib/fal/GetFalApiKey.js";
 export * from "./lib/fal/SetFalApiKey.js";
-export * from "./lib/openai/SetOpenAIApiKey.js";
 export * from "./lib/openai/GetOpenAIApiKey.js";
+export * from "./lib/openai/SetOpenAIApiKey.js";
 export * from "./lib/settings/GetAppPreferences.js";
 export * from "./lib/settings/UpdateAppPreference.js";
 export * from "./lib/sora/CheckSoraSession.js";
 export * from "./lib/sora/LogoutSoraSession.js";
 export * from "./lib/sora/SoraImageRemix.js";
 export * from "./lib/sora/useSoraLoginListener.js";
-export * from "./lib/system/GetAppInfo.js";
 export * from "./lib/sora/waitForSoraLogin.js";
+export * from "./lib/system/GetAppInfo.js";

frontend/libs/tauri-api/src/lib/enqueue/EnqueueImageToVideo.ts

@@ -0,0 +1,49 @@
+import { invoke } from "@tauri-apps/api/core";
+import { CommandResult } from "../common/CommandStatus";
+import { ModelInfo } from "@storyteller/model-list";
+
+export enum EnqueueImageToVideoErrorType {
+  /// Caller didn't specify a model
+  ModelNotSpecified = "model_not_specified",
+  /// Generic server error
+  ServerError = "server_error",
+  /// No Fal API key available
+  NeedsFalApiKey = "needs_fal_api_key",
+  /// Fal had an API error
+  FalError = "fal_error",
+}
+
+export interface EnqueueImageToVideoRequest {
+  image_media_token?: string;
+  model?: ModelInfo;
+}
+
+export interface EnqueueImageToVideoError extends CommandResult {
+  error_type: EnqueueImageToVideoErrorType;
+  error_message?: string;
+}
+
+export interface EnqueueImageToVideoPayload {
+  media_token: string;
+  cdn_url: string;
+  base64_bytes: string;
+}
+
+export interface EnqueueImageToVideoSuccess extends CommandResult {
+  payload: EnqueueImageToVideoPayload;
+}
+
+export type EnqueueImageToVideoResult = EnqueueImageToVideoSuccess | EnqueueImageToVideoError;
+
+export const EnqueueImageToVideo = async (request: EnqueueImageToVideoRequest) : Promise<EnqueueImageToVideoResult> => {
+  const modelName = request.model?.tauri_id;
+
+  const result = await invoke("enqueue_image_to_video_command", { 
+    request: {
+      image_media_token: request.image_media_token,
+      model: modelName,
+    }
+  });
+
+  return (result as EnqueueImageToVideoResult);
+}

frontend/libs/tauri-api/src/lib/enqueue/EnqueueTextToImage.ts

@@ -52,7 +52,7 @@ export const EnqueueTextToImage = async (request: EnqueueTextToImageRequest) : P
     }
   }
 
-  let result = await invoke("enqueue_text_to_image_command", { 
+   const result = await invoke("enqueue_text_to_image_command", { 
     request: {
       prompt: request.prompt,
       model: modelName,