From d41c077facddcbc71bd3df0a957f0cca792f0333 Mon Sep 17 00:00:00 2001
From: Joel <iamjoel007@gmail.com>
Date: Thu, 30 May 2024 10:53:02 +0800
Subject: [PATCH] chore: improve node user experience (#4792)

---
 .../nodes/_base/components/variable/utils.ts     |  5 +++--
 .../workflow/nodes/iteration/panel.tsx           |  3 +++
 .../workflow/nodes/parameter-extractor/panel.tsx | 16 ++++++++--------
 3 files changed, 14 insertions(+), 10 deletions(-)

diff --git a/web/app/components/workflow/nodes/_base/components/variable/utils.ts b/web/app/components/workflow/nodes/_base/components/variable/utils.ts
index 6545358ee4..80d1b2777f 100644
--- a/web/app/components/workflow/nodes/_base/components/variable/utils.ts
+++ b/web/app/components/workflow/nodes/_base/components/variable/utils.ts
@@ -206,13 +206,14 @@ const formatItem = (item: any, isChatMode: boolean, filterVar: (payload: Var, se
 
     case BlockEnum.ParameterExtractor: {
       res.vars = [
-        ...PARAMETER_EXTRACTOR_COMMON_STRUCT,
         ...((data as ParameterExtractorNodeType).parameters || []).map((p) => {
           return {
             variable: p.name,
             type: p.type as unknown as VarType,
           }
-        })]
+        }),
+        ...PARAMETER_EXTRACTOR_COMMON_STRUCT,
+      ]
       break
     }
 
diff --git a/web/app/components/workflow/nodes/iteration/panel.tsx b/web/app/components/workflow/nodes/iteration/panel.tsx
index 8b6cf26ebb..5ca2f272fb 100644
--- a/web/app/components/workflow/nodes/iteration/panel.tsx
+++ b/web/app/components/workflow/nodes/iteration/panel.tsx
@@ -53,6 +53,9 @@ const Panel: FC<NodePanelProps<IterationNodeType>> = ({
       <div className='px-4 pb-4 space-y-4'>
         <Field
           title={t(`${i18nPrefix}.input`)}
+          operations={(
+            <div className='flex items-center h-[18px] px-1 border border-black/8 rounded-[5px] text-xs font-medium text-gray-500 capitalize'>Array</div>
+          )}
         >
           <VarReferencePicker
             readonly={readOnly}
diff --git a/web/app/components/workflow/nodes/parameter-extractor/panel.tsx b/web/app/components/workflow/nodes/parameter-extractor/panel.tsx
index 1a185c5af1..5b92dc1b04 100644
--- a/web/app/components/workflow/nodes/parameter-extractor/panel.tsx
+++ b/web/app/components/workflow/nodes/parameter-extractor/panel.tsx
@@ -176,6 +176,14 @@ const Panel: FC<NodePanelProps<ParameterExtractorNodeType>> = ({
         <div className='px-4 pt-4 pb-2'>
           <OutputVars>
             <>
+              {inputs.parameters.map((param, index) => (
+                <VarItem
+                  key={index}
+                  name={param.name}
+                  type={param.type}
+                  description={param.description}
+                />
+              ))}
               <VarItem
                 name='__is_success'
                 type={VarType.number}
@@ -186,14 +194,6 @@ const Panel: FC<NodePanelProps<ParameterExtractorNodeType>> = ({
                 type={VarType.string}
                 description={t(`${i18nPrefix}.errorReason`)}
               />
-              {inputs.parameters.map((param, index) => (
-                <VarItem
-                  key={index}
-                  name={param.name}
-                  type={param.type}
-                  description={param.description}
-                />
-              ))}
             </>
           </OutputVars>
         </div>