docs: vidu generation form

Author: Kadxy

app/client/ViduProxy.ts

@@ -1,20 +1,28 @@
 // app/client/ViduProxy.ts
 
+import {SunoEndpoint, ViduEndpoint} from "@/constant";
+import {api2ProviderBaseUrl} from "@/app/store";
+import {getRequestOptions} from "@/app/client/helper";
+
 export interface ViduTaskGenerationRequest {
     input: {
         prompts: {
+            type: string | "text" | "image";
             content: string;
             enhance: boolean;
-            type: "text"| "image";
         }[];
     };
+    type: string | "img2video";
     settings: {
         style: string;
         aspect_ratio: string;
         duration: number;
-        model: string;
+        model: string | "vidu-1";
     };
-    type: string;
+}
+
+export interface ViduTaskGenerationResponse {
+
 }
 
 export class ViduAPI {
@@ -24,5 +32,52 @@ export class ViduAPI {
         this.apiKey = apiKey;
     }
 
+    path(endpoint: ViduEndpoint) {
+        return [api2ProviderBaseUrl.Vidu, endpoint].join("/");
+    }
+
+    async generateViduTask(request: ViduTaskGenerationRequest, signal?: AbortSignal, timeoutMs: number = 10000) {
+        const controller = new AbortController();
+        const timeoutId = setTimeout(() => controller.abort(), timeoutMs);
+        const abortSignal = signal || controller.signal;
+
+        signal && signal.addEventListener("abort", () => controller.abort());
+
+        try {
+            const res = await fetch(this.path(ViduEndpoint.GENERATION), {
+                ...getRequestOptions(this.apiKey, request),
+                signal: abortSignal
+            });
+
+            clearTimeout(timeoutId);
+
+            return res;
+        } catch (e) {
+            console.error("[ViduProxy] failed to make a vidu generate-task request", e);
+            throw e;
+        }
+    }
+
+    async getViduTask(id: string, signal?: AbortSignal, timeoutMs: number = 10000) {
+        const controller = new AbortController();
+        const timeoutId = setTimeout(() => controller.abort(), timeoutMs);
+        const abortSignal = signal || controller.signal;
+
+        signal && signal.addEventListener("abort", () => controller.abort());
+
+        try {
+            const res = await fetch(this.path(ViduEndpoint.TASK_GET).replace("{{id}}", id), {
+                ...getRequestOptions(this.apiKey,"GET"),
+                signal: abortSignal
+            });
+
+            clearTimeout(timeoutId);
+
+            return res;
+        } catch (e) {
+            console.error("[ViduProxy] failed to make a vidu get-task request", e);
+            throw e;
+        }
+    }
 
 }

app/home.tsx

@@ -6,6 +6,7 @@ import dynamic from "next/dynamic";
 import {CENTER_STYLE, Path} from "@/constant";
 import SystemLogo from "@/app/icons/logo/logo.svg";
 import SunoIcon from "@/app/icons/suno.svg";
+import ViduIcon from "@/app/icons/vidu.svg";
 import LoadingIcon from "@/app/icons/three-dots.svg";
 import MidjourneyIcon from "@/app/icons/midjourney.svg";
 import StableDiffusionIcon from "@/app/icons/stable-diffusion.svg";
@@ -78,6 +79,10 @@ const SunoPage = dynamic(async () => (await import("./pages/Suno")).SunoPage, {
     loading: () => <Loading logo={<SunoIcon/>}/>,
 });
 
+const ViduPage = dynamic(async () => (await import("./pages/Vidu")).ViduPage, {
+    loading: () => <Loading logo={<ViduIcon/>}/>,
+});
+
 const PricingPage = dynamic(async () => (await import("./pages/Pricing")).PricingPage, {
     loading: () => <Loading/>,
 });
@@ -234,10 +239,14 @@ const App = (props: { dark: boolean, updateConfig: any }) => {
                         name: "Suno",
                         icon: <Icon component={SunoIcon}/>,
                     },
+                    {
+                        path: Path.Vidu,
+                        name: "Vidu",
+                        icon: <Icon component={ViduIcon}/>,
+                    },
                     {
                         path: Path.Pika,
                         name: "Pika",
-                        // icon: <VideoCameraFilled/>,
                         icon: <Icon component={PikaIcon}/>,
                     },
                     {
@@ -290,6 +299,7 @@ const App = (props: { dark: boolean, updateConfig: any }) => {
                     <Route path={Path.Midjourney} element={<MidjourneyPage/>}/>
                     <Route path={Path.StableDiffusion} element={<StableDiffusionPage/>}/>
                     <Route path={Path.Suno} element={<SunoPage/>}/>
+                    <Route path={Path.Vidu} element={<ViduPage/>}/>
                     <Route path={Path.Pika} element={<PikaPage/>}/>
                     <Route path={Path.Luma} element={<LumaPage/>}/>
                     <Route path={Path.Doc2X} element={<Doc2XPage/>}/>