Fix: Fixed the issue that variables defined in the begin operator cannot be referenced in the switch operator. #3221 (#8950)

### What problem does this PR solve?

Fix: Fixed the issue that variables defined in the begin operator cannot
be referenced in the switch operator. #3221
### Type of change

- [x] Bug Fix (non-breaking change which fixes an issue)

web/src/pages/agent/hooks/use-get-begin-query.tsx

@@ -12,6 +12,14 @@ import { buildBeginInputListFromObject } from '../form/begin-form/utils';
 import { BeginQuery } from '../interface';
 import useGraphStore from '../store';
 
+export function useSelectBeginNodeDataInputs() {
+  const getNode = useGraphStore((state) => state.getNode);
+
+  return buildBeginInputListFromObject(
+    getNode(BeginId)?.data?.form?.inputs ?? {},
+  );
+}
+
 export const useGetBeginNodeDataQuery = () => {
   const getNode = useGraphStore((state) => state.getNode);
 
@@ -39,14 +47,14 @@ export const useGetBeginNodeDataInputs = () => {
 export const useGetBeginNodeDataQueryIsSafe = () => {
   const [isBeginNodeDataQuerySafe, setIsBeginNodeDataQuerySafe] =
     useState(false);
-  const getBeginNodeDataQuery = useGetBeginNodeDataQuery();
+  const inputs = useSelectBeginNodeDataInputs();
   const nodes = useGraphStore((state) => state.nodes);
 
   useEffect(() => {
-    const query: BeginQuery[] = getBeginNodeDataQuery();
+    const query: BeginQuery[] = inputs;
     const isSafe = !query.some((q) => !q.optional && q.type === 'file');
     setIsBeginNodeDataQuerySafe(isSafe);
-  }, [getBeginNodeDataQuery, nodes]);
+  }, [inputs, nodes]);
 
   return isBeginNodeDataQuerySafe;
 };
@@ -132,22 +140,21 @@ function transferToVariableType(type: string) {
 }
 
 export function useBuildBeginVariableOptions() {
-  const getBeginNodeDataQuery = useGetBeginNodeDataQuery();
+  const inputs = useSelectBeginNodeDataInputs();
 
   const options = useMemo(() => {
-    const query: BeginQuery[] = getBeginNodeDataQuery();
     return [
       {
         label: <span>Begin Input</span>,
         title: 'Begin Input',
-        options: query.map((x) => ({
+        options: inputs.map((x) => ({
           label: x.name,
           value: `begin@${x.key}`,
           type: transferToVariableType(x.type),
         })),
       },
     ];
-  }, [getBeginNodeDataQuery]);
+  }, [inputs]);
 
   return options;
 }

web/src/pages/agent/hooks/use-show-drawer.tsx

@@ -3,10 +3,9 @@ import { Node, NodeMouseHandler } from '@xyflow/react';
 import get from 'lodash/get';
 import { useCallback, useEffect } from 'react';
 import { Operator } from '../constant';
-import { BeginQuery } from '../interface';
 import useGraphStore from '../store';
 import { useCacheChatLog } from './use-cache-chat-log';
-import { useGetBeginNodeDataQuery } from './use-get-begin-query';
+import { useGetBeginNodeDataInputs } from './use-get-begin-query';
 import { useSaveGraph } from './use-save-graph';
 
 export const useShowFormDrawer = () => {
@@ -83,12 +82,11 @@ export function useShowDrawer({
   } = useShowSingleDebugDrawer();
   const { formDrawerVisible, hideFormDrawer, showFormDrawer, clickedNode } =
     useShowFormDrawer();
-  const getBeginNodeDataQuery = useGetBeginNodeDataQuery();
+  const inputs = useGetBeginNodeDataInputs();
 
   useEffect(() => {
     if (drawerVisible) {
-      const query: BeginQuery[] = getBeginNodeDataQuery();
-      if (query.length > 0) {
+      if (inputs.length > 0) {
         showRunModal();
         hideChatModal();
       } else {
@@ -102,7 +100,7 @@ export function useShowDrawer({
     showChatModal,
     showRunModal,
     drawerVisible,
-    getBeginNodeDataQuery,
+    inputs,
   ]);
 
   const hideRunOrChatDrawer = useCallback(() => {