feat(triggers): add ability to use sample data

anteqkois · Jun 8, 2024 · 1b427ec · 1b427ec
1 parent 7ed4f1d
commit 1b427ec
Show file tree

Hide file tree

Showing 5 changed files with 118 additions and 20 deletions.
diff --git a/apps/web/modules/editor/steps/GenerateTestDataButton.tsx b/apps/web/modules/editor/steps/GenerateTestDataButton.tsx
@@ -7,24 +7,62 @@ export interface GenerateTestDataButtonProps extends HTMLAttributes<HTMLButtonEl
   disabledMessage: string
   text: string
   loading: boolean
+  haveSampleData?: boolean
+  onSelectSampleData?: () => void
 }
 
-export const GenerateTestDataButton = ({ disabled, disabledMessage, text, loading, onClick }: GenerateTestDataButtonProps) => {
+export const GenerateTestDataButton = ({
+  disabled,
+  disabledMessage,
+  text,
+  loading,
+  haveSampleData,
+  onSelectSampleData,
+  onClick,
+}: GenerateTestDataButtonProps) => {
   return (
-    <TooltipProvider delayDuration={200}>
-      <Tooltip>
-        <TooltipTrigger disabled={!disabled} asChild>
-          <ButtonClient loading={loading} variant="secondary" onClick={onClick} disabled={disabled} size={'sm'}>
-            <Icons.Test size={'xs'} className="mr-3 animate-pulse" />
-            <span className="whitespace-nowrap">{text}</span>
-          </ButtonClient>
-        </TooltipTrigger>
-        {disabled ? (
+    <div className="flex gap-2">
+      <TooltipProvider delayDuration={200}>
+        <Tooltip>
+          <TooltipTrigger disabled={!disabled} asChild>
+            <ButtonClient loading={loading} variant="secondary" onClick={onClick} disabled={disabled} size={'sm'}>
+              <Icons.Test size={'xs'} className="mr-3 animate-pulse" />
+              <span className="whitespace-nowrap">{text}</span>
+            </ButtonClient>
+          </TooltipTrigger>
           <TooltipContent>
-            <p>{disabledMessage}</p>
+            <p>{disabled ? disabledMessage : 'Test this trigger to generate sample data that can be used in the next steps'}</p>
           </TooltipContent>
-        ) : null}
-      </Tooltip>
-    </TooltipProvider>
+        </Tooltip>
+      </TooltipProvider>
+      {haveSampleData ? (
+        <>
+          <span>or</span>
+          <TooltipProvider delayDuration={200}>
+            <Tooltip>
+              <TooltipTrigger disabled={!disabled} asChild>
+                <ButtonClient
+                  loading={loading}
+                  variant="secondary"
+                  onClick={onSelectSampleData}
+                  disabled={disabled}
+                  size={'sm'}
+                  className="whitespace-nowrap"
+                >
+                  Use Mock Data
+                </ButtonClient>
+              </TooltipTrigger>
+              <TooltipContent>
+                <p>
+                  {disabled
+                    ? disabledMessage
+                    : 'You can use predefined sample data. In most case data schema is the same, but values can be different.'}
+                </p>
+              </TooltipContent>
+            </Tooltip>
+          </TooltipProvider>
+        </>
+      ) : null}
+    </div>
   )
 }
diff --git a/apps/web/modules/editor/trigger/TriggerConnectorPanel.tsx b/apps/web/modules/editor/trigger/TriggerConnectorPanel.tsx
@@ -231,6 +231,7 @@ export const TriggerConnectorPanel = () => {
           onResize={(size) => setTestDataPanelHeight(size)}
         >
           <TriggerTestFunction
+            sampleData={triggerWatcher.sampleData}
             panelSize={testDataPanelHeight}
             // TODO refactor this
             disabled={isEmpty(triggerWatcher?.name) || Object.keys(triggerForm.formState.errors).length !== 0 || !!flowOperationRunning}
@@ -246,6 +247,7 @@ export const TriggerConnectorPanel = () => {
           className="px-1"
         >
           <TriggerWebhookSimulation
+            sampleData={triggerWatcher.sampleData}
             panelSize={testDataPanelHeight}
             disabled={isEmpty(triggerWatcher?.name) || Object.keys(triggerForm.formState.errors).length !== 0 || !!flowOperationRunning}
             disabledMessage={flowOperationRunning ? 'Flow operation is running' : 'First fill all required Trigger fields'}

diff --git a/apps/web/modules/editor/trigger/TriggerTestFunction.tsx b/apps/web/modules/editor/trigger/TriggerTestFunction.tsx
@@ -17,9 +17,10 @@ export interface TriggerTestFunctionProps extends HTMLAttributes<HTMLElement> {
   panelSize: number
   disabled: boolean
   disabledMessage: string
+  sampleData?: any
 }
 
-export const TriggerTestFunction = ({ panelSize, disabled, disabledMessage }: TriggerTestFunctionProps) => {
+export const TriggerTestFunction = ({ panelSize, disabled, disabledMessage, sampleData }: TriggerTestFunctionProps) => {
   const { toast } = useToast()
   const { flow, editedTrigger, testPoolTrigger, flowOperationRunning, patchEditedTriggerConnector } = useEditor()
   assertNotNullOrUndefined(editedTrigger?.name, 'editedTrigger.name')
@@ -62,14 +63,39 @@ export const TriggerTestFunction = ({ panelSize, disabled, disabledMessage }: Tr
     [data],
   )
 
+  const onSelectSampleData = useCallback(async () => {
+    if (!sampleData)
+      return toast({
+        title: 'Can not retrive sample data',
+        description: `We can not retrive sample data. Please inform our team about this incident.`,
+        variant: 'destructive',
+      })
+
+    setRecord(prepareCodeMirrorValue(sampleData))
+    await patchEditedTriggerConnector({
+      settings: {
+        inputUiInfo: {
+          currentSelectedData: sampleData,
+        },
+      },
+    })
+  }, [sampleData])
+
   useEffect(() => {
     // remve trigger events when trigger changed
     setRecord('')
     refetch()
   }, [editedTrigger.settings.triggerName])
 
   useEffect(() => {
-    if (status !== 'success' || !data?.length) return
+    if (status !== 'success') return
+
+    if (!data?.length) {
+      //  check if user selected sample data
+      if (!editedTrigger.settings.inputUiInfo.currentSelectedData) return
+      setRecord(prepareCodeMirrorValue(editedTrigger.settings.inputUiInfo.currentSelectedData))
+    }
+
     if (!editedTrigger.settings.inputUiInfo.currentSelectedData || !editedTrigger.settings.inputUiInfo.lastTestDate) return
 
     setRecord(prepareCodeMirrorValue(editedTrigger.settings.inputUiInfo.currentSelectedData))
@@ -118,6 +144,8 @@ export const TriggerTestFunction = ({ panelSize, disabled, disabledMessage }: Tr
               </div>
             ) : null}
             <GenerateTestDataButton
+              haveSampleData={!!sampleData}
+              onSelectSampleData={onSelectSampleData}
               disabled={disabled}
               disabledMessage={disabledMessage}
               text="Regenerate Data"
@@ -147,6 +175,8 @@ export const TriggerTestFunction = ({ panelSize, disabled, disabledMessage }: Tr
       ) : (
         <div className="flex h-20 px-1 flex-center">
           <GenerateTestDataButton
+            haveSampleData={!!sampleData}
+            onSelectSampleData={onSelectSampleData}
             disabled={disabled}
             disabledMessage={disabledMessage}
             text="Generate Data"

diff --git a/apps/web/modules/editor/trigger/TriggerWebhookSimulation.tsx b/apps/web/modules/editor/trigger/TriggerWebhookSimulation.tsx
@@ -17,9 +17,10 @@ export interface TriggerWebhookSimulationProps extends HTMLAttributes<HTMLElemen
   panelSize: number
   disabled: boolean
   disabledMessage: string
+  sampleData?: any
 }
 
-export const TriggerWebhookSimulation = ({ panelSize, disabled, disabledMessage, triggerDisplayName }: TriggerWebhookSimulationProps) => {
+export const TriggerWebhookSimulation = ({ panelSize, disabled, disabledMessage, triggerDisplayName, sampleData }: TriggerWebhookSimulationProps) => {
   const { toast } = useToast()
   const {
     flow,
@@ -72,14 +73,39 @@ export const TriggerWebhookSimulation = ({ panelSize, disabled, disabledMessage,
     [data],
   )
 
+  const onSelectSampleData = useCallback(async () => {
+    if (!sampleData)
+      return toast({
+        title: 'Can not retrive sample data',
+        description: `We can not retrive sample data. Please inform our team about this incident.`,
+        variant: 'destructive',
+      })
+
+    setRecord(prepareCodeMirrorValue(sampleData))
+    await patchEditedTriggerConnector({
+      settings: {
+        inputUiInfo: {
+          currentSelectedData: sampleData,
+        },
+      },
+    })
+  }, [sampleData])
+
   useEffect(() => {
     // remve trigger events when trigger changed
     setRecord('')
     refetch()
   }, [editedTrigger.settings.triggerName])
 
   useEffect(() => {
-    if (status !== 'success' || !data?.length) return
+    if (status !== 'success') return
+
+    if (!data?.length) {
+      //  check if user selected sample data
+      if (!editedTrigger.settings.inputUiInfo.currentSelectedData) return
+      setRecord(prepareCodeMirrorValue(editedTrigger.settings.inputUiInfo.currentSelectedData))
+    }
+
     if (!editedTrigger.settings.inputUiInfo.currentSelectedData || !editedTrigger.settings.inputUiInfo.lastTestDate) return
 
     setRecord(prepareCodeMirrorValue(editedTrigger.settings.inputUiInfo.currentSelectedData))
@@ -148,6 +174,8 @@ export const TriggerWebhookSimulation = ({ panelSize, disabled, disabledMessage,
       </Button>
     ) : (
       <GenerateTestDataButton
+        haveSampleData={!!sampleData}
+        onSelectSampleData={onSelectSampleData}
         // or when test starts but the watcher isn't yet enabled
         disabled={disabled || (!!flowOperationRunning && !webhookTriggerWatcherWorks)}
         disabledMessage={disabledMessage}

diff --git a/tools/scripts/package-manager/package-pre-publish-checks.ts b/tools/scripts/package-manager/package-pre-publish-checks.ts
@@ -46,7 +46,7 @@ const getLatestPublishedVersionPrivateRegistry = async (packageName: string, max
       process.env.NODE_ENV === 'production' ? `http://64.226.97.74:4873/${packageName}/latest` : `http://localhost:4873/${packageName}/latest`
 
     try {
-      const response = await axios<PrivateRegistryPackageItem>(URL, {
+      const response = await axios.get<PrivateRegistryPackageItem>(URL, {
         headers:
           process.env.NODE_ENV === 'production'
             ? {
@@ -58,7 +58,7 @@ const getLatestPublishedVersionPrivateRegistry = async (packageName: string, max
       console.info(`[getLatestPublishedVersion] packageName=${packageName}, latestVersion=${version}`)
       return version
     } catch (err: any) {
-      if (!err?.error?.includes('no such package available')) console.dir(err.response.data, { depth: null })
+      if (!err?.error?.includes('no such package available')) console.log(err);
 
       if (attempt === maxRetries) {
         throw err // If it's the last attempt, rethrow the error