@nocobase/client-v2 2.1.0-alpha.40 → 2.1.0-alpha.46

package/src/flow/components/AdminLayout.tsx

@@ -7,161 +7,11 @@
  * For more information, please refer to: https://www.nocobase.com/agreement.
  */
 
-import { useFlowEngine, FlowModelRenderer } from '@nocobase/flow-engine';
-import React, { type FC, useEffect, useMemo, useRef, useState } from 'react';
-import { getAdminLayoutModel, AdminLayoutModel } from '..';
-import { useApp } from '../../hooks/useApp';
-import { useLocation, useNavigate, useParams } from 'react-router-dom';
-import { NocoBaseDesktopRouteType } from '../../flow-compat';
-import {
-  findFirstV2LandingRoute,
-  resolveAdminRouteRuntimeTarget,
-  toRouterNavigationPath,
-} from '../admin-shell/admin-layout/resolveAdminRouteRuntimeTarget';
+import React, { type FC } from 'react';
+import { LayoutRoute } from '../../layout-manager/LayoutRoute';
 
-const AdminLayoutEntryGuard: FC<{ children: React.ReactNode }> = ({ children }) => {
-  const flowEngine = useFlowEngine();
-  const app = useApp();
-  const navigate = useNavigate();
-  const location = useLocation();
-  const params = useParams();
-  const [ready, setReady] = useState(false);
-  const replaceTriggeredRef = useRef(false);
-  const routeRepository = flowEngine.context.routeRepository;
-  const isAdminRoot = useMemo(() => {
-    const pathname = toRouterNavigationPath(location.pathname, app.router.getBasename());
-    return pathname === '/admin';
-  }, [app, location.pathname]);
-
-  useEffect(() => {
-    replaceTriggeredRef.current = false;
-  }, [location.pathname, location.search, location.hash, params.name]);
-
-  useEffect(() => {
-    let active = true;
-
-    const run = async () => {
-      setReady(false);
-
-      if (!isAdminRoot && !params.name) {
-        if (active) {
-          setReady(true);
-        }
-        return;
-      }
-
-      if (!routeRepository?.isAccessibleLoaded?.()) {
-        try {
-          await routeRepository?.ensureAccessibleLoaded?.();
-        } catch (_error) {
-          if (active) {
-            setReady(true);
-          }
-          return;
-        }
-      }
-
-      if (!active || replaceTriggeredRef.current) {
-        return;
-      }
-
-      if (params.name) {
-        const currentRoute = routeRepository?.getRouteBySchemaUid?.(params.name);
-        if (currentRoute?.type === NocoBaseDesktopRouteType.page) {
-          const target = resolveAdminRouteRuntimeTarget({
-            app,
-            route: currentRoute,
-            location: {
-              pathname: window.location.pathname,
-              search: window.location.search,
-              hash: window.location.hash,
-            },
-            preserveLocationState: true,
-          });
-
-          if (target.navigationMode === 'document' && target.runtimePath) {
-            replaceTriggeredRef.current = true;
-            window.location.replace(target.runtimePath);
-            return;
-          }
-        }
-
-        if (active) {
-          setReady(true);
-        }
-        return;
-      }
-
-      const firstAccessibleRoute = findFirstV2LandingRoute(routeRepository?.listAccessible?.() || []);
-      if (!firstAccessibleRoute) {
-        if (active) {
-          setReady(true);
-        }
-        return;
-      }
-
-      const target = resolveAdminRouteRuntimeTarget({
-        app,
-        route: firstAccessibleRoute,
-      });
-
-      if (!target.runtimePath) {
-        if (active) {
-          setReady(true);
-        }
-        return;
-      }
-
-      replaceTriggeredRef.current = true;
-      if (target.navigationMode === 'document') {
-        window.location.replace(target.runtimePath);
-        return;
-      }
-
-      navigate(toRouterNavigationPath(target.runtimePath, app.router.getBasename()), { replace: true });
-    };
-
-    void run();
-
-    return () => {
-      active = false;
-    };
-  }, [
-    app,
-    flowEngine,
-    isAdminRoot,
-    location.hash,
-    location.pathname,
-    location.search,
-    navigate,
-    params.name,
-    routeRepository,
-  ]);
-
-  if (!ready) {
-    return null;
-  }
-
-  return <>{children}</>;
-};
-
-const AdminLayout: FC = (props) => {
-  const flowEngine = useFlowEngine();
-  const model = getAdminLayoutModel(flowEngine, {
-    create: true,
-    props,
-    use: AdminLayoutModel,
-  });
-
-  if (!model) {
-    throw new Error('[NocoBase] Failed to create admin-layout-model.');
-  }
-
-  return (
-    <AdminLayoutEntryGuard>
-      <FlowModelRenderer model={model} />
-    </AdminLayoutEntryGuard>
-  );
+const AdminLayout: FC = () => {
+  return <LayoutRoute layoutRouteName="admin" />;
 };
 
 export default AdminLayout;

package/src/flow/components/ConditionBuilder.tsx

@@ -13,14 +13,24 @@ import { FilterGroup, LinkageFilterItem } from './filter';
 import { evaluateConditions, FilterGroupType, removeInvalidFilterItems } from '@nocobase/utils/client';
 
 export const ConditionBuilder = observer(
-  (props: { value: FilterGroupType; onChange: (value: FilterGroupType) => void; extraMetaTree?: MetaTreeNode[] }) => {
+  (props: {
+    value: FilterGroupType;
+    onChange: (value: FilterGroupType) => void;
+    extraMetaTree?: MetaTreeNode[];
+    maxAssociationFieldDepth?: number;
+  }) => {
     const ctx = useFlowContext();
 
     return (
       <FilterGroup
         value={props.value || { logic: '$and', items: [] }}
         FilterItem={(itemProps) => (
-          <LinkageFilterItem model={ctx.model} value={itemProps.value} extraMetaTree={props.extraMetaTree} />
+          <LinkageFilterItem
+            model={ctx.model}
+            value={itemProps.value}
+            extraMetaTree={props.extraMetaTree}
+            maxAssociationFieldDepth={props.maxAssociationFieldDepth}
+          />
         )}
         onChange={props.onChange}
       />

package/src/flow/components/FieldAssignRulesEditor.tsx

@@ -24,7 +24,7 @@ import type { CascaderProps, CollapseProps } from 'antd';
 import React from 'react';
 import { ConditionBuilder } from './ConditionBuilder';
 import { FieldAssignValueInput } from './FieldAssignValueInput';
-import type { FieldAssignCascaderOption } from './fieldAssignOptions';
+import { buildFieldAssignCascaderOptionsFromCollection, type FieldAssignCascaderOption } from './fieldAssignOptions';
 import { isRunJSValue, isVariableExpression, type MetaTreeNode } from '@nocobase/flow-engine';
 import { isToManyAssociationField } from '../internal/utils/modelUtils';
 
@@ -36,6 +36,7 @@ type CollectionFieldLike = {
   type?: unknown;
   interface?: unknown;
   uiSchema?: unknown;
+  target?: unknown;
   targetKey?: unknown;
   targetCollectionTitleFieldName?: unknown;
   targetCollection?: any;
@@ -105,6 +106,7 @@ export interface FieldAssignRulesEditorProps {
   onSyncAssociationTitleField?: (params: SyncAssociationTitleFieldParams) => Promise<void> | void;
   /** 在日期字段下启用“日期变量替换 Constant 位”。 */
   enableDateVariableAsConstant?: boolean;
+  maxAssociationFieldDepth?: number;
 }
 
 export const FieldAssignRulesEditor: React.FC<FieldAssignRulesEditorProps> = (props) => {
@@ -123,9 +125,10 @@ export const FieldAssignRulesEditor: React.FC<FieldAssignRulesEditorProps> = (pr
     isTitleFieldCandidate,
     onSyncAssociationTitleField,
     enableDateVariableAsConstant = false,
+    maxAssociationFieldDepth = 2,
   } = props;
 
-  const value = Array.isArray(rawValue) ? rawValue : [];
+  const value = React.useMemo(() => (Array.isArray(rawValue) ? rawValue : []), [rawValue]);
   const [cascaderOptions, setCascaderOptions] = React.useState<FieldAssignCascaderOption[]>(() =>
     Array.isArray(fieldOptions) ? (fieldOptions as FieldAssignCascaderOption[]) : [],
   );
@@ -171,6 +174,19 @@ export const FieldAssignRulesEditor: React.FC<FieldAssignRulesEditorProps> = (pr
     }
   }, [getRuleKey, syncingRuleKey, value]);
 
+  const parseTargetPathToSegments = React.useCallback((targetPath?: string): string[] => {
+    const raw = String(targetPath || '');
+    if (!raw) return [];
+    return raw
+      .split('.')
+      .map((s) => s.trim())
+      .filter(Boolean);
+  }, []);
+
+  const isAssociationFieldLike = React.useCallback((field?: CollectionFieldLike | null) => {
+    return !!(field?.isAssociationField?.() || field?.target || field?.targetCollection);
+  }, []);
+
   const buildCollectionMetaTreeNodes = React.useCallback(
     (collection: any, basePaths: string[], visited: Set<any>): MetaTreeNode[] => {
       if (!collection?.getFields) return [];
@@ -199,7 +215,7 @@ export const FieldAssignRulesEditor: React.FC<FieldAssignRulesEditorProps> = (pr
           paths: [...basePaths, name],
         };
 
-        const isAssoc = !!f.isAssociationField?.();
+        const isAssoc = isAssociationFieldLike(f);
         const isToMany = isToManyAssociationField(f);
         if (isAssoc && !isToMany && f.targetCollection) {
           node.children = async () =>
@@ -211,7 +227,7 @@ export const FieldAssignRulesEditor: React.FC<FieldAssignRulesEditorProps> = (pr
 
       return nodes;
     },
-    [t],
+    [isAssociationFieldLike, t],
   );
 
   const buildItemMetaTree = React.useCallback(
@@ -226,7 +242,7 @@ export const FieldAssignRulesEditor: React.FC<FieldAssignRulesEditorProps> = (pr
       for (let i = 0; i < segs.length; i++) {
         const seg = segs[i] as string;
         const field = current?.getField?.(seg);
-        if (!field?.isAssociationField?.()) break;
+        if (!isAssociationFieldLike(field)) break;
         const toMany = isToManyAssociationField(field);
         const nextCollection = field?.targetCollection;
         if (!nextCollection) break;
@@ -291,7 +307,7 @@ export const FieldAssignRulesEditor: React.FC<FieldAssignRulesEditorProps> = (pr
 
       return [buildObjectNode(levels.length - 1, ['item'], 'item', 'Current item')];
     },
-    [buildCollectionMetaTreeNodes, rootCollection, t],
+    [buildCollectionMetaTreeNodes, isAssociationFieldLike, parseTargetPathToSegments, rootCollection, t],
   );
 
   const patchItem = (index: number, patch: Partial<FieldAssignRuleItem>) => {
@@ -381,15 +397,6 @@ export const FieldAssignRulesEditor: React.FC<FieldAssignRulesEditorProps> = (pr
     [t],
   );
 
-  const parseTargetPathToSegments = React.useCallback((targetPath?: string): string[] => {
-    const raw = String(targetPath || '');
-    if (!raw) return [];
-    return raw
-      .split('.')
-      .map((s) => s.trim())
-      .filter(Boolean);
-  }, []);
-
   const getFieldLabel = (targetPath?: string) => {
     const segs = parseTargetPathToSegments(targetPath);
     if (!segs.length) return undefined;
@@ -413,7 +420,7 @@ export const FieldAssignRulesEditor: React.FC<FieldAssignRulesEditorProps> = (pr
             : seg,
         ),
       );
-      if (field?.isAssociationField?.() && field?.targetCollection) {
+      if (isAssociationFieldLike(field as CollectionFieldLike) && field?.targetCollection) {
         collection = field.targetCollection;
       }
     }
@@ -435,7 +442,7 @@ export const FieldAssignRulesEditor: React.FC<FieldAssignRulesEditorProps> = (pr
 
         const isLast = i === segs.length - 1;
         if (isLast) {
-          if (!field?.isAssociationField?.() || !field?.targetCollection) return null;
+          if (!isAssociationFieldLike(field) || !field?.targetCollection) return null;
 
           const targetCollection = field.targetCollection;
           const targetFields =
@@ -502,7 +509,7 @@ export const FieldAssignRulesEditor: React.FC<FieldAssignRulesEditorProps> = (pr
           };
         }
 
-        if (!field?.isAssociationField?.() || !field?.targetCollection) {
+        if (!isAssociationFieldLike(field) || !field?.targetCollection) {
           return null;
         }
         collection = field.targetCollection;
@@ -510,7 +517,7 @@ export const FieldAssignRulesEditor: React.FC<FieldAssignRulesEditorProps> = (pr
 
       return null;
     },
-    [isTitleFieldCandidate, parseTargetPathToSegments, rootCollection, t],
+    [isAssociationFieldLike, isTitleFieldCandidate, parseTargetPathToSegments, rootCollection, t],
   );
 
   const resolveTargetCollectionBySegments = React.useCallback(
@@ -519,42 +526,24 @@ export const FieldAssignRulesEditor: React.FC<FieldAssignRulesEditorProps> = (pr
       let collection = rootCollection;
       for (const seg of segments) {
         const field = collection?.getField?.(seg);
-        if (!field?.isAssociationField?.() || !field?.targetCollection) {
+        if (!isAssociationFieldLike(field) || !field?.targetCollection) {
           return null;
         }
         collection = field.targetCollection;
       }
       return collection || null;
     },
-    [rootCollection],
+    [isAssociationFieldLike, rootCollection],
   );
 
   const buildChildrenFromCollection = React.useCallback(
-    (collection: any): FieldAssignCascaderOption[] => {
-      const fields = typeof collection?.getFields === 'function' ? collection.getFields() || [] : [];
-      const out: FieldAssignCascaderOption[] = [];
-      for (const rawField of fields) {
-        if (!rawField) continue;
-        const f = rawField as CollectionFieldLike;
-        const fieldInterface = typeof f.interface === 'string' ? f.interface : undefined;
-        if (!fieldInterface) continue;
-        if (fieldInterface === 'formula') continue;
-
-        const name = String(f.name || '');
-        if (!name) continue;
-
-        const title = t(typeof f.title === 'string' ? f.title : name);
-        const isAssoc = !!f.isAssociationField?.();
-        const hasTarget = !!f.targetCollection;
-        out.push({
-          label: title,
-          value: name,
-          isLeaf: !(isAssoc && hasTarget),
-        });
-      }
-      return out;
+    (collection: any, associationDepth: number): FieldAssignCascaderOption[] => {
+      return buildFieldAssignCascaderOptionsFromCollection(collection, t, {
+        associationDepth,
+        maxAssociationFieldDepth,
+      });
     },
-    [t],
+    [maxAssociationFieldDepth, t],
   );
 
   const loadCascaderData = React.useCallback<NonNullable<CascaderProps<FieldAssignCascaderOption>['loadData']>>(
@@ -573,7 +562,7 @@ export const FieldAssignRulesEditor: React.FC<FieldAssignRulesEditorProps> = (pr
         return;
       }
 
-      const children = buildChildrenFromCollection(targetCollection);
+      const children = buildChildrenFromCollection(targetCollection, segments.length);
       if (!children.length) {
         target.isLeaf = true;
       } else {
@@ -889,6 +878,7 @@ export const FieldAssignRulesEditor: React.FC<FieldAssignRulesEditorProps> = (pr
                 value={item.value}
                 onChange={(v) => patchItem(index, { value: v })}
                 extraMetaTree={extraMetaTree}
+                maxAssociationFieldDepth={maxAssociationFieldDepth}
                 {...(getValueInputProps?.(item, index) || {})}
                 enableDateVariableAsConstant={enableDateVariableAsConstant}
                 associationFieldNamesOverride={
@@ -959,6 +949,7 @@ export const FieldAssignRulesEditor: React.FC<FieldAssignRulesEditorProps> = (pr
                 value={item.condition || { logic: '$and', items: [] }}
                 onChange={(condition) => patchItem(index, { condition })}
                 extraMetaTree={extraMetaTree}
+                maxAssociationFieldDepth={2}
               />
             </div>
           )}

package/src/flow/components/FieldAssignValueInput.tsx

@@ -40,6 +40,7 @@ import { resolveOperatorComponent } from '../internal/utils/operatorSchemaHelper
 import { InputFieldModel } from '../models/fields/InputFieldModel';
 import { normalizeFilterValueByOperator } from '../models/blocks/filter-form/valueNormalization';
 import { FieldAssignExactDatePicker, type ExactDatePickerMode } from './FieldAssignExactDatePicker';
+import { limitAssociationMetaTree } from './filter/metaTreeAssociationDepth';
 
 const DATE_FIELD_INTERFACES = new Set(['date', 'datetime', 'datetimeNoTz', 'createdAt', 'updatedAt', 'unixTimestamp']);
 
@@ -340,6 +341,7 @@ interface Props {
    * 默认 false，保持历史行为。
    */
   enableDateVariableAsConstant?: boolean;
+  maxAssociationFieldDepth?: number;
 }
 
 type ResolvedFieldContext = {
@@ -718,6 +720,7 @@ export const FieldAssignValueInput: React.FC<Props> = ({
   preferFormItemFieldModel,
   associationFieldNamesOverride,
   enableDateVariableAsConstant = false,
+  maxAssociationFieldDepth = 2,
 }) => {
   const flowCtx = useFlowContext<FlowModelContext>();
   const normalizeEventValue = React.useCallback((eventOrValue: unknown) => {
@@ -859,7 +862,7 @@ export const FieldAssignValueInput: React.FC<Props> = ({
       fieldName,
       collectionField: nested.collectionField || null,
     };
-  }, [flowCtx.model, itemModel, resolveNestedAssociationField, targetPath]);
+  }, [flowCtx, itemModel, resolveNestedAssociationField, targetPath]);
 
   const { collection, dataSource, blockModel, fieldPath, fieldName, collectionField: cf } = resolved;
   const itemCollectionField = (resolved?.itemModel as any)?.context?.collectionField;
@@ -1232,7 +1235,7 @@ export const FieldAssignValueInput: React.FC<Props> = ({
       );
     };
     return C;
-  }, [placeholder, tempRoot, coerceEmptyValueForRenderer, normalizeEventValue]);
+  }, [placeholder, tempRoot, coerceEmptyValueForRenderer, normalizeEventValue, operator]);
 
   const DateVariableConstantEditor = React.useMemo(() => {
     const C: React.FC<any> = (inputProps) => {
@@ -1408,6 +1411,7 @@ export const FieldAssignValueInput: React.FC<Props> = ({
       const extra = extraMetaTreeRef.current;
       const extraTree = Array.isArray(extra) ? extra : [];
       const mergedBase = mergeItemMetaTreeForAssignValue(base as MetaTreeNode[], extraTree as MetaTreeNode[]);
+      const limitedBase = limitAssociationMetaTree(mergedBase, { maxAssociationDepth: maxAssociationFieldDepth });
       return [
         {
           title: tExpr('Constant'),
@@ -1418,10 +1422,10 @@ export const FieldAssignValueInput: React.FC<Props> = ({
         },
         { title: tExpr('Null'), name: 'null', type: 'object', paths: ['null'], render: NullComponent },
         { title: tExpr('RunJS'), name: 'runjs', type: 'object', paths: ['runjs'], render: RunJSComponent },
-        ...mergedBase,
+        ...limitedBase,
       ];
     };
-  }, [flowCtx, ConstantEditor, NullComponent, RunJSComponent]);
+  }, [flowCtx, ConstantEditor, NullComponent, RunJSComponent, maxAssociationFieldDepth]);
 
   const displayValue = React.useMemo(() => {
     if (!useDateVariableConstant) {

package/src/flow/components/FlowRoute.tsx

@@ -7,15 +7,18 @@
  * For more information, please refer to: https://www.nocobase.com/agreement.
  */
 
-import { useFlowEngine } from '@nocobase/flow-engine';
+import { type FlowEngine, useFlowContext, useFlowEngine } from '@nocobase/flow-engine';
 import React, { useEffect, useMemo, useRef, useState } from 'react';
 import { deviceType } from 'react-device-detect';
-import { useAdminLayoutRoutePage } from '../admin-shell/useAdminLayoutRoutePage';
 import { useParams } from 'react-router-dom';
 import { useApp } from '../../hooks/useApp';
 import { NocoBaseDesktopRouteType } from '../../flow-compat';
 import { resolveAdminRouteRuntimeTarget } from '../admin-shell/admin-layout/resolveAdminRouteRuntimeTarget';
+import { getAdminLayoutModel, type AdminLayoutModel } from '../admin-shell/admin-layout/AdminLayoutModel';
+import { getLayoutModel, type BaseLayoutModel } from '../admin-shell/BaseLayoutModel';
+import { useLayoutRoutePage } from '../admin-shell/useLayoutRoutePage';
 import { AppNotFound } from '../../components';
+import { useKeepAlive } from '../../components/KeepAlive';
 
 type FlowRouteGuardState = {
   pending: boolean;
@@ -23,8 +26,66 @@ type FlowRouteGuardState = {
   notFound: boolean;
 };
 
-const BridgeFlowRoute = ({ pageUid }: { pageUid: string }) => {
+export type LegacyPageBehavior = 'redirect' | 'notFound' | 'bridge';
+
+export type FlowRouteProps = {
+  pageUid?: string;
+  active?: boolean;
+  getLayoutModel?: (flowEngine: FlowEngine) => BaseLayoutModel | undefined;
+  legacyPageBehavior?: LegacyPageBehavior;
+};
+
+const getDefaultAdminLayoutModel = (flowEngine: FlowEngine) =>
+  getAdminLayoutModel<AdminLayoutModel>(flowEngine, { required: true });
+
+const getDefaultLayoutModel = (flowEngine: FlowEngine, contextLayout?: any) => {
+  const layout = contextLayout || flowEngine.context.layout;
+
+  if (layout?.uid) {
+    return getLayoutModel<BaseLayoutModel>(flowEngine, layout.uid, { required: true });
+  }
+
+  return getDefaultAdminLayoutModel(flowEngine);
+};
+
+const getDefaultLegacyPageBehavior = (flowEngine: FlowEngine, contextLayout?: any): LegacyPageBehavior => {
+  const layout = contextLayout || flowEngine.context.layout;
+
+  if (layout?.routeName && layout.routeName !== 'admin') {
+    return 'notFound';
+  }
+
+  return 'redirect';
+};
+
+const hasFlowModel = async (flowEngine: FlowEngine, pageUid: string) => {
+  if (flowEngine.getModel(pageUid)) {
+    return true;
+  }
+
+  const modelData = await flowEngine.modelRepository?.findOne({ uid: pageUid }).catch(() => null);
+  if (modelData?.uid) {
+    return true;
+  }
+
+  const model = await flowEngine.loadModel({ uid: pageUid }).catch(() => null);
+  if (model && flowEngine.getModel(pageUid) === model) {
+    flowEngine.removeModelWithSubModels(pageUid);
+  }
+  return !!model;
+};
+
+const BridgeFlowRoute = ({
+  pageUid,
+  active,
+  getLayoutModel,
+}: {
+  pageUid: string;
+  active?: boolean;
+  getLayoutModel: (flowEngine: FlowEngine) => BaseLayoutModel | undefined;
+}) => {
   const flowEngine = useFlowEngine();
+  const { active: keepAliveActive } = useKeepAlive();
   const routeRepository = flowEngine.context.routeRepository;
   const refreshDesktopRoutes = React.useMemo(
     () => routeRepository?.refreshAccessible.bind(routeRepository),
@@ -60,11 +121,13 @@ const BridgeFlowRoute = ({ pageUid }: { pageUid: string }) => {
     });
   }, [flowEngine]);
 
-  useAdminLayoutRoutePage({
+  useLayoutRoutePage({
     flowEngine,
     pageUid,
+    active: active ?? keepAliveActive,
     refreshDesktopRoutes,
     layoutContentRef,
+    getLayoutModel,
   });
 
   return <div ref={layoutContentRef} />;
@@ -84,12 +147,20 @@ const BridgeFlowRoute = ({ pageUid }: { pageUid: string }) => {
  * @returns {JSX.Element} 当前动态页面的布局挂载节点
  * @throws {Error} 当缺少 `route.params.name` 时抛出异常
  */
-const FlowRoute = () => {
+const FlowRoute = (props: FlowRouteProps = {}) => {
   const flowEngine = useFlowEngine();
+  const flowContext = useFlowContext<any>();
+  const contextLayout = flowContext?.layout;
+  const getLayoutModel = useMemo(
+    () => props.getLayoutModel || ((engine: FlowEngine) => getDefaultLayoutModel(engine, contextLayout)),
+    [contextLayout, props.getLayoutModel],
+  );
+  const legacyPageBehavior = props.legacyPageBehavior || getDefaultLegacyPageBehavior(flowEngine, contextLayout);
   const app = useApp();
   const routeRepository = flowEngine.context.routeRepository;
   const params = useParams();
-  const pageUid = params?.name;
+  const pageUid = props.pageUid || params?.name;
+  const skipRouteRepositoryCheck = !routeRepository;
   const [guardState, setGuardState] = useState<FlowRouteGuardState>({
     pending: true,
     allowBridge: false,
@@ -99,7 +170,7 @@ const FlowRoute = () => {
   const requestIdRef = useRef(0);
 
   if (!pageUid) {
-    throw new Error('[NocoBase] FlowRoute requires route.params.name.');
+    throw new Error('[NocoBase] FlowRoute requires pageUid or route.params.name.');
   }
 
   useEffect(() => {
@@ -109,7 +180,7 @@ const FlowRoute = () => {
     const run = async () => {
       setGuardState({ pending: true, allowBridge: false, notFound: false });
 
-      if (!routeRepository?.isAccessibleLoaded?.()) {
+      if (!skipRouteRepositoryCheck && !routeRepository?.isAccessibleLoaded?.()) {
         try {
           await routeRepository?.ensureAccessibleLoaded?.();
         } catch (_error) {
@@ -124,8 +195,26 @@ const FlowRoute = () => {
         return;
       }
 
-      const route = routeRepository?.getRouteBySchemaUid?.(pageUid);
+      const route = skipRouteRepositoryCheck ? undefined : routeRepository?.getRouteBySchemaUid?.(pageUid);
+      if (!route && legacyPageBehavior === 'notFound') {
+        const flowModelExists = await hasFlowModel(flowEngine, pageUid);
+        if (active && requestId === requestIdRef.current) {
+          setGuardState({ pending: false, allowBridge: flowModelExists, notFound: !flowModelExists });
+        }
+        return;
+      }
+
       if (route?.type === NocoBaseDesktopRouteType.page) {
+        if (legacyPageBehavior === 'notFound') {
+          setGuardState({ pending: false, allowBridge: false, notFound: true });
+          return;
+        }
+
+        if (legacyPageBehavior === 'bridge') {
+          setGuardState({ pending: false, allowBridge: true, notFound: false });
+          return;
+        }
+
         const target = resolveAdminRouteRuntimeTarget({
           app,
           route,
@@ -161,22 +250,23 @@ const FlowRoute = () => {
     return () => {
       active = false;
     };
-  }, [app, pageUid, routeRepository]);
+  }, [app, flowEngine, legacyPageBehavior, pageUid, routeRepository, skipRouteRepositoryCheck]);
 
   const content = useMemo(() => {
     if (guardState.pending) {
       return null;
     }
 
+    if (guardState.notFound) {
+      return <AppNotFound />;
+    }
+
     if (!guardState.allowBridge) {
-      if (guardState.notFound) {
-        return <AppNotFound />;
-      }
       return null;
     }
 
-    return <BridgeFlowRoute pageUid={pageUid} />;
-  }, [guardState.allowBridge, guardState.notFound, guardState.pending, pageUid]);
+    return <BridgeFlowRoute pageUid={pageUid} active={props.active} getLayoutModel={getLayoutModel} />;
+  }, [getLayoutModel, guardState.allowBridge, guardState.notFound, guardState.pending, pageUid, props.active]);
 
   return content;
 };