fix: choose file type problems

web/app/components/workflow/nodes/_base/components/file-type-item.tsx

@@ -10,7 +10,7 @@ import TagInput from '@/app/components/base/tag-input'
 type Props = {
   type: SupportUploadFileTypes.image | SupportUploadFileTypes.document | SupportUploadFileTypes.audio | SupportUploadFileTypes.video | SupportUploadFileTypes.custom
   selected: boolean
-  onSelect: (type: SupportUploadFileTypes) => void
+  onToggle: (type: SupportUploadFileTypes) => void
   onCustomFileTypesChange?: (customFileTypes: string[]) => void
   customFileTypes?: string[]
 }
@@ -18,26 +18,25 @@ type Props = {
 const FileTypeItem: FC<Props> = ({
   type,
   selected,
-  onSelect,
+  onToggle,
   customFileTypes = [],
   onCustomFileTypesChange = () => { },
 }) => {
   const { t } = useTranslation()
 
   const handleOnSelect = useCallback(() => {
-    if (!selected)
-      onSelect(type)
-  }, [selected, onSelect, type])
+    onToggle(type)
+  }, [onToggle, type])
 
   const isCustomSelected = type === SupportUploadFileTypes.custom && selected
 
   return (
     <div
       className={cn(
-        'rounded-lg bg-components-option-card-option-bg border border-components-option-card-option-border',
+        'rounded-lg bg-components-option-card-option-bg border border-components-option-card-option-border cursor-pointer select-none',
         !isCustomSelected && 'py-2 px-3',
         selected && 'border-[1.5px] bg-components-option-card-option-selected-bg border-components-option-card-option-selected-border',
-        !selected && 'cursor-pointer hover:bg-components-option-card-option-bg-hover hover:border-components-option-card-option-border-hover',
+        !selected && 'hover:bg-components-option-card-option-bg-hover hover:border-components-option-card-option-border-hover',
       )}
       onClick={handleOnSelect}
     >

web/app/components/workflow/nodes/_base/components/file-upload-setting.tsx

@@ -33,10 +33,20 @@ const FileUploadSetting: FC<Props> = ({
 
   const handleSupportFileTypeChange = useCallback((type: SupportUploadFileTypes) => {
     const newPayload = produce(payload, (draft) => {
-      if (draft.allowed_file_types.includes(type))
-        draft.allowed_file_types = draft.allowed_file_types.filter(v => v !== type)
-      else
-        draft.allowed_file_types.push(type)
+      if (type === SupportUploadFileTypes.custom) {
+        if (!draft.allowed_file_types.includes(SupportUploadFileTypes.custom))
+          draft.allowed_file_types = [SupportUploadFileTypes.custom]
+
+        else
+          draft.allowed_file_types = draft.allowed_file_types.filter(v => v !== type)
+      }
+      else {
+        draft.allowed_file_types = draft.allowed_file_types.filter(v => v !== SupportUploadFileTypes.custom)
+        if (draft.allowed_file_types.includes(type))
+          draft.allowed_file_types = draft.allowed_file_types.filter(v => v !== type)
+        else
+          draft.allowed_file_types.push(type)
+      }
     })
     onChange(newPayload)
   }, [onChange, payload])
@@ -74,7 +84,7 @@ const FileUploadSetting: FC<Props> = ({
   return (
     <div>
       <Field
-        title='SupportFile Types'
+        title={t('appDebug.variableConig.file.supportFileTypes')}
       >
         <div className='space-y-1'>
           {
@@ -83,14 +93,14 @@ const FileUploadSetting: FC<Props> = ({
                 key={type}
                 type={type as SupportUploadFileTypes.image | SupportUploadFileTypes.document | SupportUploadFileTypes.audio | SupportUploadFileTypes.video}
                 selected={allowed_file_types.includes(type)}
-                onSelect={handleSupportFileTypeChange}
+                onToggle={handleSupportFileTypeChange}
               />
             ))
           }
           <FileTypeItem
             type={SupportUploadFileTypes.custom}
             selected={allowed_file_types.includes(SupportUploadFileTypes.custom)}
-            onSelect={handleSupportFileTypeChange}
+            onToggle={handleSupportFileTypeChange}
             customFileTypes={allowed_file_extensions}
             onCustomFileTypesChange={handleCustomFileTypesChange}
           />

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

@@ -325,6 +325,7 @@ const translation = {
     'content': 'Content',
     'required': 'Required',
     'file': {
+      supportFileTypes: 'Support File Types',
       image: {
         name: 'Image',
       },

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

@@ -321,6 +321,7 @@ const translation = {
     'labelName': '显示名称',
     'required': '必填',
     'file': {
+      supportFileTypes: '支持的文件类型',
       image: {
         name: '图片',
       },