chore: boolarray in varibale

web/app/components/workflow/panel/chat-variable-panel/components/array-bool-list.tsx

@@ -0,0 +1,69 @@
+'use client'
+import type { FC } from 'react'
+import React, { useCallback } from 'react'
+import { useTranslation } from 'react-i18next'
+import { RiAddLine } from '@remixicon/react'
+import produce from 'immer'
+import RemoveButton from '@/app/components/workflow/nodes/_base/components/remove-button'
+import Button from '@/app/components/base/button'
+import BoolValue from './bool-value'
+
+type Props = {
+  list: any[]
+  onChange: (list: any[]) => void
+}
+
+const ArrayValueList: FC<Props> = ({
+  list,
+  onChange,
+}) => {
+  const { t } = useTranslation()
+
+  const handleChange = useCallback((index: number) => {
+    return (value: boolean) => {
+      const newList = produce(list, (draft: any[]) => {
+        draft[index] = value
+      })
+      onChange(newList)
+    }
+  }, [list, onChange])
+
+  const handleItemRemove = useCallback((index: number) => {
+    return () => {
+      const newList = produce(list, (draft) => {
+        draft.splice(index, 1)
+      })
+      onChange(newList)
+    }
+  }, [list, onChange])
+
+  const handleItemAdd = useCallback(() => {
+    const newList = produce(list, (draft: any[]) => {
+      draft.push(undefined)
+    })
+    onChange(newList)
+  }, [list, onChange])
+
+  return (
+    <div className='w-full space-y-2'>
+      {list.map((item, index) => (
+        <div className='flex items-center space-x-1' key={index}>
+          <BoolValue
+            value={item}
+            onChange={handleChange(index)}
+          />
+
+          <RemoveButton
+            className='!bg-gray-100 !p-2 hover:!bg-gray-200'
+            onClick={handleItemRemove(index)}
+          />
+        </div>
+      ))}
+      <Button variant='tertiary' className='w-full' onClick={handleItemAdd}>
+        <RiAddLine className='mr-1 h-4 w-4' />
+        <span>{t('workflow.chatVariable.modal.addArrayValue')}</span>
+      </Button>
+    </div>
+  )
+}
+export default React.memo(ArrayValueList)

web/app/components/workflow/panel/chat-variable-panel/components/variable-modal.tsx

@@ -18,6 +18,7 @@ import { ChatVarType } from '@/app/components/workflow/panel/chat-variable-panel
 import cn from '@/utils/classnames'
 import { checkKeys, replaceSpaceWithUnderscreInVarNameInput } from '@/utils/var'
 import BoolValue from './bool-value'
+import ArrayBoolList from './array-bool-list'
 
 export type ModalPropsType = {
   chatVar?: ConversationVariable
@@ -38,6 +39,7 @@ const typeList = [
   ChatVarType.Object,
   ChatVarType.ArrayString,
   ChatVarType.ArrayNumber,
+  ChatVarType.ArrayBoolean,
   ChatVarType.ArrayObject,
 ]
 
@@ -68,6 +70,12 @@ const arrayObjectPlaceholder = `#  example
 #     }
 #  ]`
 
+const arrayBoolPlaceholder = `#  example
+#  [
+#     "True",
+#     "False"
+#  ]`
+
 const ChatVariableModal = ({
   chatVar,
   onClose,
@@ -96,6 +104,8 @@ const ChatVariableModal = ({
       return arrayNumberPlaceholder
     if (type === ChatVarType.ArrayObject)
       return arrayObjectPlaceholder
+    if (type === ChatVarType.ArrayBoolean)
+      return arrayBoolPlaceholder
     return objectPlaceholder
   }, [type])
   const getObjectValue = useCallback(() => {
@@ -161,6 +171,8 @@ const ChatVariableModal = ({
       setEditInJSON(false)
     if(v === ChatVarType.Boolean)
       setValue(true)
+    if (v === ChatVarType.ArrayBoolean)
+      setValue([true])
     setType(v)
   }
 
@@ -308,7 +320,7 @@ const ChatVariableModal = ({
         <div className='mb-4'>
           <div className='system-sm-semibold mb-1 flex h-6 items-center justify-between text-text-secondary'>
             <div>{t('workflow.chatVariable.modal.value')}</div>
-            {(type === ChatVarType.ArrayString || type === ChatVarType.ArrayNumber) && (
+            {(type === ChatVarType.ArrayString || type === ChatVarType.ArrayNumber || type === ChatVarType.ArrayBoolean) && (
               <Button
                 variant='ghost'
                 size='small'
@@ -375,6 +387,13 @@ const ChatVariableModal = ({
                 onChange={setValue}
               />
             )}
+            {type === ChatVarType.ArrayNumber && !editInJSON && (
+              <ArrayBoolList
+                list={value}
+                onChange={setValue}
+              />
+            )}
+
             {editInJSON && (
               <div className='w-full rounded-[10px] bg-components-input-bg-normal py-2 pl-3 pr-1' style={{ height: editorMinHeight }}>
                 <CodeEditor