diff --git a/web/app/components/workflow/panel/chat-variable-panel/components/array-bool-list.tsx b/web/app/components/workflow/panel/chat-variable-panel/components/array-bool-list.tsx new file mode 100644 index 0000000000..334b47c261 --- /dev/null +++ b/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 = ({ + 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 ( +
+ {list.map((item, index) => ( +
+ + + +
+ ))} + +
+ ) +} +export default React.memo(ArrayValueList) diff --git a/web/app/components/workflow/panel/chat-variable-panel/components/variable-modal.tsx b/web/app/components/workflow/panel/chat-variable-panel/components/variable-modal.tsx index f03260649e..cbbebd7b75 100644 --- a/web/app/components/workflow/panel/chat-variable-panel/components/variable-modal.tsx +++ b/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 = ({
{t('workflow.chatVariable.modal.value')}
- {(type === ChatVarType.ArrayString || type === ChatVarType.ArrayNumber) && ( + {(type === ChatVarType.ArrayString || type === ChatVarType.ArrayNumber || type === ChatVarType.ArrayBoolean) && (