feat(flow-engine): add FlowStepContext for step management

packages/core/client/src/flow/components/DynamicFlowsIcon.tsx

@@ -8,7 +8,7 @@
  */
 
 import React from 'react';
-import { ThunderboltOutlined, DeleteOutlined, PlusOutlined, CloseOutlined } from '@ant-design/icons';
+import { ThunderboltOutlined, DeleteOutlined, PlusOutlined } from '@ant-design/icons';
 import {
   ActionDefinition,
   ActionScene,
@@ -18,6 +18,7 @@ import {
   useFlowContext,
   FlowDefinition,
   FlowStep,
+  FlowStepContext,
 } from '@nocobase/flow-engine';
 import { Collapse, Input, Button, Space, Tooltip, Empty, Dropdown, Select } from 'antd';
 import { uid } from '@formily/shared';
@@ -345,12 +346,16 @@ const DynamicFlowsEditor = observer((props: { model: FlowModel }) => {
                         </Tooltip>
                       </div>
                       <div>
-                        {flowEngine.flowSettings.renderStepForm({
-                          uiSchema: actionDef.uiSchema,
-                          initialValues: untracked(() => step.defaultParams), // 防止代码编辑器失焦
-                          flowEngine,
-                          onFormValuesChange: (form: any) => handleActionValueChange(step, form.values),
-                        })}
+                        {React.createElement(
+                          FlowStepContext.Provider,
+                          { value: { params: step.defaultParams, path: `${model.uid}_${step.flowKey}_${step.key}` } },
+                          flowEngine.flowSettings.renderStepForm({
+                            uiSchema: actionDef.uiSchema,
+                            initialValues: untracked(() => step.defaultParams), // 防止代码编辑器失焦
+                            flowEngine,
+                            onFormValuesChange: (form: any) => handleActionValueChange(step, form.values),
+                          }),
+                        )}
                       </div>
                     </div>
                   );

packages/core/flow-engine/src/flowSettings.ts

@@ -30,6 +30,7 @@ import {
   resolveUiMode,
   setupRuntimeContextSteps,
 } from './utils';
+import { FlowStepContext } from './hooks/useFlowStep';
 
 const Panel = Collapse.Panel;
 
@@ -777,12 +778,21 @@ export class FlowSettings {
           return React.createElement(
             FlowSettingsContextProvider as any,
             { value: entry.ctx },
-            this.renderStepForm({
-              uiSchema: entry.mergedUiSchema,
-              initialValues: entry.initialValues,
-              flowEngine,
-              form,
-            }),
+            React.createElement(
+              FlowStepContext.Provider,
+              {
+                value: {
+                  params: { ...entry.initialValues, ...form.values },
+                  path: `${model.uid}_${entry.flowKey}_${entry.stepKey}`,
+                },
+              },
+              this.renderStepForm({
+                uiSchema: entry.mergedUiSchema,
+                initialValues: entry.initialValues,
+                flowEngine,
+                form,
+              }),
+            ),
           );
         };
 

packages/core/flow-engine/src/hooks/index.ts

@@ -12,3 +12,4 @@ export * from './useFlowModel';
 export * from './useApplyAutoFlows';
 export * from './useFlowSettingsContext';
 export * from './useNiceDropdownMaxHeight';
+export * from './useFlowStep';

packages/core/flow-engine/src/hooks/useFlowStep.tsx

@@ -0,0 +1,19 @@
+/**
+ * This file is part of the NocoBase (R) project.
+ * Copyright (c) 2020-2024 NocoBase Co., Ltd.
+ * Authors: NocoBase Team.
+ *
+ * This project is dual-licensed under AGPL-3.0 and NocoBase Commercial License.
+ * For more information, please refer to: https://www.nocobase.com/agreement.
+ */
+
+import React, { useContext } from 'react';
+
+export const FlowStepContext = React.createContext({
+  path: '',
+  params: {} as Record<string, any>,
+});
+
+export const useFlowStep = () => {
+  return useContext(FlowStepContext);
+};