@nocobase/client-v2 2.1.0-alpha.31 → 2.1.0-alpha.33

package/src/flow/actions/linkageRulesFormValueRefresh.ts

@@ -15,11 +15,7 @@ import {
   isRunJSValue,
 } from '@nocobase/flow-engine';
 import _ from 'lodash';
-import {
-  namePathToPathKey,
-  parsePathString,
-  pathKeyToNamePath,
-} from '../models/blocks/form/value-runtime/path';
+import { namePathToPathKey, parsePathString, pathKeyToNamePath } from '../models/blocks/form/value-runtime/path';
 import {
   collectStaticDepsFromRunJSValue,
   collectStaticDepsFromTemplateValue,
@@ -243,9 +239,7 @@ function collectLinkageRefreshDeps(ctx: FlowContext, params: any): LinkageRefres
 
     if (depKey === 'ctx:item' || depKey.startsWith('ctx:item:')) {
       const subPath = depKey === 'ctx:item' ? '' : depKey.slice('ctx:item:'.length);
-      const depPath = subPath
-        ? (parsePathString(subPath).filter((seg) => typeof seg !== 'object') as NamePath)
-        : [];
+      const depPath = subPath ? (parsePathString(subPath).filter((seg) => typeof seg !== 'object') as NamePath) : [];
       const resolved = resolveItemDependencyPath(ctx, depPath);
       wildcard ||= resolved.wildcard;
       valuePaths.push(...resolved.valuePaths);

package/src/flow/actions/openView.tsx

@@ -345,7 +345,8 @@ export const openView = defineAction({
         target: ctx.inputArgs.target || ctx.layoutContentElement,
         dataSourceKey: runtimeDataSourceKey ?? actionDefaults.dataSourceKey,
         collectionName: runtimeCollectionName ?? actionDefaults.collectionName,
-        associationName: runtimeAssociationName ?? actionDefaults.associationName,
+        associationName:
+          typeof runtimeAssociationName !== 'undefined' ? runtimeAssociationName : actionDefaults.associationName,
         filterByTk: mergedFilterByTk,
         sourceId: mergedSourceId,
         tabUid: mergedTabUid,

package/src/flow/actions/pattern.tsx

@@ -7,9 +7,25 @@
  * For more information, please refer to: https://www.nocobase.com/agreement.
  */
 
-import { BindingOptions, defineAction, tExpr, DisplayItemModel } from '@nocobase/flow-engine';
+import { defineAction, tExpr } from '@nocobase/flow-engine';
 import { DetailsItemModel } from '../models/blocks/details/DetailsItemModel';
-import { rebuildFieldSubModel } from '../internal/utils/rebuildFieldSubModel';
+import { getFieldBindingUse, rebuildFieldSubModel } from '../internal/utils/rebuildFieldSubModel';
+
+type PatternAwareFieldModelMeta = {
+  preserveOnPatternChange?: boolean;
+};
+
+type PatternAwareFieldModel = {
+  scheduleApplyJsSettings?: () => void;
+};
+
+function shouldPreserveFieldModelOnPatternChange(ctx: any) {
+  const fieldModel = ctx.model.subModels.field;
+  const fieldUse = getFieldBindingUse(fieldModel) ?? fieldModel?.use;
+  const ModelClass = typeof fieldUse === 'string' ? ctx.engine.getModelClass(fieldUse) : fieldUse;
+
+  return ((ModelClass?.meta as PatternAwareFieldModelMeta | undefined)?.preserveOnPatternChange ?? false) === true;
+}
 
 export const pattern = defineAction({
   name: 'pattern',
@@ -56,6 +72,13 @@ export const pattern = defineAction({
     };
   },
   afterParamsSave: async (ctx: any, params, previousParams) => {
+    if (shouldPreserveFieldModelOnPatternChange(ctx)) {
+      if (params.pattern !== previousParams.pattern) {
+        (ctx.model.subModels.field as PatternAwareFieldModel | undefined)?.scheduleApplyJsSettings?.();
+      }
+      return;
+    }
+
     const targetCollection = ctx.collectionField.targetCollection;
     const targetCollectionTitleField = targetCollection?.getField(
       ctx.model.subModels.field.props?.fieldNames?.label || ctx.model.props.titleField,

package/src/flow/admin-shell/AdminLayoutRouteCoordinator.ts

@@ -47,6 +47,8 @@ interface RouteLike {
   pathname?: string;
 }
 
+const hasUsableSourceId = (sourceId: unknown) => sourceId !== undefined && sourceId !== null && String(sourceId) !== '';
+
 /**
  * 管理 admin 场景下每个 page 的 v2 视图栈编排。
  * 该协调器只负责状态机和开关视图，不直接绑定 React 生命周期。
@@ -264,6 +266,10 @@ export class AdminLayoutRouteCoordinator {
     const destroyRef = React.createRef<(result?: any, force?: boolean) => void>();
     const updateRef = React.createRef<(value: any) => void>();
     const openViewParams = getOpenViewStepParams(viewItem.model);
+    const associationName =
+      openViewParams?.associationName && !hasUsableSourceId(viewItem.params.sourceId)
+        ? null
+        : openViewParams?.associationName;
     const openerUids = viewList.slice(0, viewItem.index).map((item) => item.params.viewUid);
     const navigation = new ViewNavigation(
       this.flowEngine.context,
@@ -273,7 +279,7 @@ export class AdminLayoutRouteCoordinator {
     viewItem.model.dispatchEvent('click', {
       target: runtime.meta.layoutContentElement || this.layoutContentElement,
       collectionName: openViewParams?.collectionName,
-      associationName: openViewParams?.associationName,
+      associationName,
       dataSourceKey: openViewParams?.dataSourceKey,
       destroyRef,
       updateRef,

package/src/flow/admin-shell/__tests__/AdminLayoutRouteCoordinator.test.ts

@@ -0,0 +1,117 @@
+/**
+ * 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 { FlowEngine } from '@nocobase/flow-engine';
+import { describe, expect, it, vi, beforeEach } from 'vitest';
+import { getViewDiffAndUpdateHidden } from '../../getViewDiffAndUpdateHidden';
+import { getOpenViewStepParams } from '../../flows/openViewFlow';
+import { resolveViewParamsToViewList } from '../../resolveViewParamsToViewList';
+import { AdminLayoutRouteCoordinator } from '../AdminLayoutRouteCoordinator';
+import { RouteModel } from '../../models/base/RouteModel';
+
+vi.mock('../../resolveViewParamsToViewList', () => ({
+  resolveViewParamsToViewList: vi.fn(),
+  updateViewListHidden: vi.fn(),
+}));
+
+vi.mock('../../getViewDiffAndUpdateHidden', () => ({
+  getViewDiffAndUpdateHidden: vi.fn(),
+  getKey: vi.fn((viewItem) => viewItem.params.viewUid),
+}));
+
+vi.mock('../../flows/openViewFlow', async (importOriginal) => {
+  const actual = await importOriginal();
+  return {
+    ...(actual as any),
+    getOpenViewStepParams: vi.fn(),
+  };
+});
+
+const mockResolveViewParamsToViewList = vi.mocked(resolveViewParamsToViewList);
+const mockGetViewDiffAndUpdateHidden = vi.mocked(getViewDiffAndUpdateHidden);
+const mockGetOpenViewStepParams = vi.mocked(getOpenViewStepParams);
+
+function setupRouteReplay(viewParams: Record<string, any>) {
+  const engine = new FlowEngine();
+  engine.registerModels({ RouteModel });
+  engine.context.defineProperty('route', {
+    value: {
+      params: { name: 'test-route' },
+      pathname: '/admin/popup/filterbytk/member',
+    },
+  });
+  engine.context.defineProperty('routeRepository', {
+    value: {
+      getRouteBySchemaUid: vi.fn(() => ({})),
+    },
+  });
+
+  const dispatchEvent = vi.fn(() => Promise.resolve());
+  const viewItem = {
+    params: {
+      viewUid: 'popup',
+      filterByTk: 'member',
+      ...viewParams,
+    },
+    modelUid: 'popup',
+    model: { uid: 'popup', dispatchEvent } as any,
+    hidden: { value: false },
+    index: 0,
+  };
+
+  mockResolveViewParamsToViewList.mockReturnValue([viewItem]);
+  mockGetViewDiffAndUpdateHidden.mockReturnValue({
+    viewsToClose: [],
+    viewsToOpen: [viewItem],
+  });
+  mockGetOpenViewStepParams.mockReturnValue({
+    collectionName: 'roles',
+    associationName: 'users.roles',
+    dataSourceKey: 'main',
+  } as any);
+
+  const coordinator = new AdminLayoutRouteCoordinator(engine);
+  coordinator.registerPage('test-route', {
+    active: true,
+    layoutContentElement: document.createElement('div'),
+  });
+
+  return { dispatchEvent };
+}
+
+describe('AdminLayoutRouteCoordinator', () => {
+  beforeEach(() => {
+    vi.clearAllMocks();
+  });
+
+  it('drops configured associationName during route replay when sourceId is absent', () => {
+    const { dispatchEvent } = setupRouteReplay({});
+
+    expect(dispatchEvent.mock.calls[0][1]).toMatchObject({
+      collectionName: 'roles',
+      associationName: null,
+      dataSourceKey: 'main',
+      filterByTk: 'member',
+      triggerByRouter: true,
+    });
+  });
+
+  it('keeps configured associationName during route replay when sourceId is present', () => {
+    const { dispatchEvent } = setupRouteReplay({ sourceId: '1' });
+
+    expect(dispatchEvent.mock.calls[0][1]).toMatchObject({
+      collectionName: 'roles',
+      associationName: 'users.roles',
+      dataSourceKey: 'main',
+      filterByTk: 'member',
+      sourceId: '1',
+      triggerByRouter: true,
+    });
+  });
+});

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

@@ -116,6 +116,11 @@ const resetStyle = css`
   .ant-pro-base-menu-vertical-collapsed .ant-pro-base-menu-vertical-menu-item {
     height: auto;
   }
+
+  .ant-menu-item:has([data-nb-hidden-menu-item='true']),
+  .ant-menu-submenu:has([data-nb-hidden-menu-item='true']) {
+    display: none !important;
+  }
 `;
 
 const contentStyle = {
@@ -373,6 +378,7 @@ export const AdminLayoutComponent = observer((props: any) => {
   const { token } = antdTheme.useToken();
   const customToken = token as CustomToken;
   const isMobileLayout = !!adminLayoutModel?.isMobileLayout;
+  const menuRouteRefreshVersion = adminLayoutModel?.menuRouteRefreshVersion || 0;
   const isMobileSider = isMobileLayout || isMobileViewport;
   const [collapsed, setCollapsed] = useState(isMobileSider);
   const [preferredFlowSettingsEnabled, setPreferredFlowSettingsEnabled] = useState(() => readFlowSettingsPreference());
@@ -505,7 +511,7 @@ export const AdminLayoutComponent = observer((props: any) => {
       children: [],
     };
     setRoute(nextRoute);
-  }, [adminLayoutModel, allAccessRoutes, designable, isMobileSider, t]);
+  }, [adminLayoutModel, allAccessRoutes, designable, isMobileSider, menuRouteRefreshVersion, t]);
 
   useEffect(() => {
     const syncId = ++flowSettingsSyncRef.current;
@@ -627,6 +633,7 @@ export const AdminLayoutComponent = observer((props: any) => {
         <MobileMenuControlContext.Provider value={{ closeMobileMenu }}>
           <DndProvider collisionDetection={menuCollisionDetection} onDragEnd={handleMenuDragEnd}>
             <ProLayout
+              key={`admin-layout-menu-${menuRouteRefreshVersion}`}
               {...props}
               contentStyle={contentStyle}
               siderWidth={customToken.siderWidth || 200}

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

@@ -28,7 +28,6 @@ import {
   reconcileAdminLayoutMenuItems,
   shouldRenderIconInTitle,
 } from './AdminLayoutMenuUtils';
-import { findFirstPageRoute } from './AdminLayoutCompat';
 import {
   buildMenuBasicSchema,
   buildLinkSettingSchema,
@@ -41,7 +40,14 @@ import {
   matchesRoutePath,
   toTreeSelectItems,
 } from './AdminLayoutMenuFlowUtils';
-import { resolveAdminRouteRuntimeTarget, toRouterNavigationPath } from './resolveAdminRouteRuntimeTarget';
+import { ADMIN_LAYOUT_MODEL_UID } from './constants';
+import {
+  findFirstAccessiblePageRoute,
+  findFirstV2LandingRoute,
+  isV2AdminRuntime,
+  resolveAdminRouteRuntimeTarget,
+  toRouterNavigationPath,
+} from './resolveAdminRouteRuntimeTarget';
 
 export * from './AdminLayoutMenuUtils';
 const insertPositionToMethod = {
@@ -122,6 +128,15 @@ export class AdminLayoutMenuItemModel extends FlowModel<AdminLayoutMenuItemStruc
     return this.flowRegistry.getFlows().size;
   }
 
+  hasPersistableMenuLinkageRules() {
+    const params = this.getStepParams('menuSettings', 'linkageRules') as { value?: any[] } | undefined;
+    return Array.isArray(params?.value) && params.value.length > 0;
+  }
+
+  hasCurrentPersistedMenuState() {
+    return this.getCurrentPersistedInstanceFlowCount() > 0 || this.hasPersistableMenuLinkageRules();
+  }
+
   buildRouteOptionsWithPersistedFlowFlag(hasPersistedMenuInstanceFlow: boolean) {
     const route = this.getRoute();
     const nextOptions = {
@@ -147,7 +162,7 @@ export class AdminLayoutMenuItemModel extends FlowModel<AdminLayoutMenuItemStruc
       return;
     }
 
-    const hasPersistedMenuInstanceFlow = this.getCurrentPersistedInstanceFlowCount() > 0;
+    const hasPersistedMenuInstanceFlow = this.hasCurrentPersistedMenuState();
     if (this.hasPersistedMenuInstanceFlowFlag(route) === hasPersistedMenuInstanceFlow) {
       return;
     }
@@ -188,6 +203,7 @@ export class AdminLayoutMenuItemModel extends FlowModel<AdminLayoutMenuItemStruc
       if (this.isCreationSession()) {
         return;
       }
+      let shouldRerenderAfterHydrate = false;
 
       const repository = this.flowEngine.modelRepository;
       if (!repository?.findOne) {
@@ -201,6 +217,7 @@ export class AdminLayoutMenuItemModel extends FlowModel<AdminLayoutMenuItemStruc
 
       if (data.stepParams && typeof data.stepParams === 'object') {
         this.setStepParams(data.stepParams);
+        shouldRerenderAfterHydrate = this.hasPersistableMenuLinkageRules();
       }
 
       if (data.flowRegistry && typeof data.flowRegistry === 'object') {
@@ -219,9 +236,11 @@ export class AdminLayoutMenuItemModel extends FlowModel<AdminLayoutMenuItemStruc
           return typeof flow.on === 'string' ? flow.on === 'beforeRender' : flow.on?.eventName === 'beforeRender';
         });
 
-        if (hasBeforeRenderFlow) {
-          void this.rerender();
-        }
+        shouldRerenderAfterHydrate = shouldRerenderAfterHydrate || hasBeforeRenderFlow;
+      }
+
+      if (shouldRerenderAfterHydrate) {
+        void this.rerender();
       }
     })().finally(() => {
       this.persistedStateHydrated = true;
@@ -242,6 +261,27 @@ export class AdminLayoutMenuItemModel extends FlowModel<AdminLayoutMenuItemStruc
     return currentFlowCount > 0 || initialFlowCount > 0;
   }
 
+  setHidden(value: boolean) {
+    const previous = this.hidden;
+    super.setHidden(value);
+    if (previous !== this.hidden) {
+      (this.flowEngine.getModel?.(ADMIN_LAYOUT_MODEL_UID) as any)?.refreshMenuRouteTree?.();
+    }
+  }
+
+  protected renderHiddenInConfig(): React.ReactNode | undefined {
+    const { item, dom, options, renderType } = this.props;
+    if (!item || !renderType) {
+      return null;
+    }
+
+    return (
+      <div style={{ opacity: 0.3 }}>
+        <AdminLayoutMenuItemRenderer item={item} dom={dom} options={options} renderType={renderType} />
+      </div>
+    );
+  }
+
   async createMenuRoute(
     route: NocoBaseDesktopRoute,
     options?: {
@@ -436,11 +476,11 @@ export class AdminLayoutMenuItemModel extends FlowModel<AdminLayoutMenuItemStruc
       return true;
     }
 
-    const currentPersistedInstanceFlowCount = this.getCurrentPersistedInstanceFlowCount();
+    const hasCurrentPersistedMenuState = this.hasCurrentPersistedMenuState();
 
     // 菜单基础设置继续直接保存到 route repository；
     // 只有实例事件流需要回退到 FlowModel 默认持久化链路。
-    if (currentPersistedInstanceFlowCount > 0) {
+    if (hasCurrentPersistedMenuState) {
       await super.saveStepParams();
     } else if (this.hasPersistedMenuInstanceFlowFlag()) {
       await this.destroyPersistedState();
@@ -523,6 +563,10 @@ export class AdminLayoutMenuItemModel extends FlowModel<AdminLayoutMenuItemStruc
       return null;
     }
 
+    if (!options.designable && this.hidden) {
+      return null;
+    }
+
     const shouldShowIconInTitle = shouldRenderIconInTitle({ depth, isMobile: options.isMobile });
     const { name, icon } = buildMenuTitleWithIcon(route, options.t, shouldShowIconInTitle);
 
@@ -546,6 +590,11 @@ export class AdminLayoutMenuItemModel extends FlowModel<AdminLayoutMenuItemStruc
         app: this.context.app,
         route,
       });
+
+      if (runtimeTarget.reason === 'unsupportedV2Runtime') {
+        return null;
+      }
+
       const path = route.schemaUid
         ? `/admin/${route.schemaUid}`
         : getAdminLayoutMenuVirtualPath('link', `${this.uid}-invalid`);
@@ -579,13 +628,20 @@ 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));
       }
 
+      const landingRoute = isV2AdminRuntime(this.context.app)
+        ? findFirstV2LandingRoute(itemChildren)
+        : findFirstAccessiblePageRoute(itemChildren);
       const runtimeTarget = resolveAdminRouteRuntimeTarget({
         app: this.context.app,
-        route,
+        route: isV2AdminRuntime(this.context.app) && landingRoute ? landingRoute : route,
       });
 
       const groupRoute: AdminLayoutMenuNode = {
@@ -593,9 +649,7 @@ export class AdminLayoutMenuItemModel extends FlowModel<AdminLayoutMenuItemStruc
         icon,
         path: `/admin/${route.id}`,
         redirect:
-          children[0]?.key === 'x-designer-button'
-            ? undefined
-            : `/admin/${findFirstPageRoute(itemChildren)?.schemaUid || route.id}`,
+          children[0]?.key === 'x-designer-button' ? undefined : `/admin/${landingRoute?.schemaUid || route.id}`,
         hideInMenu: route.hideInMenu,
         _runtimePath: runtimeTarget.runtimePath,
         _navigationMode: runtimeTarget.navigationMode,
@@ -707,6 +761,10 @@ AdminLayoutMenuItemModel.registerFlow({
         });
       },
     },
+    linkageRules: {
+      use: 'menuLinkageRules',
+      hideInSettings: async (ctx: FlowSettingsContext<AdminLayoutMenuItemModel>) => ctx.model.isCreationSession(),
+    },
     moveTo: {
       title: 'Move to',
       defaultParams: async () => ({

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

@@ -15,9 +15,9 @@ import {
   FlowModel,
   FlowModelRenderer,
   FlowSettingsButton,
+  observer,
 } from '@nocobase/flow-engine';
-import { App, Badge, Tooltip } from 'antd';
-import type { HookAPI } from 'antd/es/modal/useModal';
+import { Badge, Tooltip } from 'antd';
 import qs from 'qs';
 import React, { FC, useCallback, useContext, useEffect } from 'react';
 import { Link, useLocation, type NavigateFunction } from 'react-router-dom';
@@ -284,33 +284,6 @@ const translateByModel = (model: FlowModel, value: any) => {
   return typeof model.context.t === 'function' ? model.context.t(value) : value;
 };
 
-const translateMenuNode = (item: AdminLayoutMenuNode, value: any) => {
-  return item._model ? translateByModel(item._model, value) : value;
-};
-
-/**
- * 经典页面需要整页跳回 v1，先给用户一个明确确认，避免误离开当前 v2 上下文。
- */
-const confirmLegacyPageNavigation = async (options: { item: AdminLayoutMenuNode; confirm?: HookAPI['confirm'] }) => {
-  const { item, confirm } = options;
-
-  if (!item._isLegacy || typeof confirm !== 'function') {
-    return true;
-  }
-
-  const confirmed = await confirm({
-    title: translateMenuNode(item, 'Open classic page access'),
-    content: translateMenuNode(
-      item,
-      'This page requires the classic version to open properly. Do you want to go there now?',
-    ),
-    okText: translateMenuNode(item, 'Yes'),
-    cancelText: translateMenuNode(item, 'Cancel'),
-  });
-
-  return !!confirmed;
-};
-
 const MENU_TYPE_ITEMS: Array<{ key: string; label: string; menuType: AdminLayoutMenuCreationType }> = [
   { key: 'group', label: 'Group', menuType: 'group' },
   { key: 'flow-page', label: 'Page', menuType: 'flowPage' },
@@ -520,7 +493,6 @@ export function resolveAdminLayoutMenuDragMoveOptionsFromEvent(
 const GroupItem: FC<{ item: AdminLayoutMenuNode; options?: AdminLayoutMenuRenderOptions }> = (props) => {
   const { item } = props;
   const badgeCount = useEvaluatedExpression(item._route.options?.badge?.count, item._model?.context);
-  const { modal } = App.useApp();
   const navigate = useNavigateNoUpdate();
   const routerBasename = useRouterBasename();
   const { closeMobileMenu } = useContext(MobileMenuControlContext);
@@ -556,23 +528,13 @@ const GroupItem: FC<{ item: AdminLayoutMenuNode; options?: AdminLayoutMenuRender
 
         event.preventDefault();
         event.stopPropagation();
-        void (async () => {
-          const confirmed = await confirmLegacyPageNavigation({
-            item,
-            confirm: item._model?.context?.modal?.confirm || modal?.confirm,
-          });
-          if (!confirmed) {
-            return;
-          }
-
-          runAfterMobileMenuClosed({
-            isMobile: !!props.options?.isMobile,
-            closeMobileMenu,
-            callback: () => {
-              window.location.assign(runtimePath);
-            },
-          });
-        })();
+        runAfterMobileMenuClosed({
+          isMobile: !!props.options?.isMobile,
+          closeMobileMenu,
+          callback: () => {
+            window.location.assign(runtimePath);
+          },
+        });
         return;
       }
 
@@ -589,16 +551,7 @@ const GroupItem: FC<{ item: AdminLayoutMenuNode; options?: AdminLayoutMenuRender
         },
       });
     },
-    [
-      closeMobileMenu,
-      item,
-      item._navigationMode,
-      modal,
-      navigate,
-      props.options?.isMobile,
-      runtimePath,
-      spaRuntimePath,
-    ],
+    [closeMobileMenu, item, item._navigationMode, navigate, props.options?.isMobile, runtimePath, spaRuntimePath],
   );
 
   const landingEntryAriaLabel = ariaLabel ? `${ariaLabel}-landing-entry` : 'group-landing-entry';
@@ -656,7 +609,6 @@ const MenuItem: FC<{ item: AdminLayoutMenuNode; options?: AdminLayoutMenuRenderO
   const { item } = props;
   const location = useLocation();
   const badgeCount = useEvaluatedExpression(item._route.options?.badge?.count, item._model?.context);
-  const { modal } = App.useApp();
   const navigate = useNavigateNoUpdate();
   const basenameOfCurrentRouter = useRouterBasename();
   const { closeMobileMenu } = useContext(MobileMenuControlContext);
@@ -717,23 +669,13 @@ const MenuItem: FC<{ item: AdminLayoutMenuNode; options?: AdminLayoutMenuRenderO
 
         event.preventDefault();
         event.stopPropagation();
-        void (async () => {
-          const confirmed = await confirmLegacyPageNavigation({
-            item,
-            confirm: item._model?.context?.modal?.confirm || modal?.confirm,
-          });
-          if (!confirmed) {
-            return;
-          }
-
-          runAfterMobileMenuClosed({
-            isMobile: !!props.options?.isMobile,
-            closeMobileMenu,
-            callback: () => {
-              window.location.assign(runtimePath);
-            },
-          });
-        })();
+        runAfterMobileMenuClosed({
+          isMobile: !!props.options?.isMobile,
+          closeMobileMenu,
+          callback: () => {
+            window.location.assign(runtimePath);
+          },
+        });
         return;
       }
 
@@ -757,16 +699,7 @@ const MenuItem: FC<{ item: AdminLayoutMenuNode; options?: AdminLayoutMenuRenderO
         },
       });
     },
-    [
-      props.options?.isMobile,
-      closeMobileMenu,
-      isDocumentNavigation,
-      item,
-      modal,
-      navigate,
-      runtimePath,
-      spaRuntimePath,
-    ],
+    [props.options?.isMobile, closeMobileMenu, isDocumentNavigation, item, navigate, runtimePath, spaRuntimePath],
   );
 
   if (item._route?.type === NocoBaseDesktopRouteType.link) {
@@ -889,13 +822,15 @@ export const shouldRenderIconInTitle = ({ depth, isMobile }: { depth: number; is
   return depth > 1 || (isMobile && depth > 0);
 };
 
+const HiddenMenuItemPlaceholder = () => <span data-nb-hidden-menu-item="true" />;
+
 export const AdminLayoutMenuModelRenderer: FC<{
   model: FlowModel;
   item: AdminLayoutMenuNode;
   dom: React.ReactNode;
   renderType: AdminLayoutMenuRenderType;
   options?: AdminLayoutMenuRenderOptions;
-}> = ({ model, item, dom, renderType, options }) => {
+}> = observer(({ model, item, dom, renderType, options }) => {
   const token = model.context.themeToken;
 
   useEffect(() => {
@@ -907,6 +842,10 @@ export const AdminLayoutMenuModelRenderer: FC<{
     });
   }, [dom, item, model, options, renderType]);
 
+  if (!model.context.flowSettingsEnabled && model.hidden) {
+    return <HiddenMenuItemPlaceholder />;
+  }
+
   return (
     <ResetThemeTokenAndKeepAlgorithm>
       <Droppable model={model}>
@@ -931,7 +870,7 @@ export const AdminLayoutMenuModelRenderer: FC<{
       </Droppable>
     </ResetThemeTokenAndKeepAlgorithm>
   );
-};
+});
 
 export function getAdminLayoutMenuInitializerButton(
   testId: string,

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

@@ -50,6 +50,7 @@ type GetAdminLayoutModelOptions<TModel extends FlowModel = AdminLayoutModel> = {
  */
 export class AdminLayoutModel extends FlowModel<AdminLayoutStructure> {
   isMobileLayout = false;
+  menuRouteRefreshVersion = 0;
   private routeCoordinator?: AdminLayoutRouteCoordinator;
   private routeDisposer?: () => void;
   private activePageUid = '';
@@ -60,9 +61,19 @@ export class AdminLayoutModel extends FlowModel<AdminLayoutStructure> {
     super(options);
     define(this, {
       isMobileLayout: observable.ref,
+      menuRouteRefreshVersion: observable.ref,
     });
   }
 
+  /**
+   * 通知 Layout 重新生成 ProLayout 菜单路由。
+   *
+   * @returns {void}
+   */
+  refreshMenuRouteTree() {
+    this.menuRouteRefreshVersion += 1;
+  }
+
   /**
    * 注册页面运行时信息。
    *