@nocobase/client-v2 2.2.0-beta.6 → 2.2.0-beta.8

package/src/flow/actions/__tests__/openView.defineProps.route.test.tsx

@@ -9,6 +9,7 @@
 
 import React from 'react';
 import { describe, it, expect, vi } from 'vitest';
+import { RUNJS_OPEN_VIEW_ROUTE_STATE } from '@nocobase/flow-engine';
 import { openView } from '../openView';
 import { FlowPage } from '../../FlowPage';
 
@@ -50,6 +51,27 @@ describe('openView action - route mode defineProperties/defineMethods', () => {
     return { ctx, engine };
   };
 
+  const createFirstStageCtx = (inputArgs: Record<PropertyKey, unknown>) => {
+    const navigateTo = vi.fn();
+    const ctx: any = {
+      inputArgs,
+      engine: { context: { themeToken: { colorBgLayout: '#fff' } } },
+      model: {
+        uid: 'popup-uid',
+        context: {
+          inputArgs: {},
+          defineProperty: vi.fn(),
+        },
+        flowEngine: { context: { themeToken: { colorBgLayout: '#fff' } } },
+      },
+      view: {
+        navigation: { navigateTo },
+      },
+    };
+
+    return { ctx, navigateTo };
+  };
+
   it('injects defineProperties/defineMethods on onModelLoaded even when not present in current inputArgs', async () => {
     const { ctx } = createRouteManagedCtx();
 
@@ -149,4 +171,86 @@ describe('openView action - route mode defineProperties/defineMethods', () => {
     const defineMethodCalls = pageModelContext.defineMethod.mock.calls.map((c: any[]) => c[0]);
     expect(defineMethodCalls).toContain('pong');
   });
+
+  it('adds route state to first-stage navigation only for RunJS ctx.openView calls', async () => {
+    const { ctx, navigateTo } = createFirstStageCtx({
+      mode: 'dialog',
+      size: 'large',
+      [RUNJS_OPEN_VIEW_ROUTE_STATE]: { mode: 'dialog', size: 'large' },
+    });
+
+    await openView.handler(ctx, { mode: 'drawer', size: 'medium', navigation: true });
+
+    expect(navigateTo).toHaveBeenCalledWith({
+      viewUid: 'popup-uid',
+      filterByTk: undefined,
+      sourceId: undefined,
+      tabUid: undefined,
+      openViewRouteState: { mode: 'dialog', size: 'large' },
+    });
+  });
+
+  it('normalizes first-stage RunJS route state mode on mobile layout', async () => {
+    const { ctx, navigateTo } = createFirstStageCtx({
+      isMobileLayout: true,
+      mode: 'dialog',
+      size: 'large',
+      [RUNJS_OPEN_VIEW_ROUTE_STATE]: { mode: 'dialog', size: 'large' },
+    });
+
+    await openView.handler(ctx, { mode: 'drawer', size: 'medium', navigation: true });
+
+    expect(navigateTo).toHaveBeenCalledWith({
+      viewUid: 'popup-uid',
+      filterByTk: undefined,
+      sourceId: undefined,
+      tabUid: undefined,
+      openViewRouteState: { mode: 'embed', size: 'large' },
+    });
+  });
+
+  it('uses route replay mode and size before persisted openView defaults', async () => {
+    const { ctx } = createRouteManagedCtx();
+    ctx.inputArgs.mode = 'dialog';
+    ctx.inputArgs.size = 'large';
+
+    await openView.handler(ctx, { mode: 'drawer', size: 'medium', navigation: true });
+
+    expect(ctx.viewer.open).toHaveBeenCalledWith(
+      expect.objectContaining({
+        type: 'dialog',
+        width: '80%',
+      }),
+    );
+  });
+
+  it('uses decoded openView route state during route replay', async () => {
+    const { ctx } = createRouteManagedCtx();
+    ctx.inputArgs.openViewRouteState = { mode: 'dialog', size: 'large' };
+
+    await openView.handler(ctx, { mode: 'drawer', size: 'medium', navigation: true });
+
+    expect(ctx.viewer.open).toHaveBeenCalledWith(
+      expect.objectContaining({
+        type: 'dialog',
+        width: '80%',
+      }),
+    );
+  });
+
+  it('keeps first-stage navigation unchanged for non-RunJS openView calls', async () => {
+    const { ctx, navigateTo } = createFirstStageCtx({
+      mode: 'dialog',
+      size: 'large',
+    });
+
+    await openView.handler(ctx, { mode: 'drawer', size: 'medium', navigation: true });
+
+    expect(navigateTo).toHaveBeenCalledWith({
+      viewUid: 'popup-uid',
+      filterByTk: undefined,
+      sourceId: undefined,
+      tabUid: undefined,
+    });
+  });
 });

package/src/flow/actions/afterSuccess.tsx

@@ -7,13 +7,152 @@
  * For more information, please refer to: https://www.nocobase.com/agreement.
  */
 
-import { defineAction, tExpr } from '@nocobase/flow-engine';
+import {
+  FlowContext,
+  createRecordMetaFactory,
+  createRecordResolveOnServerWithLocal,
+  defineAction,
+  tExpr,
+  useFlowSettingsContext,
+  type Collection,
+  type FlowRuntimeContext,
+  type MetaTreeNode,
+  type PropertyMetaFactory,
+} from '@nocobase/flow-engine';
 import { isURL } from '@nocobase/utils/client';
-import { TextAreaWithContextSelector } from '../components/TextAreaWithContextSelector';
+import React, { useMemo } from 'react';
+import {
+  TextAreaWithContextSelector,
+  type TextAreaWithContextSelectorProps,
+} from '../components/TextAreaWithContextSelector';
+
+type ResponseRecordPlainStepContext = {
+  steps?: FlowRuntimeContext['steps'];
+};
+
+type ResponseRecordFlowDefinitionContext = {
+  flowKey?: string;
+  model?: {
+    getFlow?: (flowKey: string) => { steps?: Record<string, unknown> } | undefined;
+  };
+};
+
+type ResponseRecordContext = FlowContext &
+  ResponseRecordPlainStepContext & {
+    blockModel?: { collection?: Collection };
+    collection?: Collection;
+    model?: FlowRuntimeContext['model'] & { collection?: Collection };
+  };
+
+function getResponseRecordSteps(ctx: FlowContext | ResponseRecordPlainStepContext): FlowRuntimeContext['steps'] {
+  return 'steps' in ctx ? ctx.steps || {} : {};
+}
+
+export function getAfterSuccessResponseRecord(ctx: FlowContext | ResponseRecordPlainStepContext) {
+  const steps = getResponseRecordSteps(ctx);
+  const preferredStepKeys = ['saveResource', 'submit', 'request', 'apply', 'save'];
+
+  for (const stepKey of preferredStepKeys) {
+    if (Object.prototype.hasOwnProperty.call(steps, stepKey) && steps[stepKey]?.result != null) {
+      return steps[stepKey].result;
+    }
+  }
+
+  const results = Object.entries(steps)
+    .filter(([stepKey, step]) => stepKey !== 'afterSuccess' && step?.result != null)
+    .map(([, step]) => step.result);
+  return results[results.length - 1];
+}
+
+function getResponseRecordMeta(ctx: ResponseRecordContext): PropertyMetaFactory | undefined {
+  if (!hasResponseRecordSource(ctx)) {
+    return;
+  }
+  const collectionAccessor = getResponseRecordCollectionAccessor(ctx);
+  if (!collectionAccessor()) {
+    return;
+  }
+  return createRecordMetaFactory(collectionAccessor, ctx.t('Response record'), () => {
+    const collection = collectionAccessor();
+    const record = getAfterSuccessResponseRecord(ctx);
+    if (!collection || !record) {
+      return;
+    }
+    try {
+      const filterByTk = collection.getFilterByTK(record);
+      if (filterByTk == null) {
+        return;
+      }
+      return {
+        collection: collection.name,
+        dataSourceKey: collection.dataSourceKey || 'main',
+        filterByTk,
+      };
+    } catch (error) {
+      return;
+    }
+  });
+}
+
+function hasResponseRecordSource(ctx: FlowContext | ResponseRecordPlainStepContext) {
+  if (Object.prototype.hasOwnProperty.call(getResponseRecordSteps(ctx), 'saveResource')) {
+    return true;
+  }
+
+  const { model, flowKey } = ctx as ResponseRecordFlowDefinitionContext;
+  if (!model || typeof model.getFlow !== 'function' || !flowKey) {
+    return false;
+  }
+
+  return Object.prototype.hasOwnProperty.call(model.getFlow(flowKey)?.steps || {}, 'saveResource');
+}
+
+function getResponseRecordCollectionAccessor(ctx: ResponseRecordContext) {
+  return () => ctx.blockModel?.collection || ctx.collection || ctx.model?.collection || null;
+}
+
+export function getMetaTreeWithResponseRecord(ctx: FlowRuntimeContext): MetaTreeNode[] {
+  const responseRecordMeta = getResponseRecordMeta(ctx);
+  if (!responseRecordMeta) {
+    return ctx.getPropertyMetaTree?.() || [];
+  }
+
+  const scoped = new FlowContext();
+  scoped.addDelegate(ctx);
+  scoped.defineProperty('responseRecord', {
+    get: () => getAfterSuccessResponseRecord(ctx),
+    cache: false,
+    resolveOnServer: createRecordResolveOnServerWithLocal(getResponseRecordCollectionAccessor(ctx), () =>
+      getAfterSuccessResponseRecord(ctx),
+    ),
+    meta: responseRecordMeta,
+  });
+  return scoped.getPropertyMetaTree();
+}
+
+function AfterSuccessRedirectTextArea(props: TextAreaWithContextSelectorProps) {
+  const flowCtx = useFlowSettingsContext();
+  const metaTree = useMemo(() => () => getMetaTreeWithResponseRecord(flowCtx), [flowCtx]);
+
+  return <TextAreaWithContextSelector {...props} metaTree={metaTree} />;
+}
 
 export const afterSuccess = defineAction({
   name: 'afterSuccess',
   title: tExpr('After successful submission'),
+  defineProperties(ctx) {
+    const responseRecordMeta = getResponseRecordMeta(ctx);
+    return {
+      responseRecord: {
+        get: () => getAfterSuccessResponseRecord(ctx),
+        cache: false,
+        resolveOnServer: createRecordResolveOnServerWithLocal(getResponseRecordCollectionAccessor(ctx), () =>
+          getAfterSuccessResponseRecord(ctx),
+        ),
+        ...(responseRecordMeta ? { meta: responseRecordMeta } : {}),
+      },
+    };
+  },
   uiSchema: {
     successMessage: {
       type: 'string',
@@ -46,7 +185,7 @@ export const afterSuccess = defineAction({
       type: 'string',
       title: tExpr('Link'),
       'x-decorator': 'FormItem',
-      'x-component': TextAreaWithContextSelector,
+      'x-component': AfterSuccessRedirectTextArea,
       'x-reactions': {
         dependencies: ['actionAfterSuccess'],
         fulfill: {

package/src/flow/actions/dataScopeFilter.ts

@@ -12,6 +12,12 @@ import { transformFilter } from '@nocobase/utils/client';
 import _ from 'lodash';
 
 const PRESERVE_NULL = { __nocobaseDataScopeNull__: true };
+const SERVER_CURRENT_ROLE_VARIABLE = '{{$nRole}}';
+const CURRENT_ROLE_EXPRESSION_RE = /^\s*\{\{\s*ctx\.role\s*\}\}\s*$/;
+
+function isCurrentRoleExpression(value: unknown) {
+  return typeof value === 'string' && CURRENT_ROLE_EXPRESSION_RE.test(value);
+}
 
 function isPreserveNull(value: any) {
   return (
@@ -45,6 +51,10 @@ function markEmptyVariableValues(rawNode: any, resolvedNode: any) {
   }
 
   if ('path' in rawNode && 'operator' in rawNode) {
+    if (isCurrentRoleExpression(rawNode.value)) {
+      resolvedNode.value = SERVER_CURRENT_ROLE_VARIABLE;
+      return;
+    }
     if (
       isVariableExpression(rawNode.value) &&
       (resolvedNode.value === undefined || resolvedNode.value === null || resolvedNode.value === '')

package/src/flow/actions/index.ts

@@ -7,7 +7,7 @@
  * For more information, please refer to: https://www.nocobase.com/agreement.
  */
 
-export * from './afterSuccess';
+export { afterSuccess } from './afterSuccess';
 export * from './confirm';
 export * from './dataScope';
 export * from './openView';

package/src/flow/actions/openView.tsx

@@ -7,7 +7,15 @@
  * For more information, please refer to: https://www.nocobase.com/agreement.
  */
 
-import { defineAction, tExpr, FlowModelContext, FlowModel, FlowExitAllException } from '@nocobase/flow-engine';
+import {
+  defineAction,
+  tExpr,
+  FlowModelContext,
+  FlowModel,
+  FlowExitAllException,
+  createOpenViewRouteState,
+  RUNJS_OPEN_VIEW_ROUTE_STATE,
+} from '@nocobase/flow-engine';
 import React from 'react';
 import { FlowPage } from '../FlowPage';
 import { PageModel, RootPageModel } from '../models';
@@ -291,8 +299,32 @@ export const openView = defineAction({
         ? (inputArgs as any).associationName
         : (params as any)?.associationName;
     const mergedTabUid = typeof inputArgs.tabUid !== 'undefined' ? inputArgs.tabUid : params.tabUid;
-    // 移动端中只需要显示子页面
-    const openMode = ctx.inputArgs?.isMobileLayout ? 'embed' : ctx.inputArgs?.mode || params.mode || 'drawer';
+    const hasRunJSOpenViewRouteState = Object.prototype.hasOwnProperty.call(inputArgs, RUNJS_OPEN_VIEW_ROUTE_STATE);
+    const runJSOpenViewRouteStateInput = (inputArgs as Record<PropertyKey, unknown>)[RUNJS_OPEN_VIEW_ROUTE_STATE];
+    const runJSOpenViewRouteState = hasRunJSOpenViewRouteState
+      ? createOpenViewRouteState(
+          runJSOpenViewRouteStateInput && typeof runJSOpenViewRouteStateInput === 'object'
+            ? (runJSOpenViewRouteStateInput as { mode?: unknown; size?: unknown })
+            : {
+                mode: inputArgs.mode,
+                size: inputArgs.size,
+              },
+        )
+      : undefined;
+    const replayOpenViewRouteStateInput = (inputArgs as { openViewRouteState?: unknown }).openViewRouteState;
+    const replayOpenViewRouteState =
+      replayOpenViewRouteStateInput && typeof replayOpenViewRouteStateInput === 'object'
+        ? createOpenViewRouteState(replayOpenViewRouteStateInput as { mode?: unknown; size?: unknown })
+        : undefined;
+    const runtimeOpenViewRouteState = runJSOpenViewRouteState || replayOpenViewRouteState;
+    // 移动端中只需要显示子页面。本次 dispatch 参数优先于持久化默认值。
+    const openMode = ctx.inputArgs?.isMobileLayout
+      ? 'embed'
+      : runtimeOpenViewRouteState?.mode || ctx.inputArgs?.mode || params.mode || 'drawer';
+    const effectiveRunJSOpenViewRouteState =
+      runJSOpenViewRouteState && ctx.inputArgs?.isMobileLayout
+        ? createOpenViewRouteState({ ...runJSOpenViewRouteState, mode: openMode })
+        : runJSOpenViewRouteState;
     let navigation = typeof inputArgs.navigation !== 'undefined' ? inputArgs.navigation : params.navigation;
 
     // 传递了上下文就必须禁用路由，否则下次路由打开会缺少上下文
@@ -313,6 +345,7 @@ export const openView = defineAction({
           sourceId: mergedSourceId,
           tabUid: mergedTabUid,
           viewUid: ctx.model.context?.inputArgs?.viewUid || ctx.model.uid,
+          ...(effectiveRunJSOpenViewRouteState ? { openViewRouteState: effectiveRunJSOpenViewRouteState } : {}),
         } as Record<string, unknown>;
         const pendingView = {
           type: pendingType,
@@ -328,6 +361,7 @@ export const openView = defineAction({
           filterByTk: mergedFilterByTk,
           sourceId: mergedSourceId,
           tabUid: mergedTabUid,
+          ...(effectiveRunJSOpenViewRouteState ? { openViewRouteState: effectiveRunJSOpenViewRouteState } : {}),
         };
         ctx.view.navigation.navigateTo(nextView);
         return;
@@ -373,7 +407,7 @@ export const openView = defineAction({
 
     const pageModelClass =
       ctx.inputArgs.pageModelClass || params.pageModelClass || ctx.layout?.childPageModelClass || 'ChildPageModel';
-    const size = ctx.inputArgs.size || params.size || 'medium';
+    const size = runtimeOpenViewRouteState?.size || ctx.inputArgs.size || params.size || 'medium';
     let pageModelUid: string | null = null;
     let pageModelRef: FlowModel | null = null;
 

package/src/flow/admin-shell/BaseLayoutModel.tsx

@@ -8,7 +8,13 @@
  */
 
 import { define, observable } from '@formily/reactive';
-import { parsePathnameToViewParams, type FlowEngine, FlowModel, type ViewParam } from '@nocobase/flow-engine';
+import {
+  decodeOpenViewRouteState,
+  parsePathnameToViewParams,
+  type FlowEngine,
+  FlowModel,
+  type ViewParam,
+} from '@nocobase/flow-engine';
 import {
   BaseLayoutRouteCoordinator,
   type BaseLayoutRouteCoordinatorOptions,
@@ -116,20 +122,36 @@ const isStandardLayoutRelativePath = (relativePath: string) => {
   }
 
   let i = 1;
+  let currentViewUid = segments[0];
   while (i < segments.length) {
     const segment = segments[i];
+
     if (segment === 'view') {
       if (!segments[i + 1]) {
         return false;
       }
+      currentViewUid = segments[i + 1];
+      i += 2;
+      continue;
+    }
+
+    if (segment === 'opts') {
+      if (!segments[i + 1] || !decodeOpenViewRouteState(currentViewUid, segments[i + 1])) {
+        return false;
+      }
+      i += 2;
+      continue;
+    }
+
+    if (isKnownViewParamName(segment) && segments[i + 1]) {
       i += 2;
       continue;
     }
 
-    if (!isKnownViewParamName(segment) || !segments[i + 1]) {
+    if (!segments[i + 1]) {
       return false;
     }
-    i += 2;
+    return false;
   }
 
   return true;

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

@@ -272,7 +272,7 @@ export class BaseLayoutRouteCoordinator {
           runtime.viewState[getKey(viewItem)]?.destroy?.(true);
           delete runtime.viewState[getKey(viewItem)];
         });
-        updateViewListHidden(viewList);
+        updateViewListHidden(viewList, !!this.layoutContext?.isMobileLayout);
       }
 
       if (viewsToOpen.length) {
@@ -299,7 +299,7 @@ export class BaseLayoutRouteCoordinator {
     }
 
     if (runtime.meta.active) {
-      updateViewListHidden(viewList);
+      updateViewListHidden(viewList, !!this.layoutContext?.isMobileLayout);
       return;
     }
 
@@ -390,6 +390,7 @@ export class BaseLayoutRouteCoordinator {
       openViewParams?.associationName && !hasUsableSourceId(viewItem.params.sourceId)
         ? null
         : openViewParams?.associationName;
+    const openViewRouteState = viewItem.params.openViewRouteState;
     const openerUids = viewList.slice(0, viewItem.index).map((item) => item.params.viewUid);
     const navigation = new ViewNavigation(
       this.flowEngine.context,
@@ -408,6 +409,8 @@ export class BaseLayoutRouteCoordinator {
       deactivateRef,
       openerUids,
       ...viewItem.params,
+      ...(openViewRouteState?.mode ? { mode: openViewRouteState.mode } : {}),
+      ...(openViewRouteState?.size ? { size: openViewRouteState.size } : {}),
       pageActive: runtime.meta.active,
       activationControlledByLayout: true,
       navigation,

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

@@ -121,6 +121,19 @@ describe('AdminLayoutRouteCoordinator', () => {
     });
   });
 
+  it('passes RunJS openView route state as runtime mode and size during route replay', () => {
+    const { dispatchEvent } = setupRouteReplay({
+      openViewRouteState: { mode: 'dialog', size: 'large' },
+    });
+
+    expect(dispatchEvent.mock.calls[0][1]).toMatchObject({
+      mode: 'dialog',
+      size: 'large',
+      openViewRouteState: { mode: 'dialog', size: 'large' },
+      triggerByRouter: true,
+    });
+  });
+
   it('uses layout content element before route page placeholder as view target', () => {
     const engine = new FlowEngine();
     engine.registerModels({ RouteModel });

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

@@ -718,6 +718,7 @@ export const AdminLayoutComponent = observer((props: any) => {
                       <ConfigProvider theme={isMobile ? mobileTheme : theme}>
                         <GlobalStyle />
                         <AdminLayoutContent
+                          designable={designable}
                           layout={adminLayoutModel?.layout}
                           onContentElementChange={handleLayoutContentElementChange}
                         />

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

@@ -26,6 +26,7 @@ import {
 type AdminLayoutContentProps = {
   onContentElementChange?: (element: HTMLDivElement | null) => void;
   layout?: (AdminLayoutRoutePathLike & { routeName?: string }) | null;
+  designable?: boolean;
 };
 
 const layoutContentClass = css`
@@ -70,7 +71,7 @@ function isDvhSupported() {
   return testEl.style.height === '1dvh';
 }
 
-const ShowTipWhenNoPages = observer((props: { layout?: AdminLayoutRoutePathLike | null }) => {
+const ShowTipWhenNoPages = observer((props: { designable?: boolean; layout?: AdminLayoutRoutePathLike | null }) => {
   const flowEngine = useFlowEngine();
   const { token } = antdTheme.useToken();
   const { t } = useTranslation();
@@ -79,7 +80,7 @@ const ShowTipWhenNoPages = observer((props: { layout?: AdminLayoutRoutePathLike
   const visibleRoutes = isV2AdminRuntime(flowEngine.context.app)
     ? allAccessRoutes.filter((route) => isV2MenuRoute(route))
     : allAccessRoutes;
-  const designable = !!flowEngine.context.flowSettingsEnabled;
+  const designable = !!props.designable || !!flowEngine.context.flowSettingsEnabled;
   const layoutRoutePath = getAdminLayoutRoutePath(props.layout);
 
   if (
@@ -104,7 +105,7 @@ const ShowTipWhenNoPages = observer((props: { layout?: AdminLayoutRoutePathLike
  *
  * 内容区不再依赖独立 FlowModel，而是通过回调把挂载目标同步给 root model。
  */
-export const AdminLayoutContent: FC<AdminLayoutContentProps> = ({ onContentElementChange, layout }) => {
+export const AdminLayoutContent: FC<AdminLayoutContentProps> = ({ designable, onContentElementChange, layout }) => {
   const style = useMemo(() => (isDvhSupported() ? mobileHeight : undefined), []);
   const params = useParams();
   const matches = useMatches();
@@ -131,7 +132,7 @@ export const AdminLayoutContent: FC<AdminLayoutContentProps> = ({ onContentEleme
     >
       <div style={pageContentStyle}>
         {shouldKeepAlive && pageUid ? <KeepAlive uid={pageUid}>{() => <Outlet />}</KeepAlive> : <Outlet />}
-        <ShowTipWhenNoPages layout={layout} />
+        <ShowTipWhenNoPages designable={designable} layout={layout} />
       </div>
     </div>
   );

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

@@ -39,6 +39,7 @@ import {
   FlowEngine,
   FlowEngineProvider,
   FlowModelRenderer,
+  encodeOpenViewRouteState,
   useFlowEngine,
   type FlowModel,
 } from '@nocobase/flow-engine';
@@ -213,6 +214,87 @@ describe('AdminLayoutModel runtime', () => {
     });
   });
 
+  it('should parse RunJS openView route params into layout route view stack state', async () => {
+    const token = encodeOpenViewRouteState('popup', { mode: 'dialog', size: 'large' });
+    if (!token) {
+      throw new Error('Expected openView route state token.');
+    }
+    const engine = new FlowEngine();
+    engine.context.defineProperty('routeRepository', {
+      value: {
+        getRouteBySchemaUid: (pageUid: string) => ({ title: pageUid }),
+      },
+    });
+
+    render(
+      <FlowEngineProvider engine={engine}>
+        <TestAdminLayoutHost />
+      </FlowEngineProvider>,
+    );
+    const model = engine.getModel<TestAdminLayoutModel>('admin-layout-model');
+    expect(model).toBeTruthy();
+
+    act(() => {
+      model.syncLayoutRoute({
+        name: getLayoutPageViewRouteName('admin'),
+        pathname: `/admin/page-1/view/popup/opts/${token}/filterbytk/1`,
+        layoutBasePathname: '/admin',
+      });
+    });
+
+    await waitFor(() => {
+      expect(model.context.layoutRoute).toMatchObject({
+        type: 'page',
+        pageUid: 'page-1',
+        viewStack: [
+          { viewUid: 'page-1' },
+          {
+            viewUid: 'popup',
+            openViewRouteState: { mode: 'dialog', size: 'large' },
+            filterByTk: '1',
+          },
+        ],
+      });
+    });
+  });
+
+  it('should reject malformed RunJS openView route params', async () => {
+    const wrongViewToken = encodeOpenViewRouteState('other-popup', { mode: 'dialog', size: 'large' });
+    if (!wrongViewToken) {
+      throw new Error('Expected openView route state token.');
+    }
+    const engine = new FlowEngine();
+
+    render(
+      <FlowEngineProvider engine={engine}>
+        <TestAdminLayoutHost />
+      </FlowEngineProvider>,
+    );
+    const model = engine.getModel<TestAdminLayoutModel>('admin-layout-model');
+    expect(model).toBeTruthy();
+
+    [
+      '/admin/page-1/sourceid',
+      '/admin/page-1/AbCdEfGh/filterbytk/1',
+      '/admin/page-1/view/popup/AbCdEfGh/filterbytk/1',
+      '/admin/page-1/view/popup/opts/AbCdEfGh/filterbytk/1',
+      '/admin/page-1/view/popup/openviewmode/dialog',
+      '/admin/page-1/view/popup/openviewsize/large',
+      `/admin/page-1/view/popup/opts/${wrongViewToken}/filterbytk/1`,
+    ].forEach((pathname) => {
+      expect(
+        model.resolveLayoutRoute({
+          name: getLayoutPageViewRouteName('admin'),
+          pathname,
+          layoutBasePathname: '/admin',
+        }),
+      ).toMatchObject({
+        type: 'notFound',
+        pathname,
+      });
+    });
+  });
+
   it('should not consume global routes that belong to nested layouts', async () => {
     const engine = new FlowEngine();
     const routeRef = observable.ref({