diff --git a/apps/demo-nextjs-app-router/app/comfy/image_to_image/page.tsx b/apps/demo-nextjs-app-router/app/comfy/image-to-image/page.tsx similarity index 90% rename from apps/demo-nextjs-app-router/app/comfy/image_to_image/page.tsx rename to apps/demo-nextjs-app-router/app/comfy/image-to-image/page.tsx index 0b5059f..1f349f3 100644 --- a/apps/demo-nextjs-app-router/app/comfy/image_to_image/page.tsx +++ b/apps/demo-nextjs-app-router/app/comfy/image-to-image/page.tsx @@ -2,7 +2,6 @@ import * as fal from '@fal-ai/serverless-client'; import { useMemo, useState } from 'react'; -import getWorkflow from './workflow'; // @snippet:start(client.config) fal.config({ @@ -84,23 +83,26 @@ export default function ComfyImageToImagePage() { setLoading(true); const start = Date.now(); try { - const result: Result = await fal.subscribe('fal-ai/comfy-server', { - input: getWorkflow({ - prompt: prompt, - loadimage_1: imageFile, - }), - pollInterval: 3000, // Default is 1000 (every 1s) - logs: true, - onQueueUpdate(update) { - setElapsedTime(Date.now() - start); - if ( - update.status === 'IN_PROGRESS' || - update.status === 'COMPLETED' - ) { - setLogs((update.logs || []).map((log) => log.message)); - } - }, - }); + const result: Result = await fal.subscribe( + 'comfy/fal-ai/image-to-image', + { + input: { + prompt: prompt, + loadimage_1: imageFile, + }, + pollInterval: 3000, // Default is 1000 (every 1s) + logs: true, + onQueueUpdate(update) { + setElapsedTime(Date.now() - start); + if ( + update.status === 'IN_PROGRESS' || + update.status === 'COMPLETED' + ) { + setLogs((update.logs || []).map((log) => log.message)); + } + }, + } + ); setResult(getImageURL(result)); } catch (error: any) { setError(error); diff --git a/apps/demo-nextjs-app-router/app/comfy/image_to_video/page.tsx b/apps/demo-nextjs-app-router/app/comfy/image-to-video/page.tsx similarity index 89% rename from apps/demo-nextjs-app-router/app/comfy/image_to_video/page.tsx rename to apps/demo-nextjs-app-router/app/comfy/image-to-video/page.tsx index e969294..037fc3c 100644 --- a/apps/demo-nextjs-app-router/app/comfy/image_to_video/page.tsx +++ b/apps/demo-nextjs-app-router/app/comfy/image-to-video/page.tsx @@ -2,7 +2,6 @@ import * as fal from '@fal-ai/serverless-client'; import { useMemo, useState } from 'react'; -import getWorkflow from './workflow'; // @snippet:start(client.config) fal.config({ @@ -80,22 +79,25 @@ export default function ComfyImageToVideoPage() { setLoading(true); const start = Date.now(); try { - const result: Result = await fal.subscribe('fal-ai/comfy-server', { - input: getWorkflow({ - loadimage_1: imageFile, - }), - pollInterval: 3000, // Default is 1000 (every 1s) - logs: true, - onQueueUpdate(update) { - setElapsedTime(Date.now() - start); - if ( - update.status === 'IN_PROGRESS' || - update.status === 'COMPLETED' - ) { - setLogs((update.logs || []).map((log) => log.message)); - } - }, - }); + const result: Result = await fal.subscribe( + 'comfy/fal-ai/image-to-video', + { + input: { + loadimage_1: imageFile, + }, + pollInterval: 3000, // Default is 1000 (every 1s) + logs: true, + onQueueUpdate(update) { + setElapsedTime(Date.now() - start); + if ( + update.status === 'IN_PROGRESS' || + update.status === 'COMPLETED' + ) { + setLogs((update.logs || []).map((log) => log.message)); + } + }, + } + ); setResult(getImageURL(result)); } catch (error: any) { setError(error); diff --git a/apps/demo-nextjs-app-router/app/comfy/image_to_image/workflow.tsx b/apps/demo-nextjs-app-router/app/comfy/image_to_image/workflow.tsx deleted file mode 100644 index 0e43d41..0000000 --- a/apps/demo-nextjs-app-router/app/comfy/image_to_image/workflow.tsx +++ /dev/null @@ -1,102 +0,0 @@ -// This workflow is generated with ComfyUI-fal -const WORKFLOW = { - prompt: { - '3': { - inputs: { - seed: 280823642470253, - steps: 20, - cfg: 8, - sampler_name: 'dpmpp_2m', - scheduler: 'normal', - denoise: 0.8700000000000001, - model: ['14', 0], - positive: ['6', 0], - negative: ['7', 0], - latent_image: ['12', 0], - }, - class_type: 'KSampler', - }, - '6': { - inputs: { - text: ['15', 0], - clip: ['14', 1], - }, - class_type: 'CLIPTextEncode', - }, - '7': { - inputs: { - text: 'watermark, text\n', - clip: ['14', 1], - }, - class_type: 'CLIPTextEncode', - }, - '8': { - inputs: { - samples: ['3', 0], - vae: ['14', 2], - }, - class_type: 'VAEDecode', - }, - '9': { - inputs: { - filename_prefix: 'ComfyUI', - images: ['8', 0], - }, - class_type: 'SaveImage', - }, - '10': { - inputs: { - image: 'example.png', - upload: 'image', - }, - class_type: 'LoadImage', - }, - '12': { - inputs: { - pixels: ['10', 0], - vae: ['14', 2], - }, - class_type: 'VAEEncode', - }, - '14': { - inputs: { - ckpt_name: 'v1-5-pruned-emaonly.ckpt', - }, - class_type: 'CheckpointLoaderSimple', - }, - '15': { - inputs: { - name: 'prompt', - value: - 'photograph of victorian woman with wings, sky clouds, meadow grass\n', - }, - class_type: 'StringInput_fal', - }, - }, - extra_data: {}, - fal_inputs_dev_info: { - loadimage_1: { - key: ['10', 'inputs', 'image'], - class_type: 'LoadImage', - }, - prompt: { - key: ['15', 'inputs', 'value'], - class_type: 'StringInput_fal', - }, - }, - fal_inputs: { - loadimage_1: 'example_url', - prompt: - 'photograph of victorian woman with wings, sky clouds, meadow grass\n', - }, -}; - -export default function getWorkflow(object: any) { - const newWorkflow = JSON.parse(JSON.stringify(WORKFLOW)); - newWorkflow.fal_inputs = { - ...newWorkflow.fal_inputs, - ...object, - }; - - return newWorkflow; -} diff --git a/apps/demo-nextjs-app-router/app/comfy/image_to_video/workflow.tsx b/apps/demo-nextjs-app-router/app/comfy/image_to_video/workflow.tsx deleted file mode 100644 index fc3baba..0000000 --- a/apps/demo-nextjs-app-router/app/comfy/image_to_video/workflow.tsx +++ /dev/null @@ -1,91 +0,0 @@ -const WORKFLOW = { - prompt: { - '3': { - inputs: { - seed: 351912937281939, - steps: 20, - cfg: 2.5, - sampler_name: 'euler', - scheduler: 'karras', - denoise: 1, - model: ['14', 0], - positive: ['12', 0], - negative: ['12', 1], - latent_image: ['12', 2], - }, - class_type: 'KSampler', - }, - '8': { - inputs: { - samples: ['3', 0], - vae: ['15', 2], - }, - class_type: 'VAEDecode', - }, - '10': { - inputs: { - filename_prefix: 'ComfyUI', - fps: 10, - lossless: false, - quality: 85, - method: 'default', - images: ['8', 0], - }, - class_type: 'SaveAnimatedWEBP', - }, - '12': { - inputs: { - width: 1024, - height: 576, - video_frames: 14, - motion_bucket_id: 127, - fps: 6, - augmentation_level: 0, - clip_vision: ['15', 1], - init_image: ['23', 0], - vae: ['15', 2], - }, - class_type: 'SVD_img2vid_Conditioning', - }, - '14': { - inputs: { - min_cfg: 1, - model: ['15', 0], - }, - class_type: 'VideoLinearCFGGuidance', - }, - '15': { - inputs: { - ckpt_name: 'svd.safetensors', - }, - class_type: 'ImageOnlyCheckpointLoader', - }, - '23': { - inputs: { - image: '18.png', - upload: 'image', - }, - class_type: 'LoadImage', - }, - }, - extra_data: {}, - fal_inputs_dev_info: { - loadimage_1: { - key: ['23', 'inputs', 'image'], - class_type: 'LoadImage', - }, - }, - fal_inputs: { - loadimage_1: 'example_url', - }, -}; - -export default function getWorkflow(object: any) { - const newWorkflow = JSON.parse(JSON.stringify(WORKFLOW)); - newWorkflow.fal_inputs = { - ...newWorkflow.fal_inputs, - ...object, - }; - - return newWorkflow; -} diff --git a/apps/demo-nextjs-app-router/app/comfy/page.tsx b/apps/demo-nextjs-app-router/app/comfy/page.tsx index 70e6d93..9acca73 100644 --- a/apps/demo-nextjs-app-router/app/comfy/page.tsx +++ b/apps/demo-nextjs-app-router/app/comfy/page.tsx @@ -16,19 +16,19 @@ export default function Index() {