Concat textinput to input type (#2963)

* perf: toast position

* concat textinput to input

projects/app/src/components/core/app/VariableEdit.tsx

@@ -36,7 +36,7 @@ export const defaultVariable: VariableItemType = {
   id: nanoid(),
   key: '',
   label: '',
-  type: VariableInputEnum.textInput,
+  type: VariableInputEnum.input,
   description: '',
   required: true,
   valueType: WorkflowIOValueTypeEnum.string
@@ -73,10 +73,7 @@ const VariableEdit = ({
   const inputTypeList = useMemo(
     () =>
       Object.values(variableMap)
-        .filter(
-          (item) =>
-            item.value !== VariableInputEnum.input && item.value !== VariableInputEnum.textarea
-        )
+        .filter((item) => item.value !== VariableInputEnum.textarea)
         .map((item) => ({
           icon: item.icon,
           label: t(item.label as any),

projects/app/src/components/core/chat/ChatContainer/ChatBox/components/VariableInput.tsx

@@ -60,12 +60,13 @@ export const VariableInputItem = ({
         {item.description && <QuestionTip ml={1} label={item.description} />}
       </Box>
       {item.type === VariableInputEnum.input && (
-        <Input
-          maxLength={item.maxLength || 4000}
+        <PromptEditor
+          value={item.defaultValue}
+          onChange={(e) => setValue(item.key, e)}
           bg={'myGray.50'}
-          {...register(item.key, {
-            required: item.required
-          })}
+          minH={40}
+          maxH={150}
+          showOpenModal={false}
         />
       )}
       {item.type === VariableInputEnum.textarea && (
@@ -78,16 +79,7 @@ export const VariableInputItem = ({
           maxLength={item.maxLength || 4000}
         />
       )}
-      {item.type === VariableInputEnum.textInput && (
-        <PromptEditor
-          value={item.defaultValue}
-          onChange={(e) => setValue(item.key, e)}
-          bg={'myGray.50'}
-          minH={50}
-          maxH={150}
-          showOpenModal={false}
-        />
-      )}
+
       {item.type === VariableInputEnum.select && (
         <Controller
           key={item.key}

projects/app/src/components/core/chat/components/AIResponseBox.tsx

@@ -221,13 +221,12 @@ const RenderUserFormInteractive = React.memo(function RenderFormInput({
             {input.description && <QuestionTip ml={1} label={input.description} />}
           </Flex>
           {input.type === FlowNodeInputTypeEnum.input && (
-            <Input
-              bg={'white'}
-              maxLength={input.maxLength}
-              isDisabled={interactive.params.submitted}
-              {...register(input.label, {
-                required: input.required
-              })}
+            <PromptEditor
+              value={input.value}
+              onChange={(e) => setValue(input.label, e)}
+              minH={40}
+              maxH={100}
+              showOpenModal={false}
             />
           )}
           {input.type === FlowNodeInputTypeEnum.textarea && (
@@ -241,15 +240,6 @@ const RenderUserFormInteractive = React.memo(function RenderFormInput({
               maxLength={input.maxLength || 4000}
             />
           )}
-          {input.type === FlowNodeInputTypeEnum.textInput && (
-            <PromptEditor
-              value={input.value}
-              onChange={(e) => setValue(input.label, e)}
-              minH={40}
-              maxH={100}
-              showOpenModal={false}
-            />
-          )}
           {input.type === FlowNodeInputTypeEnum.numberInput && (
             <NumberInput
               step={1}

projects/app/src/pages/app/detail/components/Workflow/components/SaveButton.tsx

@@ -27,7 +27,7 @@ const SaveButton = ({
   const [isSave, setIsSave] = useState(false);
   const { toast } = useToast({
     containerStyle: {
-      mt: 20,
+      mt: '60px',
       fontSize: 'sm'
     }
   });

projects/app/src/pages/app/detail/components/WorkflowComponents/Flow/components/SaveAndPublish.tsx

@@ -22,7 +22,7 @@ const SaveAndPublishModal = ({
   const { t } = useTranslation();
   const { toast } = useToast({
     containerStyle: {
-      mt: 20,
+      mt: '60px',
       fontSize: 'sm'
     }
   });

projects/app/src/pages/app/detail/components/WorkflowComponents/Flow/nodes/NodeFormInput/InputFormEditModal.tsx

@@ -11,7 +11,7 @@ import { useToast } from '@fastgpt/web/hooks/useToast';
 import InputTypeConfig from '../NodePluginIO/InputTypeConfig';
 
 export const defaultFormInput: UserInputFormItemType = {
-  type: FlowNodeInputTypeEnum.textInput,
+  type: FlowNodeInputTypeEnum.input,
   key: '',
   label: '',
   description: '',
@@ -55,7 +55,7 @@ const InputFormEditModal = ({
     {
       icon: 'core/workflow/inputType/input',
       label: t('common:core.workflow.inputType.textInput'),
-      value: FlowNodeInputTypeEnum.textInput,
+      value: FlowNodeInputTypeEnum.input,
       defaultValueType: WorkflowIOValueTypeEnum.string
     },
     {

projects/app/src/pages/app/detail/components/WorkflowComponents/Flow/nodes/NodePluginIO/InputEditModal.tsx

@@ -55,7 +55,7 @@ const FieldEditModal = ({
           {
             icon: 'core/workflow/inputType/input',
             label: t('common:core.workflow.inputType.textInput'),
-            value: FlowNodeInputTypeEnum.textInput,
+            value: FlowNodeInputTypeEnum.input,
             defaultValueType: WorkflowIOValueTypeEnum.string
           },
           {

projects/app/src/pages/app/detail/components/WorkflowComponents/Flow/nodes/NodePluginIO/InputTypeConfig.tsx

@@ -137,7 +137,7 @@ const InputTypeConfig = ({
   }, [inputType]);
 
   const showMaxLenInput = useMemo(() => {
-    const list = [FlowNodeInputTypeEnum.textInput];
+    const list = [FlowNodeInputTypeEnum.input];
     return list.includes(inputType as FlowNodeInputTypeEnum);
   }, [inputType]);
 
@@ -148,7 +148,7 @@ const InputTypeConfig = ({
 
   const showDefaultValue = useMemo(() => {
     const list = [
-      FlowNodeInputTypeEnum.textInput,
+      FlowNodeInputTypeEnum.input,
       FlowNodeInputTypeEnum.JSONEditor,
       FlowNodeInputTypeEnum.numberInput,
       FlowNodeInputTypeEnum.switch,
@@ -323,7 +323,7 @@ const InputTypeConfig = ({
                   </NumberInputStepper>
                 </NumberInput>
               )}
-              {inputType === FlowNodeInputTypeEnum.textInput && (
+              {inputType === FlowNodeInputTypeEnum.input && (
                 <PromptEditor
                   value={defaultValue}
                   onChange={(e) => {

projects/app/src/pages/app/detail/components/WorkflowComponents/Flow/nodes/render/RenderInput/index.tsx

@@ -28,10 +28,6 @@ const RenderList: {
     types: [FlowNodeInputTypeEnum.switch],
     Component: dynamic(() => import('./templates/Switch'))
   },
-  {
-    types: [FlowNodeInputTypeEnum.textInput],
-    Component: dynamic(() => import('./templates/TextInput'))
-  },
   {
     types: [FlowNodeInputTypeEnum.selectApp],
     Component: dynamic(() => import('./templates/SelectApp'))

projects/app/src/pages/app/detail/components/WorkflowComponents/Flow/nodes/render/RenderInput/templates/TextInput.tsx

@@ -10,9 +10,7 @@ import { getEditorVariables } from '../../../../../utils';
 
 const TextInputRender = ({ inputs = [], item, nodeId }: RenderInputProps) => {
   const { t } = useTranslation();
-  const nodeList = useContextSelector(WorkflowContext, (v) => v.nodeList);
-  const edges = useContextSelector(WorkflowContext, (v) => v.edges);
-  const onChangeNode = useContextSelector(WorkflowContext, (v) => v.onChangeNode);
+  const { nodeList, edges, onChangeNode } = useContextSelector(WorkflowContext, (v) => v);
 
   const { appDetail } = useContextSelector(AppContext, (v) => v);
 
@@ -51,7 +49,7 @@ const TextInputRender = ({ inputs = [], item, nodeId }: RenderInputProps) => {
         maxLength={item.maxLength}
         minH={40}
         maxH={120}
-        placeholder={t((item.placeholder as any) || '')}
+        placeholder={t(item.placeholder as any)}
         value={item.value}
         onChange={onChange}
         isFlow={true}