import React, { memo, useCallback } from 'react' import { useTranslation } from 'react-i18next' import { useEmbeddedChatbotContext } from '../context' import Input from '@/app/components/base/input' import Textarea from '@/app/components/base/textarea' import { PortalSelect } from '@/app/components/base/select' import { FileUploaderInAttachmentWrapper } from '@/app/components/base/file-uploader' import { InputVarType } from '@/app/components/workflow/types' type Props = { showTip?: boolean } const InputsFormContent = ({ showTip }: Props) => { const { t } = useTranslation() const { appParams, inputsForms, currentConversationId, currentConversationInputs, setCurrentConversationInputs, newConversationInputs, newConversationInputsRef, handleNewConversationInputsChange, } = useEmbeddedChatbotContext() const inputsFormValue = currentConversationId ? currentConversationInputs : newConversationInputs const handleFormChange = useCallback((variable: string, value: any) => { setCurrentConversationInputs({ ...currentConversationInputs, [variable]: value, }) handleNewConversationInputsChange({ ...newConversationInputsRef.current, [variable]: value, }) }, [newConversationInputsRef, handleNewConversationInputsChange, currentConversationInputs, setCurrentConversationInputs]) return (
{inputsForms.map(form => (
{form.label}
{!form.required && (
{t('appDebug.variableTable.optional')}
)}
{form.type === InputVarType.textInput && ( handleFormChange(form.variable, e.target.value)} placeholder={form.label} /> )} {form.type === InputVarType.number && ( handleFormChange(form.variable, e.target.value)} placeholder={form.label} /> )} {form.type === InputVarType.paragraph && (