From 716936e37a4c501e36c8979389fcbb1c165d384b Mon Sep 17 00:00:00 2001
From: Joel <iamjoel007@gmail.com>
Date: Tue, 2 Apr 2024 18:30:48 +0800
Subject: [PATCH] fix: remove key replicate

---
 .../_base/components/readonly-input-with-select-var.tsx     | 6 +++---
 .../workflow/nodes/http/hooks/use-key-value-list.ts         | 2 +-
 2 files changed, 4 insertions(+), 4 deletions(-)

diff --git a/web/app/components/workflow/nodes/_base/components/readonly-input-with-select-var.tsx b/web/app/components/workflow/nodes/_base/components/readonly-input-with-select-var.tsx
index fdf5dece7c..7c36b10188 100644
--- a/web/app/components/workflow/nodes/_base/components/readonly-input-with-select-var.tsx
+++ b/web/app/components/workflow/nodes/_base/components/readonly-input-with-select-var.tsx
@@ -34,7 +34,7 @@ const ReadonlyInputWithSelectVar: FC<Props> = ({
 
     const html: JSX.Element[] = strWithVarPlaceholder.split(VAR_PLACEHOLDER).map((str, index) => {
       if (!vars[index])
-        return <span className='leading-[20px]'>{str}</span>
+        return <span className='leading-[20px]' key={index}>{str}</span>
 
       const value = vars[index].split('.')
       const isSystem = isSystemVar(value)
@@ -64,7 +64,7 @@ const ReadonlyInputWithSelectVar: FC<Props> = ({
           return type
         }
       })()
-      return (<>
+      return (<span key={index}>
         <span className='leading-[20px]'>{str}</span>
         <div className=' inline-flex h-[26px] items-center px-1.5 rounded-[5px] bg-white'>
           <div className='flex items-center'>
@@ -83,7 +83,7 @@ const ReadonlyInputWithSelectVar: FC<Props> = ({
           </div>
           <div className='ml-0.5 text-xs font-normal text-gray-500 capitalize truncate' title={type} >{type}</div>
         </div>
-      </>)
+      </span>)
     })
     return html
   })()
diff --git a/web/app/components/workflow/nodes/http/hooks/use-key-value-list.ts b/web/app/components/workflow/nodes/http/hooks/use-key-value-list.ts
index db4757fb65..55ee490474 100644
--- a/web/app/components/workflow/nodes/http/hooks/use-key-value-list.ts
+++ b/web/app/components/workflow/nodes/http/hooks/use-key-value-list.ts
@@ -47,7 +47,7 @@ const useKeyValueList = (value: string, onChange: (value: string) => void, noFil
   }] = useBoolean(true)
 
   return {
-    list: list.length === 0 ? [{ key: '', value: '' }] : list, // no item can not add new item
+    list: list.length === 0 ? [{ id: uniqueId(UNIQUE_ID_PREFIX), key: '', value: '' }] : list, // no item can not add new item
     setList,
     addItem,
     isKeyValueEdit,