Feat: Hide part of the message field in webhook mode #10427 (#12100)

### What problem does this PR solve?

Feat: Hide part of the message field in webhook mode  #10427

### Type of change


- [x] New Feature (non-breaking change which adds functionality)

---------

Co-authored-by: balibabu <assassin_cike@163.com>

web/src/locales/en.ts

@@ -2120,8 +2120,8 @@ Important structured information may include: names, dates, locations, events, k
         queryParameters: 'Query parameters',
         headerParameters: 'Header parameters',
         requestBodyParameters: 'Request body parameters',
-        streaming: 'Accepted response',
-        immediately: 'Final response',
+        immediately: 'Accepted response',
+        streaming: 'Final response',
       },
     },
     llmTools: {

web/src/pages/agent/chat/use-send-agent-message.ts

@@ -7,7 +7,6 @@ import {
 import {
   IAttachment,
   IEventList,
-  IInputEvent,
   IMessageEndData,
   IMessageEndEvent,
   IMessageEvent,
@@ -93,7 +92,7 @@ export function findMessageFromList(eventList: IEventList) {
 export function findInputFromList(eventList: IEventList) {
   const inputEvent = eventList.find(
     (x) => x.event === MessageEventType.UserInputs,
-  ) as IInputEvent;
+  );
 
   if (!inputEvent) {
     return {};

web/src/pages/agent/form/message-form/index.tsx

@@ -1,4 +1,3 @@
-import { FormContainer } from '@/components/form-container';
 import { BlockButton, Button } from '@/components/ui/button';
 import {
   Form,
@@ -67,7 +66,6 @@ function MessageForm({ node }: INextOperatorForm) {
         {showWebhookResponseStatus && (
           <WebHookResponseStatusFormField name="status"></WebHookResponseStatusFormField>
         )}
-        <FormContainer>
         <FormItem>
           <FormLabel tooltip={t('flow.msgTip')}>{t('flow.msg')}</FormLabel>
           <div className="space-y-4">
@@ -108,8 +106,8 @@ function MessageForm({ node }: INextOperatorForm) {
           </div>
           <FormMessage />
         </FormItem>
-        </FormContainer>
-        <FormContainer>
+        {!showWebhookResponseStatus && (
+          <>
             <FormItem>
               <FormLabel tooltip={t('flow.downloadFileTypeTip')}>
                 {t('flow.downloadFileType')}
@@ -159,7 +157,8 @@ function MessageForm({ node }: INextOperatorForm) {
                 )}
               />
             </FormItem>
-        </FormContainer>
+          </>
+        )}
       </FormWrapper>
     </Form>
   );

web/src/pages/agent/form/message-form/use-show-response-status.ts

@@ -15,7 +15,7 @@ export function useShowWebhookResponseStatus(form: UseFormReturn<any>) {
   const showWebhookResponseStatus = useMemo(() => {
     const formData: BeginFormSchemaType = getNode(BeginId)?.data.form;
     return (
-      formData.mode === AgentDialogueMode.Webhook &&
+      formData?.mode === AgentDialogueMode.Webhook &&
       formData.execution_mode === WebhookExecutionMode.Streaming
     );
   }, []);