@nocobase/client-v2 2.1.0-beta.30 → 2.1.0-beta.33

package/src/flow/actions/setTargetDataScope.tsx

@@ -10,6 +10,7 @@
 import {
   ActionScene,
   defineAction,
+  extractUsedVariablePaths,
   FlowModel,
   MultiRecordResource,
   useFlowContext,
@@ -20,6 +21,34 @@ import React from 'react';
 import { FilterGroup, VariableFilterItem } from '../components/filter';
 import { normalizeDataScopeFilter } from './dataScopeFilter';
 
+function dependsOnClickedRowRecord(filter: any) {
+  if (!filter) {
+    return false;
+  }
+  const used = extractUsedVariablePaths(filter) || {};
+  return Object.prototype.hasOwnProperty.call(used, 'clickedRowRecord');
+}
+
+function shouldClearClickedRowDataScope(ctx: any, params: any) {
+  return ctx.inputArgs?.selected === false && dependsOnClickedRowRecord(params.filter);
+}
+
+function resolveTargetDataScopeFilter(ctx: any, params: any, resolvedParams: any) {
+  if (shouldClearClickedRowDataScope(ctx, params)) {
+    return undefined;
+  }
+
+  return normalizeDataScopeFilter(params.filter, resolvedParams.filter);
+}
+
+function shouldRefreshTargetResource(resource: MultiRecordResource) {
+  if (resource.hasData()) {
+    return true;
+  }
+
+  return resource.getMeta?.('count') !== undefined || resource.getMeta?.('hasNext') !== undefined;
+}
+
 export const setTargetDataScope = defineAction({
   name: 'setTargetDataScope',
   title: tExpr('Set data scope'),
@@ -69,20 +98,20 @@ export const setTargetDataScope = defineAction({
       return;
     }
     const model: FlowModel = ctx.model;
+    const filter = resolveTargetDataScopeFilter(ctx, params, resolvedParams);
+
     model.scheduleModelOperation(targetBlockUid, (targetModel) => {
       const resource = targetModel['resource'] as MultiRecordResource;
       if (!resource) {
         return;
       }
 
-      const filter = normalizeDataScopeFilter(params.filter, resolvedParams.filter);
-
       if (isEmptyFilter(filter)) {
         resource.removeFilterGroup(`setTargetDataScope_${ctx.model.uid}`);
       } else {
         resource.addFilterGroup(`setTargetDataScope_${ctx.model.uid}`, filter);
       }
-      if (resource.hasData()) {
+      if (shouldRefreshTargetResource(resource)) {
         resource.refresh();
       }
     });

package/src/flow/actions/titleField.tsx

@@ -43,7 +43,9 @@ export const titleField = defineAction({
     const options = targetFields
       .filter((field) =>
         isTitleFieldInterface(
-          getFlowFieldInterfaceOptions(field.options?.interface || field.interface, dataSourceManager),
+          typeof field.getInterfaceOptions === 'function'
+            ? field.getInterfaceOptions()
+            : getFlowFieldInterfaceOptions(field.options?.interface || field.interface, dataSourceManager),
         ),
       )
       .map((field) => ({
@@ -59,7 +61,7 @@ export const titleField = defineAction({
     };
   },
   defaultParams: (ctx: any) => {
-    const titleField = ctx.model.context.collectionField.targetCollectionTitleFieldName;
+    const titleField = ctx.model?.context?.collectionField?.targetCollectionTitleFieldName;
     return {
       label: ctx.model.parent?.props?.titleField || ctx.model.props.titleField || titleField,
     };

package/src/flow/actions/validation.tsx

@@ -18,7 +18,7 @@ export const validation = defineAction({
       return;
     }
     const targetInterface = ctx.model.collectionField.getInterfaceOptions();
-    if (!targetInterface.validationType) {
+    if (!targetInterface?.validationType) {
       return null;
     }
     return {

package/src/flow/admin-shell/admin-layout/AdminLayoutMenuModels.tsx

@@ -628,10 +628,6 @@ export class AdminLayoutMenuItemModel extends FlowModel<AdminLayoutMenuItemStruc
           )
           .filter(Boolean) || [];
 
-      if (isV2AdminRuntime(this.context.app) && children.length === 0) {
-        return null;
-      }
-
       if (options.designable && depth === 0) {
         children.push(getAdminLayoutMenuInitializerButton('schema-initializer-Menu-side', this, route));
       }

package/src/flow/admin-shell/admin-layout/__tests__/AdminLayoutMenuModels.test.ts

@@ -311,7 +311,7 @@ describe('AdminLayoutModel menu items', () => {
     expect(route.children[1]._model).toBe(adminLayoutModel.subModels.menuItems?.[1]);
   });
 
-  it('should filter legacy page menu routes in v2 admin layout', () => {
+  it('should filter legacy page menu routes but keep empty groups in v2 admin layout', () => {
     const adminLayoutModel = engine.createModel<AdminLayoutModel>({
       uid: 'admin-layout-model',
       use: AdminLayoutModel,
@@ -369,22 +369,30 @@ describe('AdminLayoutModel menu items', () => {
       t: (title) => title,
     });
 
-    expect(route.children).toHaveLength(2);
+    expect(route.children).toHaveLength(3);
     expect(route.children[0]).toMatchObject({
+      path: '/admin/2',
+      redirect: '/admin/2',
+      _runtimePath: null,
+      _navigationMode: 'spa',
+      _isLegacy: false,
+    });
+    expect(route.children[0].routes).toBeUndefined();
+    expect(route.children[1]).toMatchObject({
       path: '/admin/3',
       redirect: '/admin/nested-flow-page',
       _runtimePath: '/apps/demo/v2/admin/nested-flow-page',
       _navigationMode: 'spa',
       _isLegacy: false,
     });
-    expect(route.children[0].routes).toHaveLength(1);
-    expect(route.children[0].routes?.[0]).toMatchObject({
+    expect(route.children[1].routes).toHaveLength(1);
+    expect(route.children[1].routes?.[0]).toMatchObject({
       path: '/admin/nested-flow-page',
       _runtimePath: '/apps/demo/v2/admin/nested-flow-page',
       _navigationMode: 'spa',
       _isLegacy: false,
     });
-    expect(route.children[1]).toMatchObject({
+    expect(route.children[2]).toMatchObject({
       path: '/admin/__admin_layout__/link/4',
     });
   });

package/src/flow/components/DynamicFlowsIcon.tsx

@@ -28,6 +28,9 @@ import {
   GLOBAL_EMBED_CONTAINER_ID,
   EMBED_REPLACING_DATA_KEY,
   shouldHideEventInSettings,
+  DetachedFlowRegistry,
+  replaceFlowRegistry,
+  serializeFlowRegistry,
 } from '@nocobase/flow-engine';
 import { Collapse, Input, Button, Space, Tooltip, Empty, Dropdown, Select } from 'antd';
 import { uid } from '@formily/shared';
@@ -35,6 +38,9 @@ import { useUpdate } from 'ahooks';
 import _ from 'lodash';
 
 type FlowOnObject = Exclude<FlowDefinition['on'], string | undefined>;
+type FlowRegistryAvailability = {
+  hasFlow(flowKey: string): boolean;
+};
 
 function isFlowOnObject(on: FlowDefinition['on']): on is FlowOnObject {
   return !!on && typeof on === 'object';
@@ -93,7 +99,7 @@ function validateFlowOnPhase(onObj: FlowOnObject): 'flowKey' | 'stepKey' | undef
 
 export const DynamicFlowsIcon: React.FC<{ model: FlowModel }> = (props) => {
   const { model } = props;
-  const t = model.translate.bind(model);
+  const t = React.useMemo(() => model.translate.bind(model), [model]);
 
   const handleClick = () => {
     const target = document.querySelector<HTMLDivElement>(`#${GLOBAL_EMBED_CONTAINER_ID}`);
@@ -190,7 +196,17 @@ const FieldLabel = ({
 
 // 事件配置组件 - 独立的 observer 组件确保响应式更新
 const EventConfigSection = observer(
-  ({ flow, model, flowEngine }: { flow: FlowDefinition; model: FlowModel; flowEngine: any }) => {
+  ({
+    flow,
+    model,
+    flowEngine,
+    flowRegistry,
+  }: {
+    flow: FlowDefinition;
+    model: FlowModel;
+    flowEngine: any;
+    flowRegistry: FlowRegistryAvailability;
+  }) => {
     const ctx = useFlowContext<FlowEngineContext>();
     const t = model.translate.bind(model);
     const refresh = useUpdate();
@@ -270,9 +286,9 @@ const EventConfigSection = observer(
       return staticFlows.map((f) => ({
         value: f.key,
         label: formatKeyWithTitle(String(f.key), f.title),
-        disabled: model.flowRegistry.hasFlow(f.key),
+        disabled: flowRegistry.hasFlow(f.key),
       }));
-    }, [formatKeyWithTitle, model.flowRegistry, staticFlows]);
+    }, [flowRegistry, formatKeyWithTitle, staticFlows]);
 
     const stepOptions = React.useMemo(() => {
       if (!flowKeyValue) return [];
@@ -446,12 +462,58 @@ const DynamicFlowsEditor = observer((props: { model: FlowModel }) => {
   const { model } = props;
   const ctx = useFlowContext<FlowEngineContext>();
   const flowEngine = model.flowEngine;
+  const latestFlows = serializeFlowRegistry(model.flowRegistry);
+  const initialFlowsRef = React.useRef(latestFlows);
+  const [draftFlowRegistry] = React.useState(() => new DetachedFlowRegistry(latestFlows));
   const [submitLoading, setSubmitLoading] = React.useState(false);
-  const t = model.translate.bind(model);
+  const t = React.useMemo(() => model.translate.bind(model), [model]);
+  const hasUnsavedChanges = React.useCallback(() => {
+    return !_.isEqual(initialFlowsRef.current, serializeFlowRegistry(draftFlowRegistry));
+  }, [draftFlowRegistry]);
+
+  React.useEffect(() => {
+    if (_.isEqual(initialFlowsRef.current, latestFlows) || hasUnsavedChanges()) {
+      return;
+    }
+
+    replaceFlowRegistry(draftFlowRegistry, latestFlows);
+    initialFlowsRef.current = latestFlows;
+  }, [draftFlowRegistry, hasUnsavedChanges, latestFlows]);
+
+  React.useEffect(() => {
+    const view = ctx.view;
+    const previousBeforeClose = view.beforeClose;
+    const beforeClose = async (payload) => {
+      if (hasUnsavedChanges()) {
+        const confirmed =
+          (await ctx.modal?.confirm?.({
+            title: t('Unsaved changes'),
+            content: t("Are you sure you don't want to save?"),
+            okText: t('Confirm'),
+            cancelText: t('Cancel'),
+          })) ?? true;
+
+        if (!confirmed) {
+          return false;
+        }
+      }
+
+      const result = await previousBeforeClose?.(payload);
+      return result !== false;
+    };
+
+    view.beforeClose = beforeClose;
+
+    return () => {
+      if (view.beforeClose === beforeClose) {
+        view.beforeClose = previousBeforeClose;
+      }
+    };
+  }, [ctx, hasUnsavedChanges, t]);
 
   // 添加新流
   const handleAddFlow = () => {
-    model.flowRegistry.addFlow(uid(), {
+    draftFlowRegistry.addFlow(uid(), {
       title: t('Event flow'),
       steps: {},
     });
@@ -516,7 +578,7 @@ const DynamicFlowsEditor = observer((props: { model: FlowModel }) => {
   );
 
   // 生成折叠面板项
-  const collapseItems = model.flowRegistry.mapFlows((flow) => {
+  const collapseItems = draftFlowRegistry.mapFlows((flow) => {
     return {
       key: flow.key,
       label: renderPanelHeader(flow),
@@ -529,7 +591,7 @@ const DynamicFlowsEditor = observer((props: { model: FlowModel }) => {
       children: (
         <div>
           {/* 事件部分 */}
-          <EventConfigSection flow={flow} model={model} flowEngine={flowEngine} />
+          <EventConfigSection flow={flow} model={model} flowEngine={flowEngine} flowRegistry={draftFlowRegistry} />
 
           {/* 步骤部分 */}
           <div>
@@ -670,13 +732,13 @@ const DynamicFlowsEditor = observer((props: { model: FlowModel }) => {
           flexShrink: 0,
         }}
       >
-        <Button onClick={() => ctx.view.destroy()}>{t('Cancel')}</Button>
+        <Button onClick={() => ctx.view.close()}>{t('Cancel')}</Button>
         <Button
           type="primary"
           loading={submitLoading}
           onClick={async () => {
             setSubmitLoading(true);
-            const invalid = model.flowRegistry
+            const invalid = draftFlowRegistry
               .mapFlows((flow) => {
                 if (!isFlowOnObject(flow.on)) return;
                 normalizeFlowOnPhase(flow.on);
@@ -695,10 +757,11 @@ const DynamicFlowsEditor = observer((props: { model: FlowModel }) => {
               setSubmitLoading(false);
               return;
             }
-            try {
-              const afterSaves: Array<() => Promise<void>> = [];
+            const previousFlows = serializeFlowRegistry(model.flowRegistry);
+            const afterSaves: Array<() => Promise<void>> = [];
 
-              for (const flow of model.flowRegistry.mapFlows((it) => it)) {
+            try {
+              for (const flow of draftFlowRegistry.mapFlows((it) => it)) {
                 for (const step of flow.mapSteps((it) => it)) {
                   const serialized = step.serialize();
                   const actionDef = step.use ? model.getAction(step.use) : undefined;
@@ -731,8 +794,19 @@ const DynamicFlowsEditor = observer((props: { model: FlowModel }) => {
                 }
               }
 
+              replaceFlowRegistry(model.flowRegistry, serializeFlowRegistry(draftFlowRegistry));
               await model.flowRegistry.save();
+            } catch (error) {
+              replaceFlowRegistry(model.flowRegistry, previousFlows);
+              setSubmitLoading(false);
+              model.context?.message?.error?.('Steps post-save hooks failed to run');
+              console.error(error);
+              return;
+            }
 
+            initialFlowsRef.current = serializeFlowRegistry(model.flowRegistry);
+
+            try {
               for (const runAfterSave of afterSaves) {
                 await runAfterSave();
               }

package/src/flow/components/FieldAssignRulesEditor.tsx

@@ -35,6 +35,7 @@ type CollectionFieldLike = {
   title?: unknown;
   type?: unknown;
   interface?: unknown;
+  uiSchema?: unknown;
   targetKey?: unknown;
   targetCollectionTitleFieldName?: unknown;
   targetCollection?: any;
@@ -194,6 +195,7 @@ export const FieldAssignRulesEditor: React.FC<FieldAssignRulesEditorProps> = (pr
           title,
           type: String(f.type || 'string'),
           interface: fieldInterface,
+          uiSchema: (f as any).uiSchema,
           paths: [...basePaths, name],
         };
 

package/src/flow/components/__tests__/DynamicFlowsIcon.test.tsx

@@ -10,7 +10,7 @@
 import React from 'react';
 import { beforeEach, describe, expect, it, vi } from 'vitest';
 import { render, screen, userEvent, waitFor } from '@nocobase/test/client';
-import { FlowEngine, FlowModel, GLOBAL_EMBED_CONTAINER_ID } from '@nocobase/flow-engine';
+import { ActionScene, FlowEngine, FlowModel, GLOBAL_EMBED_CONTAINER_ID } from '@nocobase/flow-engine';
 import { DynamicFlowsIcon } from '../DynamicFlowsIcon';
 
 const mockState = vi.hoisted(() => ({
@@ -30,15 +30,31 @@ vi.mock('antd', async (importOriginal) => {
   const actual = await importOriginal<typeof import('antd')>();
   return {
     ...actual,
-    Button: ({ children, onClick, ...props }: any) => (
+    Button: ({ children, onClick, icon: _icon, loading: _loading, ...props }: any) => (
       <button type="button" onClick={onClick} {...props}>
         {children}
       </button>
     ),
     Collapse: ({ items }: any) => (
-      <div data-testid="collapse">{items?.map((item: any) => <div key={item.key}>{item.children}</div>)}</div>
+      <div data-testid="collapse">
+        {items?.map((item: any) => (
+          <div key={item.key}>
+            {item.label}
+            {item.children}
+          </div>
+        ))}
+      </div>
+    ),
+    Dropdown: ({ children, menu }: any) => (
+      <div>
+        {children}
+        {menu?.items?.map((item: any) => (
+          <button key={item.key} type="button" onClick={item.onClick}>
+            {item.label}
+          </button>
+        ))}
+      </div>
     ),
-    Dropdown: ({ children }: any) => <div>{children}</div>,
     Empty: ({ description }: any) => <div>{description}</div>,
     Input: (props: any) => <input {...props} />,
     Select: (props: any) => {
@@ -70,10 +86,16 @@ const openDynamicFlowsEditor = async (model: FlowModel) => {
   const embedCall = (model.context.viewer.embed as any).mock.calls.at(-1)?.[0];
   expect(embedCall?.content).toBeTruthy();
 
-  render(embedCall.content);
+  const editor = render(embedCall.content);
+
+  return {
+    embedCall,
+    view: mockState.flowContextValue.view,
+    editor,
+  };
 };
 
-const createModel = (options: { preventClose?: boolean; hiddenClose?: boolean } = {}) => {
+const createModel = (options: { preventClose?: boolean; hiddenClose?: boolean; saveStepParams?: any } = {}) => {
   const engine = new FlowEngine();
   engine.translate = vi.fn((key: string) => key) as any;
   engine.flowSettings.renderStepForm = vi.fn(() => null) as any;
@@ -95,6 +117,14 @@ const createModel = (options: { preventClose?: boolean; hiddenClose?: boolean }
       handler: vi.fn(),
     },
   });
+  LocalTestModel.registerActions({
+    notify: {
+      name: 'notify',
+      title: 'Notify',
+      scene: ActionScene.DYNAMIC_EVENT_FLOW,
+      handler: vi.fn(),
+    },
+  });
 
   const model = new LocalTestModel({
     uid: `test-model-${Math.random().toString(36).slice(2, 8)}`,
@@ -122,17 +152,55 @@ const createModel = (options: { preventClose?: boolean; hiddenClose?: boolean }
       destroy: vi.fn(),
     },
   });
+  model.context.defineProperty('message', {
+    value: {
+      error: vi.fn(),
+      success: vi.fn(),
+    },
+  });
+  vi.spyOn(model, 'saveStepParams').mockImplementation(options.saveStepParams || vi.fn(async () => undefined));
 
   return model;
 };
 
+const createView = () => {
+  let destroyed = false;
+  let closingPromise: Promise<boolean | void> | undefined;
+  const view = {
+    close: vi.fn(function () {
+      if (destroyed) {
+        return Promise.resolve(true);
+      }
+      if (closingPromise) {
+        return closingPromise;
+      }
+      closingPromise = (async () => {
+        const allowed = await view.beforeClose?.({});
+        if (allowed === false) {
+          closingPromise = undefined;
+          return false;
+        }
+        view.destroy();
+        return true;
+      })();
+      return closingPromise;
+    }),
+    destroy: vi.fn(() => {
+      destroyed = true;
+    }),
+    beforeClose: undefined as any,
+  };
+  return view;
+};
+
 describe('DynamicFlowsIcon', () => {
   beforeEach(() => {
     mockState.capturedSelectProps.length = 0;
     mockState.flowContextValue = {
-      view: {
-        destroy: vi.fn(),
+      modal: {
+        confirm: vi.fn(),
       },
+      view: createView(),
     };
     document.body.innerHTML = `<div id="${GLOBAL_EMBED_CONTAINER_ID}"></div>`;
   });
@@ -190,4 +258,123 @@ describe('DynamicFlowsIcon', () => {
       expect(screen.getByTestId('collapse')).toBeInTheDocument();
     });
   });
+
+  it('keeps added event flows in draft until saved', async () => {
+    const model = createModel();
+
+    await openDynamicFlowsEditor(model);
+    await userEvent.click(screen.getByRole('button', { name: 'Add event flow' }));
+
+    expect(model.flowRegistry.getFlows().size).toBe(1);
+    expect(model.flowRegistry.hasFlow('flow1')).toBe(true);
+  });
+
+  it('blocks cancel when draft has unsaved changes and confirmation is rejected', async () => {
+    const model = createModel();
+    mockState.flowContextValue.modal.confirm.mockResolvedValue(false);
+    const { view } = await openDynamicFlowsEditor(model);
+
+    await userEvent.click(screen.getByRole('button', { name: 'Add event flow' }));
+    await userEvent.click(screen.getByRole('button', { name: 'Cancel' }));
+
+    expect(mockState.flowContextValue.modal.confirm).toHaveBeenCalledWith({
+      title: 'Unsaved changes',
+      content: "Are you sure you don't want to save?",
+      okText: 'Confirm',
+      cancelText: 'Cancel',
+    });
+    expect(view.destroy).not.toHaveBeenCalled();
+    expect(model.flowRegistry.getFlows().size).toBe(1);
+  });
+
+  it('runs only one unsaved confirmation while cancel is pending', async () => {
+    const model = createModel();
+    let resolveConfirm: (value: boolean) => void;
+    mockState.flowContextValue.modal.confirm.mockImplementation(
+      () => new Promise<boolean>((resolve) => (resolveConfirm = resolve)),
+    );
+    const { view } = await openDynamicFlowsEditor(model);
+
+    await userEvent.click(screen.getByRole('button', { name: 'Add event flow' }));
+    const cancelButton = screen.getByRole('button', { name: 'Cancel' });
+    await userEvent.click(cancelButton);
+    await userEvent.click(cancelButton);
+
+    expect(mockState.flowContextValue.modal.confirm).toHaveBeenCalledTimes(1);
+
+    resolveConfirm(true);
+    await waitFor(() => expect(view.destroy).toHaveBeenCalledTimes(1));
+  });
+
+  it('discards draft changes after confirmed cancel', async () => {
+    const model = createModel();
+    mockState.flowContextValue.modal.confirm.mockResolvedValue(true);
+    const { view } = await openDynamicFlowsEditor(model);
+
+    await userEvent.click(screen.getByRole('button', { name: 'Add event flow' }));
+    await userEvent.click(screen.getByRole('button', { name: 'Cancel' }));
+
+    expect(view.destroy).toHaveBeenCalledTimes(1);
+    expect(model.flowRegistry.getFlows().size).toBe(1);
+    expect(model.flowRegistry.hasFlow('flow1')).toBe(true);
+  });
+
+  it('discards existing event flow edits after confirmed cancel', async () => {
+    const model = createModel();
+    mockState.flowContextValue.modal.confirm.mockResolvedValue(true);
+    const { view } = await openDynamicFlowsEditor(model);
+
+    const titleInput = screen.getByPlaceholderText('Enter flow title');
+    await userEvent.clear(titleInput);
+    await userEvent.type(titleInput, 'Changed flow');
+    await userEvent.click(screen.getByRole('button', { name: 'Cancel' }));
+
+    expect(view.destroy).toHaveBeenCalledTimes(1);
+    expect(model.flowRegistry.getFlow('flow1')?.title).toBe('Event flow');
+  });
+
+  it('discards added draft steps after confirmed cancel', async () => {
+    const model = createModel();
+    mockState.flowContextValue.modal.confirm.mockResolvedValue(true);
+    const { view } = await openDynamicFlowsEditor(model);
+
+    expect(model.flowRegistry.getFlow('flow1')?.getSteps().size).toBe(0);
+
+    await userEvent.click(screen.getByRole('button', { name: 'Notify' }));
+    await userEvent.click(screen.getByRole('button', { name: 'Cancel' }));
+
+    expect(view.destroy).toHaveBeenCalledTimes(1);
+    expect(model.flowRegistry.getFlow('flow1')?.getSteps().size).toBe(0);
+  });
+
+  it('does not keep discarded draft changes after reopening the editor', async () => {
+    const model = createModel();
+    mockState.flowContextValue.modal.confirm.mockResolvedValue(true);
+
+    const firstEditor = await openDynamicFlowsEditor(model);
+    await userEvent.click(screen.getByRole('button', { name: 'Add event flow' }));
+    await userEvent.click(screen.getByRole('button', { name: 'Cancel' }));
+    firstEditor.editor.unmount();
+
+    mockState.capturedSelectProps.length = 0;
+    mockState.flowContextValue.view = createView();
+    const secondEditor = await openDynamicFlowsEditor(model);
+
+    expect(secondEditor.editor.container.querySelectorAll('input[placeholder="Enter flow title"]')).toHaveLength(1);
+    expect(model.flowRegistry.getFlows().size).toBe(1);
+  });
+
+  it('saves draft event flows into the real registry', async () => {
+    const saveStepParams = vi.fn(async () => undefined);
+    const model = createModel({ saveStepParams });
+    const { view } = await openDynamicFlowsEditor(model);
+
+    await userEvent.click(screen.getByRole('button', { name: 'Add event flow' }));
+    await userEvent.click(screen.getByRole('button', { name: 'Save' }));
+
+    expect(saveStepParams).toHaveBeenCalledTimes(1);
+    expect(model.flowRegistry.getFlows().size).toBe(2);
+    expect(view.destroy).toHaveBeenCalledTimes(1);
+    expect(model.context.message.success).toHaveBeenCalledWith('Configuration saved');
+  });
 });