From 0fea760143eb1b78835db6c7d42c7c048eee3547 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?=E9=9D=9E=E6=B3=95=E6=93=8D=E4=BD=9C?= <hjlarry@163.com>
Date: Thu, 16 Apr 2026 14:06:57 +0800
Subject: [PATCH] fix: http node key value type dropdown (#35304)

---
 .../nodes/http/__tests__/integration.spec.tsx | 33 ++++++++++++-
 .../key-value/key-value-edit/item.tsx         | 46 +++++++++++++------
 web/eslint-suppressions.json                  |  3 --
 3 files changed, 63 insertions(+), 19 deletions(-)

diff --git a/web/app/components/workflow/nodes/http/__tests__/integration.spec.tsx b/web/app/components/workflow/nodes/http/__tests__/integration.spec.tsx
index 99d240c6d6..93a4d08c3d 100644
--- a/web/app/components/workflow/nodes/http/__tests__/integration.spec.tsx
+++ b/web/app/components/workflow/nodes/http/__tests__/integration.spec.tsx
@@ -495,8 +495,8 @@ describe('http path', () => {
       )
 
       fireEvent.change(screen.getAllByDisplayValue('alice')[0], { target: { value: 'bob' } })
-      await user.click(screen.getByText('text'))
-      await user.click(screen.getByText('file'))
+      await user.click(screen.getAllByRole('combobox', { name: 'workflow.nodes.http.type' })[0]!)
+      await user.click(screen.getByRole('option', { name: /file/i }))
 
       expect(onChange).toHaveBeenCalled()
     })
@@ -558,6 +558,35 @@ describe('http path', () => {
       expect(onRemove).toHaveBeenCalled()
     })
 
+    it('should show the full file-type menu and update the row type selection', async () => {
+      const user = userEvent.setup()
+      const onChange = vi.fn()
+      render(
+        <KeyValueItem
+          instanceId="kv-type"
+          nodeId="node-1"
+          readonly={false}
+          canRemove
+          payload={{ id: 'kv-type', key: 'attachment', value: '', type: 'text' } as any}
+          onChange={onChange}
+          onRemove={vi.fn()}
+          isLastItem={false}
+          onAdd={vi.fn()}
+          isSupportFile
+        />,
+      )
+
+      await user.click(screen.getByRole('combobox', { name: 'workflow.nodes.http.type' }))
+
+      const fileOption = screen.getByRole('option', { name: /file/i })
+      expect(screen.getByRole('option', { name: /text/i })).toBeInTheDocument()
+      expect(fileOption.closest('.h-7')).toBeNull()
+
+      await user.click(fileOption)
+
+      expect(onChange).toHaveBeenCalledWith(expect.objectContaining({ type: 'file' }))
+    })
+
     it('should update the raw-text body payload', () => {
       const onChange = vi.fn()
       render(
diff --git a/web/app/components/workflow/nodes/http/components/key-value/key-value-edit/item.tsx b/web/app/components/workflow/nodes/http/components/key-value/key-value-edit/item.tsx
index f2fc2e9e1c..36e0fccbff 100644
--- a/web/app/components/workflow/nodes/http/components/key-value/key-value-edit/item.tsx
+++ b/web/app/components/workflow/nodes/http/components/key-value/key-value-edit/item.tsx
@@ -7,7 +7,15 @@ import { produce } from 'immer'
 import * as React from 'react'
 import { useCallback } from 'react'
 import { useTranslation } from 'react-i18next'
-import { PortalSelect } from '@/app/components/base/select'
+import {
+  Select,
+  SelectContent,
+  SelectItem,
+  SelectItemIndicator,
+  SelectItemText,
+  SelectTrigger,
+  SelectValue,
+} from '@/app/components/base/ui/select'
 import { VarType } from '@/app/components/workflow/types'
 import VarReferencePicker from '../../../../_base/components/variable/var-reference-picker'
 import InputItem from './input-item'
@@ -80,7 +88,7 @@ const KeyValueItem: FC<Props> = ({
 
   return (
     // group class name is for hover row show remove button
-    <div className={cn(className, 'h-min-7 group flex border-t border-divider-regular')}>
+    <div className={cn(className, 'group flex min-h-7 border-t border-divider-regular')}>
       <div className={cn('shrink-0 border-r border-divider-regular', isSupportFile ? 'w-[140px]' : 'w-1/2')}>
         {!keyNotSupportVar
           ? (
@@ -105,18 +113,28 @@ const KeyValueItem: FC<Props> = ({
       </div>
       {isSupportFile && (
         <div className="w-[70px] shrink-0 border-r border-divider-regular">
-          <PortalSelect
-            value={payload.type!}
-            onSelect={item => handleChange('type')(item.value as string)}
-            items={[
-              { name: 'text', value: 'text' },
-              { name: 'file', value: 'file' },
-            ]}
-            readonly={readonly}
-            triggerClassName="rounded-none h-7 text-text-primary"
-            triggerClassNameFn={isOpen => isOpen ? 'bg-state-base-hover' : 'bg-transparent'}
-            popupClassName="w-[80px] h-7"
-          />
+          <Select
+            value={payload.type ?? 'text'}
+            onValueChange={value => value && handleChange('type')(value)}
+            readOnly={readonly}
+          >
+            <SelectTrigger
+              aria-label={t(`${i18nPrefix}.type`, { ns: 'workflow' })}
+              className="h-7 rounded-none bg-transparent text-text-primary hover:bg-state-base-hover focus-visible:bg-state-base-hover data-popup-open:bg-state-base-hover"
+            >
+              <SelectValue />
+            </SelectTrigger>
+            <SelectContent popupClassName="w-[80px]" listClassName="min-w-0">
+              <SelectItem value="text">
+                <SelectItemText>text</SelectItemText>
+                <SelectItemIndicator />
+              </SelectItem>
+              <SelectItem value="file">
+                <SelectItemText>file</SelectItemText>
+                <SelectItemIndicator />
+              </SelectItem>
+            </SelectContent>
+          </Select>
         </div>
       )}
       <div
diff --git a/web/eslint-suppressions.json b/web/eslint-suppressions.json
index db20c37db5..a53c1b4de9 100644
--- a/web/eslint-suppressions.json
+++ b/web/eslint-suppressions.json
@@ -6209,9 +6209,6 @@
     }
   },
   "app/components/workflow/nodes/http/components/key-value/key-value-edit/item.tsx": {
-    "no-restricted-imports": {
-      "count": 1
-    },
     "ts/no-explicit-any": {
       "count": 1
     }