chore: hidden tooltip

web/app/components/app/configuration/config-var/config-modal/__tests__/form-fields.spec.tsx

@@ -57,6 +57,12 @@ vi.mock('@/app/components/base/ui/select', () => ({
   SelectItem: ({ children }: { children: ReactNode }) => <div>{children}</div>,
 }))
 
+vi.mock('@/app/components/base/ui/tooltip', () => ({
+  Tooltip: ({ children }: { children: ReactNode }) => <div>{children}</div>,
+  TooltipTrigger: ({ children }: { children: ReactNode }) => <div>{children}</div>,
+  TooltipContent: ({ children }: { children: ReactNode }) => <div>{children}</div>,
+}))
+
 vi.mock('../field', () => ({
   default: ({ children, title }: { children: ReactNode, title: string }) => (
     <div>
@@ -169,6 +175,8 @@ describe('ConfigModalFormFields', () => {
       allowed_file_upload_methods: ['remote_url'],
     }
     render(<ConfigModalFormFields {...singleFileProps} />)
+    expect(screen.getByText('variableConfig.hidden')).toBeInTheDocument()
+    expect(screen.getByText('variableConfig.hiddenDescription')).toBeInTheDocument()
     fireEvent.click(screen.getByText('single-file-setting'))
     fireEvent.click(screen.getByText('upload-file'))
     fireEvent.click(screen.getAllByText('unchecked')[0])

web/app/components/app/configuration/config-var/config-modal/form-fields.tsx

@@ -3,6 +3,7 @@ import type { ChangeEvent, FC } from 'react'
 import type { Item as SelectOptionItem } from './type-select'
 import type { FileEntity } from '@/app/components/base/file-uploader/types'
 import type { InputVar, UploadFileSetting } from '@/app/components/workflow/types'
+import { RiQuestionLine } from '@remixicon/react'
 import * as React from 'react'
 import Checkbox from '@/app/components/base/checkbox'
 import { FileUploaderInAttachmentWrapper } from '@/app/components/base/file-uploader'
@@ -15,6 +16,7 @@ import {
   SelectTrigger,
   SelectValue,
 } from '@/app/components/base/ui/select'
+import { Tooltip, TooltipContent, TooltipTrigger } from '@/app/components/base/ui/tooltip'
 import CodeEditor from '@/app/components/workflow/nodes/_base/components/editor/code-editor'
 import FileUploadSetting from '@/app/components/workflow/nodes/_base/components/file-upload-setting'
 import { CodeLanguage } from '@/app/components/workflow/nodes/code/types'
@@ -219,7 +221,19 @@ const ConfigModalFormFields: FC<ConfigModalFormFieldsProps> = ({
 
       <div className="mt-5! flex h-6 items-center space-x-2">
         <Checkbox checked={tempPayload.hide} disabled={tempPayload.required} onCheck={() => onPayloadChange('hide')(!tempPayload.hide)} />
-        <span className="system-sm-semibold text-text-secondary">{t('variableConfig.hide', { ns: 'appDebug' })}</span>
+        <div className="flex items-center gap-1">
+          <span className="system-sm-semibold text-text-secondary">{t('variableConfig.hidden', { ns: 'appDebug' })}</span>
+          <Tooltip>
+            <TooltipTrigger>
+              <div className="flex h-4 w-4 items-center justify-center">
+                <RiQuestionLine className="h-3.5 w-3.5 text-text-tertiary" />
+              </div>
+            </TooltipTrigger>
+            <TooltipContent>
+              {t('variableConfig.hiddenDescription', { ns: 'appDebug' })}
+            </TooltipContent>
+          </Tooltip>
+        </div>
       </div>
     </div>
   )

web/i18n/en-US/app-debug.json

@@ -325,6 +325,8 @@
   "variableConfig.file.image.name": "Image",
   "variableConfig.file.supportFileTypes": "Support File Types",
   "variableConfig.file.video.name": "Video",
+  "variableConfig.hidden": "Hidden",
+  "variableConfig.hiddenDescription": "Hidden fields are not shown in the Web App start form and can be filled through URL query parameters.",
   "variableConfig.hide": "Hide",
   "variableConfig.inputPlaceholder": "Please input",
   "variableConfig.json": "JSON Code",

web/i18n/zh-Hans/app-debug.json

@@ -325,6 +325,8 @@
   "variableConfig.file.image.name": "图片",
   "variableConfig.file.supportFileTypes": "支持的文件类型",
   "variableConfig.file.video.name": "视频",
+  "variableConfig.hidden": "Hidden",
+  "variableConfig.hiddenDescription": "隐藏字段不会显示在 Web App 的开始表单中，可通过 URL 查询参数传值。",
   "variableConfig.hide": "隐藏",
   "variableConfig.inputPlaceholder": "请输入",
   "variableConfig.json": "JSON",