feat: adapt the new run on version pipeline recipe in console (#1191)

Because - adapt the new run on version pipeline recipe in console This commit - adapt the new run on version pipeline recipe in console
instill-ai · Jun 1, 2024 · 935bd7c · 935bd7c
1 parent bfa6544
commit 935bd7c
Show file tree

Hide file tree

Showing 93 changed files with 1,182 additions and 1,831 deletions.
diff --git a/packages/toolkit/src/components/ClonePipelineDialog.tsx b/packages/toolkit/src/components/ClonePipelineDialog.tsx
@@ -141,12 +141,7 @@ export const ClonePipelineDialog = ({
 
     const payload: CreateUserPipelinePayload = {
       id: data.id,
-      recipe: {
-        version: pipeline.recipe.version,
-        trigger: pipeline.recipe.trigger,
-        components: pipeline.recipe.components,
-      },
-
+      recipe: pipeline.recipe,
       metadata: pipeline.metadata,
       readme: pipeline.readme,
       description: data.brief ? data.brief : pipeline.description,

diff --git a/packages/toolkit/src/lib/use-instill-form/components/regular/SingleSelectField.tsx b/packages/toolkit/src/lib/use-instill-form/components/regular/SingleSelectField.tsx
@@ -91,7 +91,7 @@ export const SingleSelectField = ({
           ) {
             form.setValue(
               currentCredentialFieldPath,
-              "${secrets." + `${InstillCredit.key}` + "}"
+              "${secret." + `${InstillCredit.key}` + "}"
             );
 
             if (updateForceCloseCollapsibleFormGroups) {

diff --git a/packages/toolkit/src/lib/use-instill-form/components/smart-hint/SmartHintList.tsx b/packages/toolkit/src/lib/use-instill-form/components/smart-hint/SmartHintList.tsx
@@ -103,7 +103,7 @@ export const SmartHintList = ({
                 >
                   {hint.isInstillCreditHint ? (
                     <div className="flex w-full flex-row justify-between">
-                      <p>{`secrets.${InstillCredit.key}`}</p>
+                      <p>{`secret.${InstillCredit.key}`}</p>
                       <Tooltip.Provider>
                         <Tooltip.Root>
                           <Tooltip.Trigger asChild>
@@ -151,7 +151,7 @@ export const SmartHintList = ({
           <p className="text-semantic-accent-default product-body-text-3-semibold">
             {instillCredential
               ? supportInstillCredit
-                ? "This configuration supports Instill Credit, You can use Instill Credit by input ${secrets." +
+                ? "This configuration supports Instill Credit, You can use Instill Credit by input ${secret." +
                   InstillCredit.key +
                   "}."
                 : "This configuration didn't support Instill Credit, please reference your own secret"

diff --git a/packages/toolkit/src/lib/use-instill-form/components/smart-hint/TextArea.tsx b/packages/toolkit/src/lib/use-instill-form/components/smart-hint/TextArea.tsx
@@ -240,8 +240,8 @@ export const TextArea = ({
                 supportInstillCredit && instillCredential
                   ? `${title} supports Instill Credit. You can use Instill Credit by input ` +
                     "${" +
-                    `secrets.${InstillCredit.key}` +
-                    "}. You can still bring your own key by input ${secrets.your_secret}"
+                    `secret.${InstillCredit.key}` +
+                    "}. You can still bring your own key by input ${secret.your_secret}"
                   : shortDescription ?? null
               }
             />

diff --git a/packages/toolkit/src/lib/use-instill-form/components/smart-hint/TextField.tsx b/packages/toolkit/src/lib/use-instill-form/components/smart-hint/TextField.tsx
@@ -252,8 +252,8 @@ export const TextField = ({
                 supportInstillCredit && instillCredential
                   ? `${title} supports Instill Credit. You can use Instill Credit by input ` +
                     "${" +
-                    `secrets.${InstillCredit.key}` +
-                    "}. You can still bring your own key by input ${secrets.your_secret}"
+                    `secret.${InstillCredit.key}` +
+                    "}. You can still bring your own key by input ${secret.your_secret}"
                   : shortDescription ?? null
               }
             />

diff --git a/packages/toolkit/src/lib/use-instill-form/components/smart-hint/onInputChange.tsx b/packages/toolkit/src/lib/use-instill-form/components/smart-hint/onInputChange.tsx
@@ -83,7 +83,7 @@ export function onInputChange({
   if (supportInstillCredit && updateIsUsingInstillCredit) {
     if (
       event.target.value.trim().replace("${", "").replace("}", "") !==
-      `secrets.${InstillCredit.key}`
+      `secret.${InstillCredit.key}`
     ) {
       updateIsUsingInstillCredit(false);
     } else {

diff --git a/packages/toolkit/src/lib/use-instill-form/components/smart-hint/useFilteredHints.tsx b/packages/toolkit/src/lib/use-instill-form/components/smart-hint/useFilteredHints.tsx
@@ -44,7 +44,7 @@ export function useFilteredHints({
     if (instillSecret && secrets) {
       allHints = secrets.map((secret) => ({
         key: secret.id,
-        path: `secrets.${secret.id}`,
+        path: `secret.${secret.id}`,
         instillFormat: "string",
         type: "string",
         properties: [],
@@ -56,7 +56,7 @@ export function useFilteredHints({
         ...allHints,
         {
           key: "instillCredit",
-          path: `secrets.${InstillCredit.key}`,
+          path: `secret.${InstillCredit.key}`,
           instillFormat: "string",
           type: "string",
           isInstillCreditHint: true,

diff --git a/packages/toolkit/src/lib/use-instill-form/pick/pickPipelineTriggerRequestFormFields.tsx b/packages/toolkit/src/lib/use-instill-form/pick/pickPipelineTriggerRequestFormFields.tsx
@@ -2,7 +2,7 @@ import { UseFormReturn } from "react-hook-form";
 import { Nullable } from "../../type";
 import { TriggerRequestFormFields } from "../components";
 import { FieldMode, StartOperatorFreeFormFieldItem } from "../types";
-import { PipelineTriggerRequestFields } from "../../vdp-sdk";
+import { PipelineVariableFieldMap } from "../../vdp-sdk";
 
 export type PickPipelineTriggerRequestFormFieldsProps = {
   mode: FieldMode;
@@ -15,7 +15,7 @@ export type PickPipelineTriggerRequestFormFieldsProps = {
   disabledFields?: boolean;
   disabledFieldControls?: boolean;
   disabledReferenceHint?: boolean;
-  fields: Nullable<PipelineTriggerRequestFields>;
+  fields: Nullable<PipelineVariableFieldMap>;
 };
 
 export function pickPipelineTriggerRequestFormFields({
@@ -37,12 +37,12 @@ export function pickPipelineTriggerRequestFormFields({
   // is we want to sort the fields by the order of `instillUIOrder` property.
 
   for (const [key, value] of Object.entries(fields)) {
-    switch (value.instill_format) {
+    switch (value.instillFormat) {
       case "string":
-        if (value.instill_ui_multiline) {
+        if (value.instillUiMultiline) {
           items.push({
             key,
-            instillUIOrder: value.instill_ui_order,
+            instillUIOrder: value.instillUiOrder,
             component: (
               <TriggerRequestFormFields.TextareaField
                 mode={mode}
@@ -57,14 +57,14 @@ export function pickPipelineTriggerRequestFormFields({
                 keyPrefix={keyPrefix}
                 disabledFieldControl={disabledFieldControls}
                 disabledReferenceHint={disabledReferenceHint}
-                instillFormat={value.instill_format}
+                instillFormat={value.instillFormat}
               />
             ),
           });
         } else {
           items.push({
             key,
-            instillUIOrder: value.instill_ui_order,
+            instillUIOrder: value.instillUiOrder,
             component: (
               <TriggerRequestFormFields.TextField
                 mode={mode}
@@ -79,7 +79,7 @@ export function pickPipelineTriggerRequestFormFields({
                 keyPrefix={keyPrefix}
                 disabledFieldControl={disabledFieldControls}
                 disabledReferenceHint={disabledReferenceHint}
-                instillFormat={value.instill_format}
+                instillFormat={value.instillFormat}
               />
             ),
           });
@@ -88,7 +88,7 @@ export function pickPipelineTriggerRequestFormFields({
       case "array:string": {
         items.push({
           key,
-          instillUIOrder: value.instill_ui_order,
+          instillUIOrder: value.instillUiOrder,
           component: (
             <TriggerRequestFormFields.TextsField
               mode={mode}
@@ -103,7 +103,7 @@ export function pickPipelineTriggerRequestFormFields({
               keyPrefix={keyPrefix}
               disabledFieldControl={disabledFieldControls}
               disabledReferenceHint={disabledReferenceHint}
-              instillFormat={value.instill_format}
+              instillFormat={value.instillFormat}
             />
           ),
         });
@@ -112,7 +112,7 @@ export function pickPipelineTriggerRequestFormFields({
       case "boolean":
         items.push({
           key,
-          instillUIOrder: value.instill_ui_order,
+          instillUIOrder: value.instillUiOrder,
           component: (
             <TriggerRequestFormFields.BooleanField
               mode={mode}
@@ -127,15 +127,15 @@ export function pickPipelineTriggerRequestFormFields({
               keyPrefix={keyPrefix}
               disabledFieldControl={disabledFieldControls}
               disabledReferenceHint={disabledReferenceHint}
-              instillFormat={value.instill_format}
+              instillFormat={value.instillFormat}
             />
           ),
         });
         break;
       case "number":
         items.push({
           key,
-          instillUIOrder: value.instill_ui_order,
+          instillUIOrder: value.instillUiOrder,
           component: (
             <TriggerRequestFormFields.NumberField
               mode={mode}
@@ -150,15 +150,15 @@ export function pickPipelineTriggerRequestFormFields({
               keyPrefix={keyPrefix}
               disabledFieldControl={disabledFieldControls}
               disabledReferenceHint={disabledReferenceHint}
-              instillFormat={value.instill_format}
+              instillFormat={value.instillFormat}
             />
           ),
         });
         break;
       case "array:number":
         items.push({
           key,
-          instillUIOrder: value.instill_ui_order,
+          instillUIOrder: value.instillUiOrder,
           component: (
             <TriggerRequestFormFields.NumbersField
               mode={mode}
@@ -173,15 +173,15 @@ export function pickPipelineTriggerRequestFormFields({
               keyPrefix={keyPrefix}
               disabledFieldControl={disabledFieldControls}
               disabledReferenceHint={disabledReferenceHint}
-              instillFormat={value.instill_format}
+              instillFormat={value.instillFormat}
             />
           ),
         });
         break;
       case "audio/*":
         items.push({
           key,
-          instillUIOrder: value.instill_ui_order,
+          instillUIOrder: value.instillUiOrder,
           component: (
             <TriggerRequestFormFields.AudioField
               mode={mode}
@@ -196,15 +196,15 @@ export function pickPipelineTriggerRequestFormFields({
               keyPrefix={keyPrefix}
               disabledFieldControl={disabledFieldControls}
               disabledReferenceHint={disabledReferenceHint}
-              instillFormat={value.instill_format}
+              instillFormat={value.instillFormat}
             />
           ),
         });
         break;
       case "array:audio/*":
         items.push({
           key,
-          instillUIOrder: value.instill_ui_order,
+          instillUIOrder: value.instillUiOrder,
           component: (
             <TriggerRequestFormFields.AudiosField
               mode={mode}
@@ -219,15 +219,15 @@ export function pickPipelineTriggerRequestFormFields({
               keyPrefix={keyPrefix}
               disabledFieldControl={disabledFieldControls}
               disabledReferenceHint={disabledReferenceHint}
-              instillFormat={value.instill_format}
+              instillFormat={value.instillFormat}
             />
           ),
         });
         break;
       case "image/*":
         items.push({
           key,
-          instillUIOrder: value.instill_ui_order,
+          instillUIOrder: value.instillUiOrder,
           component: (
             <TriggerRequestFormFields.ImageField
               mode={mode}
@@ -242,15 +242,15 @@ export function pickPipelineTriggerRequestFormFields({
               keyPrefix={keyPrefix}
               disabledFieldControl={disabledFieldControls}
               disabledReferenceHint={disabledReferenceHint}
-              instillFormat={value.instill_format}
+              instillFormat={value.instillFormat}
             />
           ),
         });
         break;
       case "array:image/*":
         items.push({
           key,
-          instillUIOrder: value.instill_ui_order,
+          instillUIOrder: value.instillUiOrder,
           component: (
             <TriggerRequestFormFields.ImagesField
               mode={mode}
@@ -265,7 +265,7 @@ export function pickPipelineTriggerRequestFormFields({
               keyPrefix={keyPrefix}
               disabledFieldControl={disabledFieldControls}
               disabledReferenceHint={disabledReferenceHint}
-              instillFormat={value.instill_format}
+              instillFormat={value.instillFormat}
             />
           ),
         });
@@ -274,7 +274,7 @@ export function pickPipelineTriggerRequestFormFields({
       case "video/*":
         items.push({
           key,
-          instillUIOrder: value.instill_ui_order,
+          instillUIOrder: value.instillUiOrder,
           component: (
             <TriggerRequestFormFields.VideoField
               mode={mode}
@@ -289,15 +289,15 @@ export function pickPipelineTriggerRequestFormFields({
               keyPrefix={keyPrefix}
               disabledFieldControl={disabledFieldControls}
               disabledReferenceHint={disabledReferenceHint}
-              instillFormat={value.instill_format}
+              instillFormat={value.instillFormat}
             />
           ),
         });
         break;
       case "array:video/*":
         items.push({
           key,
-          instillUIOrder: value.instill_ui_order,
+          instillUIOrder: value.instillUiOrder,
           component: (
             <TriggerRequestFormFields.VideosField
               mode={mode}
@@ -312,15 +312,15 @@ export function pickPipelineTriggerRequestFormFields({
               keyPrefix={keyPrefix}
               disabledFieldControl={disabledFieldControls}
               disabledReferenceHint={disabledReferenceHint}
-              instillFormat={value.instill_format}
+              instillFormat={value.instillFormat}
             />
           ),
         });
         break;
       case "*/*":
         items.push({
           key,
-          instillUIOrder: value.instill_ui_order,
+          instillUIOrder: value.instillUiOrder,
           component: (
             <TriggerRequestFormFields.FileField
               mode={mode}
@@ -335,15 +335,15 @@ export function pickPipelineTriggerRequestFormFields({
               keyPrefix={keyPrefix}
               disabledFieldControl={disabledFieldControls}
               disabledReferenceHint={disabledReferenceHint}
-              instillFormat={value.instill_format}
+              instillFormat={value.instillFormat}
             />
           ),
         });
         break;
       case "array:*/*":
         items.push({
           key,
-          instillUIOrder: value.instill_ui_order,
+          instillUIOrder: value.instillUiOrder,
           component: (
             <TriggerRequestFormFields.FilesField
               mode={mode}
@@ -358,15 +358,15 @@ export function pickPipelineTriggerRequestFormFields({
               keyPrefix={keyPrefix}
               disabledFieldControl={disabledFieldControls}
               disabledReferenceHint={disabledReferenceHint}
-              instillFormat={value.instill_format}
+              instillFormat={value.instillFormat}
             />
           ),
         });
         break;
       case "semi-structured/json":
         items.push({
           key,
-          instillUIOrder: value.instill_ui_order,
+          instillUIOrder: value.instillUiOrder,
           component: (
             <TriggerRequestFormFields.ObjectField
               mode={mode}
@@ -381,7 +381,7 @@ export function pickPipelineTriggerRequestFormFields({
               keyPrefix={keyPrefix}
               disabledFieldControl={disabledFieldControls}
               disabledReferenceHint={disabledReferenceHint}
-              instillFormat={value.instill_format}
+              instillFormat={value.instillFormat}
             />
           ),
         });