add new providers

packages/app/src/app/api/resolve/providers/bigmodel/callCogVideoX.ts

@@ -0,0 +1,75 @@
+import {
+  TaskResultResponse,
+  VideoGenerationParams,
+  VideoGenerationResponse,
+} from './types'
+
+/**
+ * Asynchronous function to generate a video using the CogVideoX API and retrieve the result.
+ * @param apiKey - The API key for authentication.
+ * @param params - The parameters for video generation.
+ * @returns A promise that resolves to the video generation result.
+ */
+export async function callCogVideoX(
+  apiKey: string,
+  params: VideoGenerationParams
+): Promise<TaskResultResponse> {
+  const baseUrl = 'https://open.bigmodel.cn/api/paas/v4'
+  const headers = {
+    'Content-Type': 'application/json',
+    Authorization: `Bearer ${apiKey}`,
+  }
+
+  try {
+    // Step 1: Initialize video generation
+    const generationResponse = await fetch(`${baseUrl}/videos/generations`, {
+      method: 'POST',
+      headers: headers,
+      body: JSON.stringify(params),
+    })
+
+    if (!generationResponse.ok) {
+      throw new Error(`HTTP error! status: ${generationResponse.status}`)
+    }
+
+    const generationData: VideoGenerationResponse =
+      await generationResponse.json()
+    const { id } = generationData
+
+    // Step 2: Poll for the task result
+    let taskResult: TaskResultResponse
+    do {
+      const resultResponse = await fetch(`${baseUrl}/async-result/${id}`, {
+        method: 'GET',
+        headers: headers,
+      })
+
+      if (!resultResponse.ok) {
+        throw new Error(`HTTP error! status: ${resultResponse.status}`)
+      }
+
+      taskResult = await resultResponse.json()
+
+      if (taskResult.task_status === 'PROCESSING') {
+        // Wait for 5 seconds before polling again
+        await new Promise((resolve) => setTimeout(resolve, 5000))
+      }
+    } while (taskResult.task_status === 'PROCESSING')
+
+    return taskResult
+  } catch (error) {
+    console.error('Error in video generation:', error)
+    throw error
+  }
+}
+
+// Example usage
+// const apiKey = 'your-api-key-here';
+// const params: VideoGenerationParams = {
+//   model: 'cogvideox',
+//   prompt: 'Peter Rabbit drives a small car, wandering on the road, with a face full of happiness and joy.'
+// };
+//
+// generateVideo(apiKey, params)
+//   .then(result => console.log(result))
+//   .catch(error => console.error(error));

packages/app/src/app/api/resolve/providers/bigmodel/index.ts

@@ -0,0 +1,56 @@
+import { TimelineSegment } from '@aitube/timeline'
+import { ResolveRequest } from '@aitube/clapper-services'
+import { ClapSegmentCategory } from '@aitube/clap'
+
+import { callCogVideoX } from './callCogVideoX'
+
+export async function resolveSegment(
+  request: ResolveRequest
+): Promise<TimelineSegment> {
+  if (!request.settings.bigModelApiKey) {
+    throw new Error(`Missing API key for "BigModel.cn"`)
+  }
+
+  const segment: TimelineSegment = request.segment
+
+  let model = request.settings.imageGenerationWorkflow.data || ''
+
+  if (request.segment.category === ClapSegmentCategory.VIDEO) {
+    model = request.settings.videoGenerationWorkflow.data || ''
+
+    /*
+    note 
+    if (!request.prompts.image.positive) {
+      console.error(
+        `resolveSegment: cannot resolve a storyboard with an empty prompt`
+      )
+      return segment
+    }
+    */
+
+    if (!request.prompts.video.image) {
+      throw new Error(
+        `cannot generate a video without a storyboard (the concept of Clapper is to use storyboards)`
+      )
+    }
+
+    // https://bigmodel.cn/dev/api#cogvideox
+    const result = await callCogVideoX(request.settings.bigModelApiKey, {
+      model: request.settings.videoGenerationWorkflow,
+      image_url: request.prompts.video.image,
+    })
+
+    const video = result.video_result.at(0)
+    if (!video) {
+      throw new Error(`Failed to generate at least one video`)
+    }
+
+    segment.assetUrl = video.url
+  } else {
+    throw new Error(
+      `Clapper doesn't support ${request.segment.category} generation for provider "Fal.ai". Please open a pull request with (working code) to solve this!`
+    )
+  }
+
+  return segment
+}

packages/app/src/app/api/resolve/providers/bigmodel/types.ts

@@ -0,0 +1,44 @@
+/**
+ * Represents the parameters for the video generation request.
+ */
+export type VideoGenerationParams = {
+  model: string
+  request_id?: string
+  user_id?: string
+} & (
+  | {
+      prompt?: string
+    }
+  | {
+      image_url?: string
+    }
+)
+
+/**
+ * Represents the response from the video generation request.
+ */
+export type VideoGenerationResponse = {
+  request_id: string
+  id: string
+  model: string
+  task_status: 'PROCESSING' | 'SUCCESS' | 'FAIL'
+}
+
+/**
+ * Represents the video result in the task result query.
+ */
+export type VideoResult = {
+  url: string
+  cover_image_url: string
+}
+
+/**
+ * Represents the response from the task result query.
+ */
+export type TaskResultResponse = {
+  model: string
+  video_result: VideoResult[]
+  task_status: 'PROCESSING' | 'SUCCESS' | 'FAIL'
+  request_id: string
+  id: string
+}

packages/app/src/app/api/resolve/providers/falai/index.ts

@@ -136,10 +136,7 @@ export async function resolveSegment(
       )
     }
 
-    const storyboard = request.segments.find(
-      (s) => s.category === ClapSegmentCategory.STORYBOARD
-    )
-    if (!storyboard) {
+    if (!request.prompts.video.image) {
       throw new Error(
         `cannot generate a video without a storyboard (the concept of Clapper is to use storyboards)`
       )
@@ -149,7 +146,7 @@ export async function resolveSegment(
       input: {
         ...getWorkflowInputValues(request.settings.videoGenerationWorkflow),
 
-        image_url: storyboard.assetUrl,
+        image_url: request.prompts.video.image,
 
         sync_mode: true,
         enable_safety_checker: request.settings.censorNotForAllAudiencesContent,

packages/app/src/app/api/resolve/providers/index.ts

@@ -1,10 +1,13 @@
-export { resolveSegment as resolveSegmentUsingHuggingFace } from './huggingface'
+export { resolveSegment as resolveSegmentUsingAiTube } from './aitube'
+export { resolveSegment as resolveSegmentUsingBigModel } from './stabilityai'
+export { resolveSegment as resolveSegmentUsingComfyDeploy } from './comfy-comfydeploy'
+export { resolveSegment as resolveSegmentUsingComfyIcu } from './comfy-comfyicu'
 export { resolveSegment as resolveSegmentUsingComfyReplicate } from './comfy-replicate'
-export { resolveSegment as resolveSegmentUsingReplicate } from './replicate'
 export { resolveSegment as resolveSegmentUsingComfyUI } from './comfyui'
-export { resolveSegment as resolveSegmentUsingComfyIcu } from './comfy-comfyicu'
-export { resolveSegment as resolveSegmentUsingComfyDeploy } from './comfy-comfydeploy'
 export { resolveSegment as resolveSegmentUsingFalAi } from './falai'
-export { resolveSegment as resolveSegmentUsingAiTube } from './aitube'
+export { resolveSegment as resolveSegmentUsingHuggingFace } from './huggingface'
+export { resolveSegment as resolveSegmentUsingLetzAi } from './letzai'
 export { resolveSegment as resolveSegmentUsingModelsLab } from './modelslab'
+export { resolveSegment as resolveSegmentUsingPiApi } from './piapi'
+export { resolveSegment as resolveSegmentUsingReplicate } from './replicate'
 export { resolveSegment as resolveSegmentUsingStabilityAi } from './stabilityai'

packages/app/src/app/api/resolve/providers/letzai/callCreateImage.ts

@@ -0,0 +1,52 @@
+import { ImageCreationParams, ImageCreationResponse } from './types'
+
+/**
+ * Asynchronous function to create an image using the LetzAI API.
+ * @param apiKey - The API key for authentication.
+ * @param params - The parameters for image creation.
+ * @returns A promise that resolves to the image creation result.
+ */
+export async function callCreateImage(
+  apiKey: string,
+  params: ImageCreationParams
+): Promise<ImageCreationResponse> {
+  const baseUrl = 'https://api.letz.ai'
+  const headers = {
+    'Content-Type': 'application/json',
+    Authorization: `Bearer ${apiKey}`,
+  }
+
+  try {
+    const response = await fetch(`${baseUrl}/images`, {
+      method: 'POST',
+      headers: headers,
+      body: JSON.stringify(params),
+    })
+
+    if (!response.ok) {
+      throw new Error(`HTTP error! status: ${response.status}`)
+    }
+
+    const data: ImageCreationResponse = await response.json()
+    return data
+  } catch (error) {
+    console.error('Error in image creation:', error)
+    throw error
+  }
+}
+
+// Example usage
+// const apiKey = 'your-api-key-here';
+// const params: ImageCreationParams = {
+//   prompt: "A beautiful sunset over a calm ocean",
+//   model: "sd_xl_base_1.0",
+//   width: 1024,
+//   height: 1024,
+//   steps: 30,
+//   guidance: 7.5,
+//   outputFormat: "png"
+// };
+//
+// callCreateImage(apiKey, params)
+//   .then(result => console.log(result))
+//   .catch(error => console.error(error));

packages/app/src/app/api/resolve/providers/letzai/index.ts

@@ -0,0 +1,72 @@
+import { TimelineSegment } from '@aitube/timeline'
+import { ResolveRequest } from '@aitube/clapper-services'
+import { ClapSegmentCategory, generateSeed } from '@aitube/clap'
+
+import { getWorkflowInputValues } from '../getWorkflowInputValues'
+import { callCreateImage } from './callCreateImage'
+
+export async function resolveSegment(
+  request: ResolveRequest
+): Promise<TimelineSegment> {
+  if (!request.settings.letzAiApiKey) {
+    throw new Error(`Missing API key for "LetzAi"`)
+  }
+
+  const segment: TimelineSegment = request.segment
+
+  let model = request.settings.imageGenerationWorkflow.data || ''
+
+  if (request.segment.category === ClapSegmentCategory.STORYBOARD) {
+    model = request.settings.imageGenerationWorkflow.data || ''
+
+    if (!request.prompts.image.positive) {
+      console.error(
+        `resolveSegment: cannot resolve a storyboard with an empty prompt`
+      )
+      return segment
+    }
+
+    const { workflowDefaultValues, workflowValues } = getWorkflowInputValues(
+      request.settings.imageGenerationWorkflow
+    )
+
+    const result = await callCreateImage(request.settings.letzAiApiKey, {
+      prompt: request.prompts.image.positive,
+      negativePrompt: request.prompts.image.negative,
+      // model: string;
+      width:
+        request.meta.width ||
+        workflowValues.width ||
+        workflowDefaultValues.width,
+      height:
+        request.meta.width ||
+        workflowValues.height ||
+        workflowDefaultValues.height,
+      // steps: number;
+      // guidance: number;
+      seed: generateSeed(),
+      // scheduler: string;
+      // outputFormat: string;
+    })
+
+    if (request.settings.censorNotForAllAudiencesContent) {
+      if (result.nsfw) {
+        throw new Error(
+          `The generated content has been filtered according to your safety settings`
+        )
+      }
+    }
+
+    if (!result.output) {
+      throw new Error(`Failed to generate at least one video`)
+    }
+
+    segment.assetUrl = `${result.output || ''}`
+  } else {
+    throw new Error(
+      `Clapper doesn't support ${request.segment.category} generation for provider "Fal.ai". Please open a pull request with (working code) to solve this!`
+    )
+  }
+
+  return segment
+}

packages/app/src/app/api/resolve/providers/letzai/types.ts

@@ -0,0 +1,43 @@
+/**
+ * Represents the parameters for the image creation request.
+ */
+export type ImageCreationParams = {
+  prompt: string
+  negativePrompt?: string
+  model?: string
+  width?: number
+  height?: number
+  steps?: number
+  guidance?: number
+  seed?: number
+  scheduler?: string
+  outputFormat?: string
+}
+
+/**
+ * Represents the response from the image creation request.
+ */
+export type ImageCreationResponse = {
+  id: string
+  createdAt: string
+  updatedAt: string
+  prompt: string
+  negativePrompt: string | null
+  model: string
+  width: number
+  height: number
+  steps: number
+  guidance: number
+  seed: number
+  scheduler: string
+  status: string
+  error: string | null
+  progress: number
+  outputFormat: string
+  output: string | null
+  nsfw: boolean
+  user: {
+    id: string
+    username: string
+  }
+}

packages/app/src/app/api/resolve/providers/piapi/index.ts

@@ -0,0 +1,100 @@
+import { TimelineSegment } from '@aitube/timeline'
+import { ResolveRequest } from '@aitube/clapper-services'
+import { ClapSegmentCategory } from '@aitube/clap'
+
+import { getWorkflowInputValues } from '../getWorkflowInputValues'
+import { createImage } from './midjourney/createImage'
+import { createAndFetchDreamMachineVideo } from './lumalabs/createAndFetchDreamMachineVideo'
+
+export async function resolveSegment(
+  request: ResolveRequest
+): Promise<TimelineSegment> {
+  if (!request.settings.piApiApiKey) {
+    throw new Error(`Missing API key for "PiApi"`)
+  }
+
+  const segment: TimelineSegment = request.segment
+
+  let model = request.settings.imageGenerationWorkflow.data || ''
+
+  if (request.segment.category === ClapSegmentCategory.STORYBOARD) {
+    model = request.settings.imageGenerationWorkflow.data || ''
+
+    if (!request.prompts.image.positive) {
+      console.error(
+        `resolveSegment: cannot resolve a storyboard with an empty prompt`
+      )
+      return segment
+    }
+
+    const { workflowDefaultValues, workflowValues } = getWorkflowInputValues(
+      request.settings.imageGenerationWorkflow
+    )
+
+    const width =
+      request.meta.width || workflowValues.width || workflowDefaultValues.width
+
+    const height =
+      request.meta.width ||
+      workflowValues.height ||
+      workflowDefaultValues.height
+
+    const aspectRatio =
+      width > height ? '16:9' : height > width ? '9:16' : '1:1'
+
+    const result = await createImage(request.settings.piApiApiKey, {
+      prompt: request.prompts.image.positive,
+      aspect_ratio: aspectRatio,
+      // skip_prompt_check?: boolean;
+      process_mode: 'relax', // | 'fast' | 'turbo';
+      // webhook_endpoint?: string;
+      // webhook_secret?: string;
+      // bot_id?: number;
+    })
+
+    if (!result.task_result.image_url) {
+      throw new Error(`Failed to generate at least one image`)
+    }
+
+    segment.assetUrl = `${result.task_result.image_url || ''}`
+  } else if (request.segment.category === ClapSegmentCategory.VIDEO) {
+    model = request.settings.videoGenerationWorkflow.data || ''
+
+    if (!request.prompts.video.image) {
+      console.error(
+        `resolveSegment: cannot generate video without a storyboard`
+      )
+      return segment
+    }
+
+    const { workflowDefaultValues, workflowValues } = getWorkflowInputValues(
+      request.settings.videoGenerationWorkflow
+    )
+
+    const result = await createAndFetchDreamMachineVideo(
+      request.settings.piApiApiKey,
+      {
+        prompt: request.prompts.image.positive,
+        expand_prompt: false,
+        image_url: request.prompts.video.image,
+
+        // nice feature! we should use it :)
+        // image_end_url?: string;
+      }
+    )
+
+    result.data.generation.video
+
+    if (!result.data.generation.video) {
+      throw new Error(`Failed to generate at least one video`)
+    }
+
+    segment.assetUrl = `${result.data.generation.video || ''}`
+  } else {
+    throw new Error(
+      `Clapper doesn't support ${request.segment.category} generation for provider "Fal.ai". Please open a pull request with (working code) to solve this!`
+    )
+  }
+
+  return segment
+}

packages/app/src/app/api/resolve/providers/piapi/lumalabs/createAndFetchDreamMachineVideo.ts

@@ -0,0 +1,59 @@
+import { createDreamMachineVideo } from './createDreamMachineVideo'
+import { fetchDreamMachineVideoResult } from './fetchDreamMachineVideoResult'
+import { VideoFetchResponse, VideoGenerationParams } from './types'
+
+/**
+ * Asynchronous function to create a video and wait for the result.
+ * @param apiKey - The API key for authentication.
+ * @param params - The parameters for video generation.
+ * @param maxAttempts - Maximum number of fetch attempts (default: 60).
+ * @param delayMs - Delay between fetch attempts in milliseconds (default: 5000).
+ * @returns A promise that resolves to the final fetch response.
+ */
+export async function createAndFetchDreamMachineVideo(
+  apiKey: string,
+  params: VideoGenerationParams,
+  maxAttempts: number = 60,
+  delayMs: number = 5000
+): Promise<VideoFetchResponse> {
+  const creationResponse = await createDreamMachineVideo(apiKey, params)
+
+  let attempts = 0
+  while (attempts < maxAttempts) {
+    const fetchResponse = await fetchDreamMachineVideoResult(
+      apiKey,
+      creationResponse.data.task_id
+    )
+
+    if (
+      fetchResponse.data.status === 'finished' ||
+      fetchResponse.data.generation.state === 'completed'
+    ) {
+      return fetchResponse
+    }
+
+    if (
+      fetchResponse.data.status === 'failed' ||
+      fetchResponse.data.generation.state === 'failed'
+    ) {
+      throw new Error('Video generation failed')
+    }
+
+    attempts++
+    await new Promise((resolve) => setTimeout(resolve, delayMs))
+  }
+
+  throw new Error('Max attempts reached, video generation timed out')
+}
+
+// Example usage
+// const apiKey = 'your-api-key-here';
+// const params: VideoGenerationParams = {
+//   prompt: "a cute puppy",
+//   expand_prompt: false,
+//   image_url: "https://example.com/image.jpg"
+// };
+//
+// createAndFetchDreamMachineVideo(apiKey, params)
+//   .then(result => console.log(result))
+//   .catch(error => console.error(error));

packages/app/src/app/api/resolve/providers/piapi/lumalabs/createDreamMachineVideo.ts

@@ -0,0 +1,37 @@
+import { VideoGenerationParams, VideoGenerationResponse } from './types'
+
+/**
+ * Asynchronous function to initiate video generation using the PiAPI Dream Machine API.
+ * @param apiKey - The API key for authentication.
+ * @param params - The parameters for video generation.
+ * @returns A promise that resolves to the video generation response.
+ */
+export async function createDreamMachineVideo(
+  apiKey: string,
+  params: VideoGenerationParams
+): Promise<VideoGenerationResponse> {
+  const baseUrl = 'https://api.piapi.ai'
+  const headers = {
+    Accept: 'application/json',
+    'Content-Type': 'application/json',
+    'X-API-Key': apiKey,
+  }
+
+  try {
+    const response = await fetch(`${baseUrl}/api/luma/v1/video`, {
+      method: 'POST',
+      headers: headers,
+      body: JSON.stringify(params),
+    })
+
+    if (!response.ok) {
+      throw new Error(`HTTP error! status: ${response.status}`)
+    }
+
+    const data: VideoGenerationResponse = await response.json()
+    return data
+  } catch (error) {
+    console.error('Error in video generation:', error)
+    throw error
+  }
+}

packages/app/src/app/api/resolve/providers/piapi/lumalabs/fetchDreamMachineVideoResult.ts

@@ -0,0 +1,35 @@
+import { VideoFetchResponse } from './types'
+
+/**
+ * Asynchronous function to fetch the result of a Dream Machine video generation task.
+ * @param apiKey - The API key for authentication.
+ * @param taskId - The ID of the task to fetch.
+ * @returns A promise that resolves to the fetch response.
+ */
+export async function fetchDreamMachineVideoResult(
+  apiKey: string,
+  taskId: string
+): Promise<VideoFetchResponse> {
+  const baseUrl = 'https://api.piapi.ai'
+  const headers = {
+    Accept: 'application/json',
+    'X-API-Key': apiKey,
+  }
+
+  try {
+    const response = await fetch(`${baseUrl}/api/luma/v1/video/${taskId}`, {
+      method: 'GET',
+      headers: headers,
+    })
+
+    if (!response.ok) {
+      throw new Error(`HTTP error! status: ${response.status}`)
+    }
+
+    const data: VideoFetchResponse = await response.json()
+    return data
+  } catch (error) {
+    console.error('Error in fetching video result:', error)
+    throw error
+  }
+}

packages/app/src/app/api/resolve/providers/piapi/lumalabs/types.ts

@@ -0,0 +1,50 @@
+/**
+ * Represents the parameters for the video generation request.
+ */
+export type VideoGenerationParams = {
+  prompt: string
+  expand_prompt: boolean
+  image_url?: string
+  image_end_url?: string
+  loop?: boolean
+}
+
+/**
+ * Represents the response from the video generation request.
+ */
+export type VideoGenerationResponse = {
+  code: number
+  data: {
+    task_id: string
+  }
+  message: string
+}
+
+/**
+ * Represents the response from the fetch video result request.
+ */
+export type VideoFetchResponse = {
+  code: number
+  data: {
+    task_id: string
+    input: string
+    status: string
+    metadata: {
+      created_at: string
+      started_at: string
+      ended_at: string
+      quota_frozen: number
+      quota_usage: number
+    }
+    generation: {
+      id: string
+      prompt: string
+      state: string
+      created_at: string
+      video: string | null
+      like: string | null
+      estimate_wait_seconds: number | null
+    }
+  }
+  message: string
+}

packages/app/src/app/api/resolve/providers/piapi/midjourney/createImage.ts

@@ -0,0 +1,53 @@
+import { createMidjourneyImage } from './createMidjourneyImage'
+import { fetchMidjourneyResult } from './fetchMidjourneyResult'
+import { FetchResponse, ImageCreationParams } from './types'
+
+/**
+ * Asynchronous function to create an image and wait for the result.
+ * @param apiKey - The API key for authentication.
+ * @param params - The parameters for image creation.
+ * @param maxAttempts - Maximum number of fetch attempts (default: 10).
+ * @param delayMs - Delay between fetch attempts in milliseconds (default: 5000).
+ * @returns A promise that resolves to the final fetch response.
+ */
+export async function createImage(
+  apiKey: string,
+  params: ImageCreationParams,
+  maxAttempts: number = 10,
+  delayMs: number = 5000
+): Promise<FetchResponse> {
+  const creationResponse = await createMidjourneyImage(apiKey, params)
+
+  let attempts = 0
+  while (attempts < maxAttempts) {
+    const fetchResponse = await fetchMidjourneyResult(
+      apiKey,
+      creationResponse.task_id
+    )
+
+    if (fetchResponse.status === 'finished') {
+      return fetchResponse
+    }
+
+    if (fetchResponse.status === 'failed') {
+      throw new Error('Image creation failed')
+    }
+
+    attempts++
+    await new Promise((resolve) => setTimeout(resolve, delayMs))
+  }
+
+  throw new Error('Max attempts reached, image creation timed out')
+}
+
+// Example usage
+// const apiKey = 'your-api-key-here';
+// const params: ImageCreationParams = {
+//   prompt: "a mountain",
+//   process_mode: "fast",
+//   aspect_ratio: "1:1"
+// };
+//
+// createAndFetchMidjourneyImage(apiKey, params)
+//   .then(result => console.log(result))
+//   .catch(error => console.error(error));

packages/app/src/app/api/resolve/providers/piapi/midjourney/createMidjourneyImage.ts

@@ -0,0 +1,37 @@
+import { ImageCreationParams, ImageCreationResponse } from './types'
+
+/**
+ * Asynchronous function to create an image using the PiAPI Midjourney API.
+ * @param apiKey - The API key for authentication.
+ * @param params - The parameters for image creation.
+ * @returns A promise that resolves to the image creation response.
+ */
+export async function createMidjourneyImage(
+  apiKey: string,
+  params: ImageCreationParams
+): Promise<ImageCreationResponse> {
+  const baseUrl = 'https://api.piapi.ai'
+  const headers = {
+    Accept: 'application/json',
+    'Content-Type': 'application/json',
+    'X-API-KEY': apiKey,
+  }
+
+  try {
+    const response = await fetch(`${baseUrl}/mj/v2/imagine`, {
+      method: 'POST',
+      headers: headers,
+      body: JSON.stringify(params),
+    })
+
+    if (!response.ok) {
+      throw new Error(`HTTP error! status: ${response.status}`)
+    }
+
+    const data: ImageCreationResponse = await response.json()
+    return data
+  } catch (error) {
+    console.error('Error in image creation:', error)
+    throw error
+  }
+}

packages/app/src/app/api/resolve/providers/piapi/midjourney/fetchMidjourneyResult.ts

@@ -0,0 +1,37 @@
+import { FetchResponse } from './types'
+
+/**
+ * Asynchronous function to fetch the result of a Midjourney task.
+ * @param apiKey - The API key for authentication.
+ * @param taskId - The ID of the task to fetch.
+ * @returns A promise that resolves to the fetch response.
+ */
+export async function fetchMidjourneyResult(
+  apiKey: string,
+  taskId: string
+): Promise<FetchResponse> {
+  const baseUrl = 'https://api.piapi.ai'
+  const headers = {
+    Accept: 'application/json',
+    'Content-Type': 'application/json',
+    'X-API-KEY': apiKey,
+  }
+
+  try {
+    const response = await fetch(`${baseUrl}/mj/v2/fetch`, {
+      method: 'POST',
+      headers: headers,
+      body: JSON.stringify({ task_id: taskId }),
+    })
+
+    if (!response.ok) {
+      throw new Error(`HTTP error! status: ${response.status}`)
+    }
+
+    const data: FetchResponse = await response.json()
+    return data
+  } catch (error) {
+    console.error('Error in fetching result:', error)
+    throw error
+  }
+}

packages/app/src/app/api/resolve/providers/piapi/midjourney/types.ts

@@ -0,0 +1,66 @@
+/**
+ * Represents the parameters for the image creation request.
+ */
+export type ImageCreationParams = {
+  prompt: string
+  skip_prompt_check?: boolean
+  process_mode?: 'relax' | 'fast' | 'turbo'
+  aspect_ratio?: string
+  webhook_endpoint?: string
+  webhook_secret?: string
+  bot_id?: number
+}
+
+/**
+ * Represents the response from the image creation request.
+ */
+export type ImageCreationResponse = {
+  task_id: string
+  status: string
+  message: string
+}
+
+/**
+ * Represents the task result in the fetch response.
+ */
+export type TaskResult = {
+  discord_image_url?: string
+  image_url?: string
+  image_urls?: string[]
+  permanent_url?: string
+  task_progress?: number
+  intermediate_image_urls?: string[] | null
+  image_id?: string
+  seed?: string
+  result_message_id?: string
+  quota_used?: number
+  credit?: number
+  message?: string
+  warning?: string
+  error_messages?: string[]
+  need_retry?: boolean
+  actions?: string[]
+}
+
+/**
+ * Represents the response from the fetch request.
+ */
+export type FetchResponse = {
+  task_id: string
+  status: string
+  process_time: number
+  retry_count: number
+  meta: {
+    account_id: string
+    task_type: string
+    process_mode: string
+    created_at: number
+    created_at_utc: string
+    started_at: number
+    started_at_utc: string
+    ended_at: number
+    ended_at_utc: string
+    [key: string]: any // For other possible meta fields
+  }
+  task_result: TaskResult
+}

packages/app/src/app/api/resolve/route.ts

@@ -21,6 +21,9 @@ import {
   resolveSegmentUsingModelsLab,
   resolveSegmentUsingStabilityAi,
   resolveSegmentUsingComfyUI,
+  resolveSegmentUsingLetzAi,
+  resolveSegmentUsingBigModel,
+  resolveSegmentUsingPiApi,
 } from './providers'
 
 import { ResolveRequest } from '@aitube/clapper-services'
@@ -88,9 +91,15 @@ export async function POST(req: NextRequest) {
               ? resolveSegmentUsingFalAi
               : provider === ClapWorkflowProvider.MODELSLAB
                 ? resolveSegmentUsingModelsLab
-                : provider === ClapWorkflowProvider.AITUBE
-                  ? resolveSegmentUsingAiTube
-                  : null
+                : provider === ClapWorkflowProvider.LETZAI
+                  ? resolveSegmentUsingLetzAi
+                  : provider === ClapWorkflowProvider.BIGMODEL
+                    ? resolveSegmentUsingBigModel
+                    : provider === ClapWorkflowProvider.PIAPI
+                      ? resolveSegmentUsingPiApi
+                      : provider === ClapWorkflowProvider.AITUBE
+                        ? resolveSegmentUsingAiTube
+                        : null
 
   if (!resolveSegment) {
     throw new Error(

packages/app/src/components/core/providers/logos.ts

@@ -1,16 +1,20 @@
 import { ClapWorkflowProvider } from '@aitube/clap'
 
 const none = '/images/providers/none.png'
-const builtin = '/images/providers/none.png' // <-- TODO put Clapper logo here
-const comfyui = '/images/providers/comfyui.png'
+
+// ------------
+
+const aitube = '/images/providers/none.png' // <- TODO
 const anthropic = '/images/providers/anthropic.png'
+const bigmodel = '/images/providers/bigmodel.jpeg'
+const builtin = '/images/providers/none.png' // <-- TODO put Clapper logo here
 const cohere = '/images/providers/cohere.png'
-const comfyicu = '/images/providers/comfyicu.png'
 const comfydeploy = '/images/providers/none.png' // <- feel free to open a PR
+const comfyicu = '/images/providers/comfyicu.png'
+const comfyui = '/images/providers/comfyui.png'
 const elevenlabs = '/images/providers/elevenlabs.png'
 const everartai = '/images/providers/everartai.png'
 const falai = '/images/providers/falai.png'
-const aitube = '/images/providers/none.png' // <- TODO
 const fireworks = '/images/providers/fireworks.png'
 const google = '/images/providers/google.png'
 const groq = '/images/providers/groq.png'
@@ -19,11 +23,13 @@ const huggingface = '/images/providers/huggingface.png'
 const kitsai = '/images/providers/kitsai.png'
 const kuaishou = '/images/providers/kuaishou.png'
 const leonardoai = '/images/providers/leonardoai.png'
+const letzai = '/images/providers/letzai.png'
 const lumalabs = '/images/providers/lumalabs.png'
 const midjourney = '/images/providers/midjourney.png'
 const mistralai = '/images/providers/mistralai.png'
 const modelslab = '/images/providers/modelslab.jpeg'
 const openai = '/images/providers/openai.png'
+const piapi = '/images/providers/piapi.jpg'
 const replicate = '/images/providers/replicate.jpeg'
 const runwayml = '/images/providers/runwayml.png'
 const stabilityai = '/images/providers/stabilityai.png'
@@ -33,33 +39,37 @@ const udio = '/images/providers/udio.png'
 export const ClapWorkflowProvidersLogos: Record<ClapWorkflowProvider, string> =
   {
     [ClapWorkflowProvider.NONE]: none,
-    [ClapWorkflowProvider.BUILTIN]: builtin,
-    [ClapWorkflowProvider.COMFYUI]: comfyui,
+    // ----
+    [ClapWorkflowProvider.AITUBE]: aitube,
     [ClapWorkflowProvider.ANTHROPIC]: anthropic,
+    [ClapWorkflowProvider.BIGMODEL]: bigmodel,
+    [ClapWorkflowProvider.BUILTIN]: builtin,
     [ClapWorkflowProvider.COHERE]: cohere,
+    [ClapWorkflowProvider.COMFYDEPLOY]: comfydeploy,
+    [ClapWorkflowProvider.COMFYICU]: comfyicu,
+    [ClapWorkflowProvider.COMFYUI]: comfyui,
+    [ClapWorkflowProvider.CUSTOM]: none,
     [ClapWorkflowProvider.ELEVENLABS]: elevenlabs,
+    [ClapWorkflowProvider.EVERARTAI]: everartai,
     [ClapWorkflowProvider.FALAI]: falai,
-    [ClapWorkflowProvider.AITUBE]: aitube,
     [ClapWorkflowProvider.FIREWORKSAI]: fireworks,
     [ClapWorkflowProvider.GOOGLE]: google,
     [ClapWorkflowProvider.GROQ]: groq,
     [ClapWorkflowProvider.HEDRA]: hedra,
     [ClapWorkflowProvider.HUGGINGFACE]: huggingface,
     [ClapWorkflowProvider.KITSAI]: kitsai,
+    [ClapWorkflowProvider.KUAISHOU]: kuaishou,
+    [ClapWorkflowProvider.LEONARDOAI]: leonardoai,
+    [ClapWorkflowProvider.LETZAI]: letzai,
     [ClapWorkflowProvider.LUMALABS]: lumalabs,
     [ClapWorkflowProvider.MIDJOURNEY]: midjourney,
     [ClapWorkflowProvider.MISTRALAI]: mistralai,
     [ClapWorkflowProvider.MODELSLAB]: modelslab,
     [ClapWorkflowProvider.OPENAI]: openai,
+    [ClapWorkflowProvider.PIAPI]: piapi,
     [ClapWorkflowProvider.REPLICATE]: replicate,
     [ClapWorkflowProvider.RUNWAYML]: runwayml,
     [ClapWorkflowProvider.STABILITYAI]: stabilityai,
     [ClapWorkflowProvider.SUNO]: suno,
     [ClapWorkflowProvider.UDIO]: udio,
-    [ClapWorkflowProvider.CUSTOM]: none,
-    [ClapWorkflowProvider.COMFYDEPLOY]: comfydeploy,
-    [ClapWorkflowProvider.COMFYICU]: comfyicu,
-    [ClapWorkflowProvider.KUAISHOU]: kuaishou,
-    [ClapWorkflowProvider.LEONARDOAI]: leonardoai,
-    [ClapWorkflowProvider.EVERARTAI]: everartai,
   }

packages/app/src/components/forms/FormArea.tsx

@@ -0,0 +1,89 @@
+import {
+  ChangeEvent,
+  HTMLInputTypeAttribute,
+  ReactNode,
+  useMemo,
+  useRef,
+} from 'react'
+
+import { cn, getValidNumber, isValidNumber } from '@/lib/utils'
+
+import { Input } from '../ui/input'
+
+import { FormField } from './FormField'
+import { useTheme } from '@/services'
+import { Textarea } from '../ui/textarea'
+
+export function FormArea<T>(
+  {
+    label,
+    className,
+    placeholder,
+    value,
+    minValue,
+    maxValue,
+    defaultValue,
+    disabled,
+    onChange,
+    type,
+    rows = 4,
+    ...props
+  }: {
+    label?: ReactNode
+    className?: string
+    placeholder?: ReactNode
+    value?: T
+    minValue?: T
+    maxValue?: T
+    defaultValue?: T
+    disabled?: boolean
+    onChange?: (newValue: T) => void
+    type?: HTMLInputTypeAttribute
+    rows?: number
+    props?: any
+  }
+  //  & Omit<ComponentProps<typeof Input>, "value" | "defaultValue" | "placeholder" | "type" | "className" | "disabled" | "onChange">
+  // & ComponentProps<typeof Input>
+) {
+  const theme = useTheme()
+
+  const ref = useRef<HTMLTextAreaElement>(null)
+
+  const handleChange = useMemo(
+    () => (event: ChangeEvent<HTMLTextAreaElement>) => {
+      if (disabled) {
+        return
+      }
+      if (!onChange) {
+        return
+      }
+
+      const rawStringValue = `${event.currentTarget.value || ''}`
+
+      onChange(rawStringValue as T)
+    },
+    [defaultValue, disabled, onChange]
+  )
+
+  return (
+    <FormField label={label}>
+      <Textarea
+        ref={ref}
+        placeholder={`${placeholder || defaultValue || ''}`}
+        className={cn(`w-full`, `font-mono text-xs font-light`, className)}
+        disabled={disabled}
+        onChange={handleChange}
+        rows={rows}
+        // {...props}
+        value={`${value || defaultValue}`}
+        // since we are controlling the element with value=*, we should not use defaultValue=*
+        // defaultValue={`${defaultValue || ""}`}
+
+        style={{
+          borderRadius: theme.formInputRadius || '8px',
+        }}
+        {...props}
+      />
+    </FormField>
+  )
+}

packages/app/src/components/forms/index.ts

@@ -1,3 +1,4 @@
+export { FormArea } from './FormArea'
 export { FormDir } from './FormDir'
 export { FormField } from './FormField'
 export { FormFile } from './FormFile'

packages/app/src/components/settings/image.tsx

@@ -1,11 +1,14 @@
-import { FormSection } from '@/components/forms/FormSection'
+import { FormArea, FormInput, FormSection } from '@/components/forms'
 import { getDefaultSettingsState, useSettings } from '@/services/settings'
 
-import { FormInput } from '../forms/FormInput'
-
 export function SettingsSectionImage() {
   const defaultSettings = getDefaultSettingsState()
 
+  const comfyWorkflowForImage = useSettings((s) => s.comfyWorkflowForImage)
+  const setComfyWorkflowForImage = useSettings(
+    (s) => s.setComfyWorkflowForImage
+  )
+
   const imagePromptPrefix = useSettings((s) => s.imagePromptPrefix)
   const setImagePromptPrefix = useSettings((s) => s.setImagePromptPrefix)
 
@@ -52,6 +55,14 @@ export function SettingsSectionImage() {
           defaultValue={defaultSettings.imageNegativePrompt}
           onChange={setImageNegativePrompt}
         />
+
+        <FormArea
+          label="Custom ComfyUI workflows for images"
+          value={comfyWorkflowForImage}
+          defaultValue={defaultSettings.comfyWorkflowForImage}
+          onChange={setComfyWorkflowForImage}
+          rows={8}
+        />
       </FormSection>
     </div>
   )

packages/app/src/components/settings/index.tsx

@@ -1,5 +1,3 @@
-import { useState, useTransition } from 'react'
-
 import { Button } from '@/components/ui/button'
 import { Dialog, DialogContent, DialogFooter } from '@/components/ui/dialog'
 import { ScrollArea } from '@/components/ui/scroll-area'

packages/app/src/components/settings/music.tsx

@@ -1,14 +1,24 @@
-import { FormSection } from '@/components/forms/FormSection'
-import { getDefaultSettingsState } from '@/services/settings'
+import { FormArea, FormSection } from '@/components/forms'
+import { getDefaultSettingsState, useSettings } from '@/services/settings'
 
 export function SettingsSectionMusic() {
+  const defaultSettings = getDefaultSettingsState()
+
+  const comfyWorkflowForMusic = useSettings((s) => s.comfyWorkflowForMusic)
+  const setComfyWorkflowForMusic = useSettings(
+    (s) => s.setComfyWorkflowForMusic
+  )
+
   return (
     <div className="flex flex-col justify-between space-y-6">
       <FormSection label="Music rendering">
-        <p>No settings for the music yet.</p>
-        <p>
-          (In the future we might add a system prompt or prompt template here)
-        </p>
+        <FormArea
+          label="Custom ComfyUI workflows for music"
+          value={comfyWorkflowForMusic}
+          defaultValue={defaultSettings.comfyWorkflowForMusic}
+          onChange={setComfyWorkflowForMusic}
+          rows={8}
+        />
       </FormSection>
     </div>
   )

packages/app/src/components/settings/provider.tsx

@@ -92,6 +92,15 @@ export function SettingsSectionProvider() {
   const kitsAiApiKey = useSettings((s) => s.kitsAiApiKey)
   const setKitsAiApiKey = useSettings((s) => s.setKitsAiApiKey)
 
+  const letzAiApiKey = useSettings((s) => s.letzAiApiKey)
+  const setLetzAiApiKey = useSettings((s) => s.setLetzAiApiKey)
+
+  const bigModelApiKey = useSettings((s) => s.bigModelApiKey)
+  const setBigModelApiKey = useSettings((s) => s.setBigModelApiKey)
+
+  const piApiApiKey = useSettings((s) => s.piApiApiKey)
+  const setPiApiApiKey = useSettings((s) => s.setPiApiApiKey)
+
   const apiKeyType = showApiKeys ? 'text' : 'password'
 
   return (
@@ -296,6 +305,30 @@ export function SettingsSectionProvider() {
           onChange={setKitsAiApiKey}
           type={apiKeyType}
         />
+
+        <FormInput
+          label="LetzAI API Key"
+          value={letzAiApiKey}
+          defaultValue={defaultSettings.letzAiApiKey}
+          onChange={setLetzAiApiKey}
+          type={apiKeyType}
+        />
+
+        <FormInput
+          label="BigModel API Key"
+          value={bigModelApiKey}
+          defaultValue={defaultSettings.bigModelApiKey}
+          onChange={setBigModelApiKey}
+          type={apiKeyType}
+        />
+
+        <FormInput
+          label="PiApi API Key"
+          value={piApiApiKey}
+          defaultValue={defaultSettings.piApiApiKey}
+          onChange={setPiApiApiKey}
+          type={apiKeyType}
+        />
       </FormSection>
     </div>
   )

packages/app/src/components/settings/sound.tsx

@@ -1,13 +1,24 @@
-import { FormSection } from '@/components/forms/FormSection'
+import { FormArea, FormSection } from '@/components/forms'
+import { getDefaultSettingsState, useSettings } from '@/services/settings'
 
 export function SettingsSectionSound() {
+  const defaultSettings = getDefaultSettingsState()
+
+  const comfyWorkflowForSound = useSettings((s) => s.comfyWorkflowForSound)
+  const setComfyWorkflowForSound = useSettings(
+    (s) => s.setComfyWorkflowForSound
+  )
+
   return (
     <div className="flex flex-col justify-between space-y-6">
       <FormSection label="Sound rendering">
-        <p>No settings for the sound yet.</p>
-        <p>
-          (In the future we might add a system prompt or prompt template here)
-        </p>
+        <FormArea
+          label="Custom ComfyUI workflows for sound"
+          value={comfyWorkflowForSound}
+          defaultValue={defaultSettings.comfyWorkflowForSound}
+          onChange={setComfyWorkflowForSound}
+          rows={8}
+        />
       </FormSection>
     </div>
   )

packages/app/src/components/settings/video.tsx

@@ -1,10 +1,14 @@
-import { FormSection } from '@/components/forms/FormSection'
+import { FormArea, FormInput, FormSection } from '@/components/forms'
 import { getDefaultSettingsState, useSettings } from '@/services/settings'
-import { FormInput } from '../forms/FormInput'
 
 export function SettingsSectionVideo() {
   const defaultSettings = getDefaultSettingsState()
 
+  const comfyWorkflowForVideo = useSettings((s) => s.comfyWorkflowForVideo)
+  const setComfyWorkflowForVideo = useSettings(
+    (s) => s.setComfyWorkflowForVideo
+  )
+
   const videoPromptPrefix = useSettings((s) => s.videoPromptPrefix)
   const setVideoPromptPrefix = useSettings((s) => s.setVideoPromptPrefix)
 
@@ -51,6 +55,14 @@ export function SettingsSectionVideo() {
           defaultValue={defaultSettings.videoNegativePrompt}
           onChange={setVideoNegativePrompt}
         />
+
+        <FormArea
+          label="Custom ComfyUI workflows for video"
+          value={comfyWorkflowForVideo}
+          defaultValue={defaultSettings.comfyWorkflowForVideo}
+          onChange={setComfyWorkflowForVideo}
+          rows={8}
+        />
       </FormSection>
     </div>
   )

packages/app/src/components/settings/voice.tsx

@@ -1,13 +1,24 @@
-import { FormSection } from '@/components/forms/FormSection'
+import { FormArea, FormSection } from '@/components/forms'
+import { getDefaultSettingsState, useSettings } from '@/services/settings'
 
 export function SettingsSectionVoice() {
+  const defaultSettings = getDefaultSettingsState()
+
+  const comfyWorkflowForVoice = useSettings((s) => s.comfyWorkflowForVoice)
+  const setComfyWorkflowForVoice = useSettings(
+    (s) => s.setComfyWorkflowForVoice
+  )
+
   return (
     <div className="flex flex-col justify-between space-y-6">
       <FormSection label="Voice rendering">
-        <p>No settings for the voice yet.</p>
-        <p>
-          (In the future we might add a system prompt or prompt template here)
-        </p>
+        <FormArea
+          label="Custom ComfyUI workflows for voice"
+          value={comfyWorkflowForVoice}
+          defaultValue={defaultSettings.comfyWorkflowForVoice}
+          onChange={setComfyWorkflowForVoice}
+          rows={8}
+        />
       </FormSection>
     </div>
   )

packages/app/src/services/editors/workflow-editor/workflows/bigmodel/index.ts

@@ -0,0 +1,26 @@
+import {
+  ClapWorkflow,
+  ClapWorkflowCategory,
+  ClapWorkflowEngine,
+  ClapWorkflowProvider,
+} from '@aitube/clap'
+import { genericImage, genericImageUrl } from '../common/defaultValues'
+
+export const bigModelWorkflows: ClapWorkflow[] = [
+  {
+    id: 'bigmodel://api/paas/v4/cogvideox',
+    label: 'CogVideoX',
+    description: '',
+    tags: ['video'],
+    author: '',
+    thumbnailUrl: '',
+    engine: ClapWorkflowEngine.REST_API,
+    provider: ClapWorkflowProvider.BIGMODEL,
+    category: ClapWorkflowCategory.VIDEO_GENERATION,
+    data: 'cogvideox', // <- "code" of the model, see: https://bigmodel.cn/dev/api#cogvideox
+    inputFields: [genericImageUrl],
+    inputValues: {
+      [genericImageUrl.id]: genericImageUrl.defaultValue,
+    },
+  },
+]

packages/app/src/services/editors/workflow-editor/workflows/common/defaultValues.ts

@@ -32,6 +32,15 @@ export const genericPrompt: ClapInputField = {
   defaultValue: '',
 }
 
+export const genericRatio: ClapInputField = {
+  id: 'ratio',
+  label: 'Image ratio',
+  description: 'Image ratio (default to 1:1)',
+  type: 'string',
+  allowedValues: ['1:1', '16:9', '9:16'],
+  defaultValue: '1:1',
+}
+
 export const genericSeed: ClapInputField = {
   id: 'seed',
   label: 'Seed',
@@ -51,6 +60,15 @@ export const genericImage: ClapInputField = {
   defaultValue: '',
 }
 
+export const genericImageUrl: ClapInputField = {
+  id: 'image_url',
+  label: 'Image URL',
+  description: 'Image URL',
+  type: 'string',
+  allowedValues: [],
+  defaultValue: '',
+}
+
 export const genericVideo: ClapInputField = {
   id: 'video',
   label: 'Video',
@@ -60,6 +78,15 @@ export const genericVideo: ClapInputField = {
   defaultValue: '',
 }
 
+export const genericVideoUrl: ClapInputField = {
+  id: 'video_url',
+  label: 'Video URL',
+  description: 'Video URL',
+  type: 'string',
+  allowedValues: [],
+  defaultValue: '',
+}
+
 export const genericVoice: ClapInputField = {
   id: 'voice',
   label: 'Voice',

packages/app/src/services/editors/workflow-editor/workflows/falai/defaultWorkflows.ts

@@ -13,7 +13,7 @@ import {
   genericInput,
   genericSeed,
   genericPrompt,
-  genericVideo,
+  genericVideoUrl,
   genericWidth1024,
   genericWidth2048,
   genericMotionBucketId,
@@ -21,6 +21,7 @@ import {
   genericUpscalingFactor,
   genericOverlappingTiles,
   genericInferenceSteps,
+  genericImageUrl,
 } from '../common/defaultValues'
 import { sampleDrivingVideo, sampleVoice } from '@/lib/core/constants'
 
@@ -48,10 +49,7 @@ export const defaultWorkflows: ClapWorkflow[] = [
     category: ClapWorkflowCategory.VIDEO_GENERATION,
     data: 'fal-ai/stable-video',
     inputFields: [
-      {
-        ...genericImage,
-        id: 'image_url',
-      },
+      genericImageUrl,
       genericSeed,
       genericMotionBucketId,
       {
@@ -60,7 +58,7 @@ export const defaultWorkflows: ClapWorkflow[] = [
       },
     ],
     inputValues: {
-      image_url: genericImage.defaultValue,
+      [genericImageUrl.id]: genericImageUrl.defaultValue,
       [genericMotionBucketId.id]: 55,
       cond_aug: 0.02,
     },
@@ -238,15 +236,12 @@ export const defaultWorkflows: ClapWorkflow[] = [
     category: ClapWorkflowCategory.IMAGE_UPSCALING,
     data: 'fal-ai/aura-sr',
     inputFields: [
-      {
-        ...genericImage,
-        id: 'image_url',
-      },
+      genericImageUrl,
       genericUpscalingFactor,
       genericOverlappingTiles,
     ],
     inputValues: {
-      image_url: genericImage.defaultValue,
+      [genericImageUrl.id]: genericImageUrl.defaultValue,
       [genericUpscalingFactor.id]: genericUpscalingFactor.defaultValue,
       [genericOverlappingTiles.id]: genericOverlappingTiles.defaultValue,
     },
@@ -312,19 +307,10 @@ export const defaultWorkflows: ClapWorkflow[] = [
     provider: ClapWorkflowProvider.FALAI,
     category: ClapWorkflowCategory.VIDEO_GENERATION,
     data: 'fal-ai/live-portrait',
-    inputFields: [
-      {
-        ...genericImage,
-        id: 'image_url',
-      },
-      {
-        ...genericVideo,
-        id: 'video_url',
-      },
-    ],
+    inputFields: [genericImageUrl, genericVideoUrl],
     inputValues: {
-      image_url: genericImage.defaultValue,
-      video_url: sampleDrivingVideo,
+      [genericImageUrl.id]: genericImageUrl.defaultValue,
+      [genericVideoUrl.id]: sampleDrivingVideo,
     },
   },
 ]

packages/app/src/services/editors/workflow-editor/workflows/huggingface/index.ts

@@ -58,6 +58,25 @@ export const huggingfaceWorkflows: ClapWorkflow[] = [
       // TODO: add guidance scale and number of steps
     },
   },
+  {
+    id: 'huggingface://models/jbilcke-hf/flux-dev-panorama-lora-2',
+    label: 'FLUX.1-[dev] Panorama Lora (v2)',
+    description: 'Generate 360° panoramas using Flux (non-commercial use)',
+    tags: ['flux', '360°', 'panorama'],
+    author: '@jbilcke-hf',
+    // TODO add specific field about licensing?
+    thumbnailUrl: '',
+    engine: ClapWorkflowEngine.REST_API,
+    provider: ClapWorkflowProvider.HUGGINGFACE,
+    category: ClapWorkflowCategory.IMAGE_GENERATION,
+    data: 'jbilcke-hf/flux-dev-panorama-lora-2',
+    inputFields: [genericPrompt, genericWidth2048, genericHeight2048],
+    inputValues: {
+      prompt: genericPrompt.defaultValue,
+      width: genericWidth2048.defaultValue,
+      height: genericHeight2048.defaultValue,
+    },
+  },
   {
     id: 'huggingface://models/coqui/XTTS-v2',
     label: 'Coqui XTTS-v2',

packages/app/src/services/editors/workflow-editor/workflows/letzai/index.ts

@@ -0,0 +1,32 @@
+import {
+  ClapWorkflow,
+  ClapWorkflowCategory,
+  ClapWorkflowEngine,
+  ClapWorkflowProvider,
+} from '@aitube/clap'
+import {
+  genericHeight1024,
+  genericPrompt,
+  genericWidth1024,
+} from '../common/defaultValues'
+
+export const letzAiWorkflows: ClapWorkflow[] = [
+  {
+    id: 'letzai://api/images',
+    label: 'Create image with LetzAI',
+    image: '',
+    tags: ['image'],
+    author: '',
+    thumbnailUrl: '',
+    engine: ClapWorkflowEngine.REST_API,
+    provider: ClapWorkflowProvider.LETZAI,
+    category: ClapWorkflowCategory.IMAGE_GENERATION,
+    data: 'api/images', // <- this value isn't really used, it's just to put something here
+    inputFields: [genericPrompt, genericWidth1024, genericHeight1024],
+    inputValues: {
+      [genericPrompt.id]: genericPrompt.defaultValue,
+      [genericWidth1024.id]: genericWidth1024.defaultValue,
+      [genericHeight1024.id]: genericHeight1024.defaultValue,
+    },
+  },
+]

packages/app/src/services/editors/workflow-editor/workflows/piapi/index.ts

@@ -0,0 +1,58 @@
+import {
+  ClapWorkflow,
+  ClapWorkflowCategory,
+  ClapWorkflowEngine,
+  ClapWorkflowProvider,
+} from '@aitube/clap'
+import { genericImageUrl, genericPrompt } from '../common/defaultValues'
+
+export const piApiWorkflows: ClapWorkflow[] = [
+  {
+    id: 'piapi://Midjourney/Imagine',
+    label: 'Midjourne Imagine',
+    image: '',
+    tags: ['Midjourney'],
+    author: '',
+    thumbnailUrl: '',
+    engine: ClapWorkflowEngine.REST_API,
+    provider: ClapWorkflowProvider.PIAPI,
+    category: ClapWorkflowCategory.IMAGE_GENERATION,
+    data: 'mj/v2/imagine', // <- this value isn't really used, it's just to put something here
+    inputFields: [
+      genericPrompt,
+      // genericRatio
+      //genericWidth1024,
+      //genericHeight1024,
+    ],
+    inputValues: {
+      [genericPrompt.id]: genericPrompt.defaultValue,
+      // genericRatio
+      //[genericWidth1024.id]: genericWidth1024.defaultValue,
+      //[genericHeight1024.id]: genericHeight1024.defaultValue,
+    },
+  },
+  {
+    id: 'piapi://LumaLabs/DreamMachine',
+    label: 'Luma Labs Dream Machine',
+    image: '',
+    tags: ['Dream Machine'],
+    author: '',
+    thumbnailUrl: '',
+    engine: ClapWorkflowEngine.REST_API,
+    provider: ClapWorkflowProvider.PIAPI,
+    category: ClapWorkflowCategory.IMAGE_GENERATION,
+    data: 'luma/v1/video', // <- this value isn't really used, it's just to put something here
+    inputFields: [
+      genericImageUrl,
+      // genericRatio
+      //genericWidth1024,
+      //genericHeight1024,
+    ],
+    inputValues: {
+      [genericImageUrl.id]: genericImageUrl.defaultValue,
+      // genericRatio
+      //[genericWidth1024.id]: genericWidth1024.defaultValue,
+      //[genericHeight1024.id]: genericHeight1024.defaultValue,
+    },
+  },
+]

packages/app/src/services/settings/getDefaultSettingsState.ts

@@ -26,6 +26,9 @@ export function getDefaultSettingsState(): SettingsState {
     mistralAiApiKey: '',
     stabilityAiApiKey: '',
     fireworksAiApiKey: '',
+    letzAiApiKey: '',
+    bigModelApiKey: '',
+    piApiApiKey: '',
 
     broadcastObsServerHost: '192.168.1.22',
     broadcastObsServerPort: 4455,

packages/app/src/services/settings/useSettings.ts

@@ -210,6 +210,31 @@ export const useSettings = create<SettingsStore>()(
         })
       },
 
+      setLetzAiApiKey: (letzAiApiKey?: string) => {
+        set({
+          letzAiApiKey: getValidString(
+            letzAiApiKey,
+            getDefaultSettingsState().letzAiApiKey
+          ),
+        })
+      },
+      setBigModelApiKey: (bigModelApiKey?: string) => {
+        set({
+          bigModelApiKey: getValidString(
+            bigModelApiKey,
+            getDefaultSettingsState().bigModelApiKey
+          ),
+        })
+      },
+      setPiApiApiKey: (piApiApiKey?: string) => {
+        set({
+          piApiApiKey: getValidString(
+            piApiApiKey,
+            getDefaultSettingsState().piApiApiKey
+          ),
+        })
+      },
+
       setBroadcastObsServerHost: (broadcastObsServerHost: string) => {
         set({ broadcastObsServerHost })
       },
@@ -829,7 +854,10 @@ export const useSettings = create<SettingsStore>()(
             state.fireworksAiApiKey || defaultSettings.fireworksAiApiKey,
           stabilityAiApiKey:
             state.stabilityAiApiKey || defaultSettings.stabilityAiApiKey,
-
+          letzAiApiKey: state.letzAiApiKey || defaultSettings.letzAiApiKey,
+          bigModelApiKey:
+            state.bigModelApiKey || defaultSettings.bigModelApiKey,
+          piApiApiKey: state.piApiApiKey || defaultSettings.piApiApiKey,
           broadcastObsServerHost:
             state.broadcastObsServerHost ||
             defaultSettings.broadcastObsServerHost,

packages/clap/src/types.ts

@@ -527,6 +527,9 @@ export enum ClapWorkflowProvider {
   HEDRA = "HEDRA",
   LEONARDOAI = "LEONARDOAI",
   EVERARTAI = "EVERARTAI",
+  LETZAI = "LETZAI",
+  BIGMODEL = "BIGMODEL",
+  PIAPI = "PIAPI",
 }
 
   

packages/clapper-services/src/settings.ts

@@ -25,6 +25,9 @@ export type BaseSettings = {
   mistralAiApiKey: string
   stabilityAiApiKey: string
   fireworksAiApiKey: string
+  letzAiApiKey: string
+  bigModelApiKey: string
+  piApiApiKey: string
 
   broadcastObsServerHost: string
   broadcastObsServerPort: number
@@ -140,6 +143,9 @@ export type SettingsControls = {
   setMistralAiApiKey: (mistralAiApiKey?: string) => void
   setKitsAiApiKey: (kitsAiApiKey?: string) => void
   setStabilityAiApiKey: (stabilityAiApiKey?: string) => void
+  setLetzAiApiKey: (letzAiApiKey?: string) =>  void
+  setBigModelApiKey: (bigModelApiKey?: string) =>  void
+  setPiApiApiKey: (piApiApiKey?: string) =>  void
 
   setCensorNotForAllAudiencesContent: (censorNotForAllAudiencesContent?: boolean) => void
   setImagePromptPrefix: (imagePromptPrefix?: string) => void