cabloy 5.1.169 → 5.1.171

package/vona/src/suite-vendor/a-cabloy/modules/a-layoutprofile/src/service/layoutprofile.ts

@@ -0,0 +1,64 @@
+import type { TableIdentity } from 'table-identity';
+import type { IUser } from 'vona-module-a-user';
+
+import { BeanBase } from 'vona';
+import { Service } from 'vona-module-a-bean';
+import { Core } from 'vona-module-a-core';
+
+import type { ILayoutProfile } from '../types/layoutprofile.ts';
+
+@Service()
+export class ServiceLayoutprofile extends BeanBase {
+  async load(user: IUser, layoutKey: string): Promise<ILayoutProfile | undefined> {
+    const entity = await this.scope.model.layoutprofile.get({ userId: user.id, layoutKey });
+    return entity?.profile as ILayoutProfile | undefined;
+  }
+
+  async save(user: IUser, layoutKey: string, profile: ILayoutProfile): Promise<ILayoutProfile> {
+    if (await this._saveExisting(user.id, layoutKey, profile)) return profile;
+    return await this.scope.redlock.lockIsolate(
+      `layoutprofileSave.${user.id}.${layoutKey}`,
+      async () => await this._saveAfterLock(user.id, layoutKey, profile),
+    );
+  }
+
+  async reset(user: IUser, layoutKey: string): Promise<void> {
+    await this.scope.redlock.lockIsolate(
+      `layoutprofileSave.${user.id}.${layoutKey}`,
+      async () => await this._reset(user.id, layoutKey),
+    );
+  }
+
+  @Core.transaction()
+  private async _saveExisting(
+    userId: TableIdentity,
+    layoutKey: string,
+    profile: ILayoutProfile,
+  ): Promise<boolean> {
+    const entity = await this.scope.model.layoutprofile.getForUpdate({ userId, layoutKey });
+    if (!entity) return false;
+    await this.scope.model.layoutprofile.updateById(entity.id, { profile });
+    return true;
+  }
+
+  @Core.transaction()
+  private async _saveAfterLock(
+    userId: TableIdentity,
+    layoutKey: string,
+    profile: ILayoutProfile,
+  ): Promise<ILayoutProfile> {
+    const entity = await this.scope.model.layoutprofile.getForUpdate({ userId, layoutKey });
+    if (entity) {
+      await this.scope.model.layoutprofile.updateById(entity.id, { profile });
+    } else {
+      await this.scope.model.layoutprofile.insert({ userId, layoutKey, profile });
+    }
+    return profile;
+  }
+
+  @Core.transaction()
+  private async _reset(userId: TableIdentity, layoutKey: string): Promise<void> {
+    const entity = await this.scope.model.layoutprofile.getForUpdate({ userId, layoutKey });
+    if (entity) await this.scope.model.layoutprofile.deleteById(entity.id);
+  }
+}

package/vona/src/suite-vendor/a-cabloy/modules/a-layoutprofile/src/types/index.ts

@@ -0,0 +1 @@
+export * from './layoutprofile.ts';

package/vona/src/suite-vendor/a-cabloy/modules/a-layoutprofile/src/types/layoutprofile.ts

@@ -0,0 +1,21 @@
+import type { TableIdentity } from 'table-identity';
+
+export type TypeLayoutProfileWidth = number | 'auto';
+
+export interface ILayoutProfileColumn {
+  key: string;
+  visible: boolean;
+  width: TypeLayoutProfileWidth;
+}
+
+export interface ILayoutProfile extends Record<string, unknown> {
+  version: 1;
+  schemaFingerprint?: string;
+  columns: ILayoutProfileColumn[];
+}
+
+export interface ILayoutProfileRecord {
+  id?: TableIdentity;
+  layoutKey: string;
+  profile: ILayoutProfile;
+}

package/vona/src/suite-vendor/a-cabloy/modules/a-layoutprofile/test/layoutprofile.test.ts

@@ -0,0 +1,258 @@
+import type { TableIdentity } from 'table-identity';
+
+import { catchError } from '@cabloy/utils';
+import assert from 'node:assert';
+import { randomUUID } from 'node:crypto';
+import { describe, it } from 'node:test';
+import { app } from 'vona-mock';
+
+import type { ILayoutProfile } from '../src/types/layoutprofile.ts';
+
+const actionPath = '/layoutprofile';
+
+function createTestId() {
+  return randomUUID().slice(0, 12);
+}
+
+function createProfile(name: string): ILayoutProfile {
+  return {
+    version: 1,
+    schemaFingerprint: `schema-${name}`,
+    columns: [
+      { key: 'name', visible: true, width: 'auto' },
+      { key: 'level', visible: false, width: 180 },
+    ],
+  };
+}
+
+async function performAs(accessToken: string, method: string, path: string, options = {}) {
+  return await app.bean.executor.newCtxIsolate(async () => {
+    return await (app.bean.executor.performAction as any)(method, path, {
+      ...options,
+      authToken: accessToken,
+      innerAccess: false,
+    });
+  });
+}
+
+async function registerAndSignin(name: string) {
+  const user = await app.bean.user.register({ name }, true);
+  const token = await app.bean.passport.signinMock(name as any);
+  return { token: token.accessToken, user };
+}
+
+async function deleteOwnedProfiles(userIds: readonly TableIdentity[], layoutKey: string) {
+  for (const userId of userIds) {
+    await app.scope('a-layoutprofile').model.layoutprofile.delete({ userId, layoutKey });
+  }
+}
+
+async function deleteOwnedUsers(userIds: readonly TableIdentity[]) {
+  for (const userId of userIds) {
+    await app.scope('home-user').model.roleUser.delete({ userId });
+    await app.bean.user.removeById(userId);
+  }
+}
+
+async function deleteOwnedTestData(userIds: readonly TableIdentity[], layoutKey: string) {
+  await deleteOwnedProfiles(userIds, layoutKey);
+  await deleteOwnedUsers(userIds);
+}
+
+describe('layoutprofile.test.ts', { concurrency: false }, () => {
+  it('rejects anonymous profile operations', async () => {
+    await app.bean.executor.mockCtx(async () => {
+      for (const [method, path, options] of [
+        ['get', `${actionPath}/load`, { query: { layoutKey: 'anonymous' } }],
+        [
+          'post',
+          `${actionPath}/save`,
+          { body: { layoutKey: 'anonymous', profile: createProfile('anonymous') } },
+        ],
+        ['delete', `${actionPath}/reset`, { query: { layoutKey: 'anonymous' } }],
+      ] as const) {
+        const [, error] = await catchError(() =>
+          (app.bean.executor.performAction as any)(method, path, {
+            ...options,
+            innerAccess: false,
+          }),
+        );
+        assert.equal(error?.code, 401);
+      }
+    });
+  });
+
+  it('isolates profiles by authenticated user and supports reset', async () => {
+    await app.bean.executor.mockCtx(async () => {
+      const suffix = createTestId();
+      const layoutKey = `/training/student/${suffix}`;
+      let userA: TableIdentity | undefined;
+      let userB: TableIdentity | undefined;
+      try {
+        const customerA = await registerAndSignin(`layout-a-${suffix}`);
+        const customerB = await registerAndSignin(`layout-b-${suffix}`);
+        userA = customerA.user.id;
+        userB = customerB.user.id;
+        const profileA = createProfile('a');
+        const profileAUpdated = {
+          ...createProfile('a-updated'),
+          columns: [{ key: 'name', visible: false, width: 320 }],
+        } satisfies ILayoutProfile;
+        const profileB = createProfile('b');
+
+        assert.equal(
+          await performAs(customerA.token, 'get', `${actionPath}/load`, {
+            query: { layoutKey },
+          }),
+          undefined,
+        );
+        assert.deepEqual(
+          await performAs(customerA.token, 'post', `${actionPath}/save`, {
+            body: { layoutKey, profile: profileA },
+          }),
+          profileA,
+        );
+        const persistedA = await app.scope('a-layoutprofile').model.layoutprofile.get({
+          userId: userA,
+          layoutKey,
+        });
+        assert.equal(String(persistedA?.userId), String(userA));
+        assert.deepEqual(persistedA?.profile, profileA);
+
+        assert.equal(
+          await performAs(customerB.token, 'get', `${actionPath}/load`, {
+            query: { layoutKey },
+          }),
+          undefined,
+        );
+        assert.deepEqual(
+          await performAs(customerB.token, 'post', `${actionPath}/save`, {
+            body: { layoutKey, profile: profileB },
+          }),
+          profileB,
+        );
+        assert.deepEqual(
+          await performAs(customerA.token, 'post', `${actionPath}/save`, {
+            body: { layoutKey, profile: profileAUpdated },
+          }),
+          profileAUpdated,
+        );
+        const profilesA = await app.scope('a-layoutprofile').model.layoutprofile.select({
+          where: { userId: userA, layoutKey },
+        });
+        assert.equal(profilesA.length, 1);
+        assert.deepEqual(profilesA[0].profile, profileAUpdated);
+
+        assert.deepEqual(
+          await performAs(customerB.token, 'get', `${actionPath}/load`, {
+            query: { layoutKey },
+          }),
+          profileB,
+        );
+        assert.equal(
+          await performAs(customerB.token, 'delete', `${actionPath}/reset`, {
+            query: { layoutKey },
+          }),
+          null,
+        );
+        assert.equal(
+          await performAs(customerB.token, 'get', `${actionPath}/load`, {
+            query: { layoutKey },
+          }),
+          undefined,
+        );
+        assert.deepEqual(
+          await performAs(customerA.token, 'get', `${actionPath}/load`, {
+            query: { layoutKey },
+          }),
+          profileAUpdated,
+        );
+      } finally {
+        const userIds = [userA, userB].filter((id): id is TableIdentity => id !== undefined);
+        await deleteOwnedTestData(userIds, layoutKey);
+      }
+    });
+  });
+
+  it('serializes competing first saves for one user and layout key', async () => {
+    const suffix = createTestId();
+    const layoutKey = `/layout-concurrency/${suffix}`;
+    const fixture = await app.bean.executor.mockCtx(async () => {
+      const customer = await registerAndSignin(`layout-concurrency-${suffix}`);
+      return { token: customer.token, userId: customer.user.id };
+    });
+    const profiles = [createProfile('concurrency-a'), createProfile('concurrency-b')];
+    try {
+      const results = await Promise.allSettled(
+        profiles.map(profile =>
+          app.bean.executor.mockCtx(async () => {
+            return await performAs(fixture.token, 'post', `${actionPath}/save`, {
+              body: { layoutKey, profile },
+            });
+          }),
+        ),
+      );
+      assert.equal(results.filter(result => result.status === 'fulfilled').length, profiles.length);
+
+      const persisted = await app.bean.executor.mockCtx(async () => {
+        return await app.scope('a-layoutprofile').model.layoutprofile.select({
+          where: { userId: fixture.userId, layoutKey },
+        });
+      });
+      assert.equal(persisted.length, 1);
+      assert.ok(
+        profiles.some(profile => JSON.stringify(profile) === JSON.stringify(persisted[0].profile)),
+      );
+
+      const loaded = await app.bean.executor.mockCtx(async () => {
+        return await performAs(fixture.token, 'get', `${actionPath}/load`, {
+          query: { layoutKey },
+        });
+      });
+      assert.deepEqual(loaded, persisted[0].profile);
+    } finally {
+      await app.bean.executor.mockCtx(async () => {
+        await deleteOwnedTestData([fixture.userId], layoutKey);
+      });
+    }
+  });
+
+  it('validates the layout key and profile structure at the API boundary', async () => {
+    await app.bean.executor.mockCtx(async () => {
+      const suffix = createTestId();
+      const customer = await registerAndSignin(`layout-validation-${suffix}`);
+      const layoutKey = `/layout-validation/${suffix}`;
+      try {
+        for (const body of [
+          { layoutKey: '', profile: createProfile('invalid-key') },
+          { layoutKey, profile: { ...createProfile('version'), version: 2 } },
+          {
+            layoutKey,
+            profile: {
+              ...createProfile('width'),
+              columns: [{ key: 'name', visible: true, width: 0 }],
+            },
+          },
+          {
+            layoutKey,
+            profile: {
+              ...createProfile('visible'),
+              columns: [{ key: 'name', visible: 'yes', width: 'auto' }],
+            },
+          },
+        ]) {
+          const [, error] = await catchError(() =>
+            performAs(customer.token, 'post', `${actionPath}/save`, { body }),
+          );
+          assert.equal(
+            error?.code,
+            422,
+            `unexpected validation result for ${JSON.stringify(body)}: ${JSON.stringify(error)}`,
+          );
+        }
+      } finally {
+        await deleteOwnedTestData([customer.user.id], layoutKey);
+      }
+    });
+  });
+});

package/vona/src/suite-vendor/a-cabloy/modules/a-layoutprofile/tsconfig.build.json

@@ -0,0 +1,11 @@
+{
+  "extends": "../../tsconfig.base",
+  "compilerOptions": {
+    "rootDir": "src",
+    "declaration": true,
+    "declarationMap": true,
+    "emitDeclarationOnly": true,
+    "outDir": "dist"
+  },
+  "include": ["src", "src/.metadata/*.ts", "src/**/*.json"]
+}

package/vona/src/suite-vendor/a-cabloy/modules/a-layoutprofile/tsconfig.json

@@ -0,0 +1,7 @@
+{
+  "extends": "../../tsconfig.base",
+  "compilerOptions": {
+    "noEmit": true
+  },
+  "include": ["src", "src/.metadata/*.ts", "src/**/*.json", "test"]
+}

package/vona/src/suite-vendor/a-cabloy/package.json

@@ -1,6 +1,6 @@
 {
   "name": "vona-suite-a-cabloy",
-  "version": "5.1.52",
+  "version": "5.1.53",
   "gitHead": "a79189b882c17af5911573896a781bbb0046d37d",
   "description": "",
   "author": "",
@@ -8,6 +8,7 @@
   "type": "module",
   "dependencies": {
     "vona-module-a-cabloy": "workspace:^",
+    "vona-module-a-layoutprofile": "^5.0.1",
     "vona-module-a-markdown": "^5.0.3",
     "vona-module-a-rbac": "^5.0.6",
     "vona-module-a-socket": "workspace:^",

package/vona/src/suite-vendor/a-cabloy/tsconfig.json

@@ -28,6 +28,9 @@
     },
     {
       "path": "modules/a-rbac/tsconfig.build.json"
+    },
+    {
+      "path": "modules/a-layoutprofile/tsconfig.build.json"
     }
   ],
   "exclude": ["modules"]

package/zova/packages-zova/zova/package.json

@@ -1,6 +1,6 @@
 {
   "name": "zova",
-  "version": "5.1.161",
+  "version": "5.1.162",
   "gitHead": "2c5c19284bab738e492856189acb6fad74b8a7b7",
   "description": "A vue3 framework with ioc",
   "keywords": [
@@ -46,7 +46,7 @@
   },
   "dependencies": {
     "zova-core": "^5.1.89",
-    "zova-suite-a-zova": "^5.1.160"
+    "zova-suite-a-zova": "^5.1.161"
   },
   "devDependencies": {
     "clean-package": "^2.2.0",

package/zova/pnpm-lock.yaml

@@ -77,7 +77,7 @@ importers:
         version: 10.6.0(postcss@8.5.28)
       axios:
         specifier: ^1.18.1
-        version: 1.20.0(supports-color@10.2.2)
+        version: 1.20.0
       compression:
         specifier: ^1.8.1
         version: 1.8.2
@@ -171,6 +171,9 @@ importers:
       zova-module-a-interceptor:
         specifier: workspace:^
         version: link:src/suite-vendor/a-zova/modules/a-interceptor
+      zova-module-a-layoutprofile:
+        specifier: workspace:^
+        version: link:src/suite-vendor/a-cabloy/modules/a-layoutprofile
       zova-module-a-logger:
         specifier: workspace:^
         version: link:src/suite-vendor/a-zova/modules/a-logger
@@ -363,7 +366,7 @@ importers:
     devDependencies:
       '@cabloy/cli':
         specifier: ^3.1.29
-        version: 3.1.29(supports-color@10.2.2)(vue@3.5.42(typescript@5.9.3))
+        version: 3.1.29(vue@3.5.42(typescript@5.9.3))
       '@cabloy/lint':
         specifier: ^5.1.32
         version: 5.1.32(@typescript-eslint/eslint-plugin@8.70.0(@typescript-eslint/parser@8.70.0(eslint@10.10.0(jiti@2.7.0))(supports-color@10.2.2)(typescript@5.9.3))(eslint@10.10.0(jiti@2.7.0))(typescript@5.9.3))(@typescript-eslint/typescript-estree@8.70.0(typescript@5.9.3))(@typescript-eslint/utils@8.70.0(eslint@10.10.0(jiti@2.7.0))(typescript@5.9.3))(eslint@10.10.0(jiti@2.7.0))(oxfmt@0.62.0)(oxlint@1.82.0)(supports-color@10.2.2)(typescript@5.9.3)(vue-eslint-parser@10.4.1(eslint@10.10.0(jiti@2.7.0)))
@@ -438,7 +441,7 @@ importers:
     dependencies:
       '@cabloy/cli':
         specifier: ^3.1.29
-        version: 3.1.29(supports-color@10.2.2)(vue@3.5.42(typescript@5.9.3))
+        version: 3.1.29(vue@3.5.42(typescript@5.9.3))
       '@cabloy/process-helper':
         specifier: ^3.1.8
         version: 3.1.8
@@ -472,7 +475,7 @@ importers:
         version: 7.29.7(@babel/core@7.29.7)
       '@cabloy/cli':
         specifier: ^3.1.29
-        version: 3.1.29(supports-color@10.2.2)(vue@3.5.42(typescript@5.9.3))
+        version: 3.1.29(vue@3.5.42(typescript@5.9.3))
       '@cabloy/extend':
         specifier: ^3.2.8
         version: 3.2.8
@@ -870,7 +873,7 @@ importers:
         specifier: ^5.1.89
         version: link:../zova-core
       zova-suite-a-zova:
-        specifier: ^5.1.158
+        specifier: ^5.1.161
         version: link:../../src/suite-vendor/a-zova
     devDependencies:
       clean-package:
@@ -973,13 +976,25 @@ importers:
 
   src/suite-vendor/a-cabloy:
     dependencies:
+      zova-module-a-layoutprofile:
+        specifier: ^5.0.2
+        version: link:modules/a-layoutprofile
       zova-module-a-rbac:
         specifier: ^5.0.1
         version: link:modules/a-rbac
       zova-module-rest-resource:
-        specifier: ^5.1.52
+        specifier: ^5.1.54
         version: link:modules/rest-resource
 
+  src/suite-vendor/a-cabloy/modules/a-layoutprofile:
+    devDependencies:
+      clean-package:
+        specifier: ^2.2.0
+        version: 2.2.0
+      rimraf:
+        specifier: ^6.1.3
+        version: 6.1.3
+
   src/suite-vendor/a-cabloy/modules/a-rbac:
     devDependencies:
       clean-package:
@@ -1058,7 +1073,7 @@ importers:
         specifier: ^5.1.26
         version: link:modules/a-app
       zova-module-a-bean:
-        specifier: ^5.1.33
+        specifier: ^5.1.35
         version: link:modules/a-bean
       zova-module-a-behavior:
         specifier: ^5.1.26
@@ -1094,19 +1109,19 @@ importers:
         specifier: ^5.1.36
         version: link:modules/a-model
       zova-module-a-openapi:
-        specifier: ^5.1.53
+        specifier: ^5.1.54
         version: link:modules/a-openapi
       zova-module-a-router:
-        specifier: ^5.1.35
+        specifier: ^5.1.37
         version: link:modules/a-router
       zova-module-a-routerstack:
-        specifier: ^5.1.27
+        specifier: ^5.1.29
         version: link:modules/a-routerstack
       zova-module-a-routertabs:
         specifier: ^5.1.34
         version: link:modules/a-routertabs
       zova-module-a-ssr:
-        specifier: ^5.1.38
+        specifier: ^5.1.39
         version: link:modules/a-ssr
       zova-module-a-ssrhmr:
         specifier: ^5.1.23
@@ -1118,7 +1133,7 @@ importers:
         specifier: ^5.1.35
         version: link:modules/a-style
       zova-module-a-table:
-        specifier: ^5.1.40
+        specifier: ^5.1.43
         version: link:modules/a-table
       zova-module-a-zod:
         specifier: ^5.1.37
@@ -1198,7 +1213,7 @@ importers:
     dependencies:
       axios:
         specifier: ^1.18.1
-        version: 1.20.0(supports-color@10.2.2)
+        version: 1.20.0
     devDependencies:
       clean-package:
         specifier: ^2.2.0
@@ -1471,7 +1486,7 @@ importers:
     devDependencies:
       '@cabloy/cli':
         specifier: ^3.1.29
-        version: 3.1.29(supports-color@10.2.2)(vue@3.5.42(typescript@5.9.3))
+        version: 3.1.29(vue@3.5.42(typescript@5.9.3))
       '@types/luxon':
         specifier: ^3.7.1
         version: 3.7.5
@@ -8814,7 +8829,7 @@ snapshots:
 
   '@bufbuild/protobuf@2.15.0': {}
 
-  '@cabloy/cli@3.1.29(supports-color@10.2.2)(vue@3.5.42(typescript@5.9.3))':
+  '@cabloy/cli@3.1.29(vue@3.5.42(typescript@5.9.3))':
     dependencies:
       '@babel/parser': 7.29.8
       '@cabloy/module-glob': 5.3.18
@@ -8823,7 +8838,7 @@ snapshots:
       '@cabloy/utils': 2.1.27
       '@cabloy/word-utils': link:packages-utils/word-utils
       '@npmcli/config': 10.12.0
-      '@zhennann/common-bin': 4.0.1(supports-color@10.2.2)
+      '@zhennann/common-bin': 4.0.1
       '@zhennann/ejs': 3.0.1
       boxen: 4.2.0
       chalk: 3.0.0
@@ -11011,7 +11026,7 @@ snapshots:
 
   '@vue/shared@3.5.13': {}
 
-  '@zhennann/common-bin@4.0.1(supports-color@10.2.2)':
+  '@zhennann/common-bin@4.0.1':
     dependencies:
       chalk: 4.1.2
       change-case: 4.1.2
@@ -11045,7 +11060,7 @@ snapshots:
 
   acorn@8.18.0: {}
 
-  agent-base@6.0.2(supports-color@10.2.2):
+  agent-base@6.0.2:
     dependencies:
       debug: 4.4.3(supports-color@10.2.2)
     transitivePeerDependencies:
@@ -11153,11 +11168,11 @@ snapshots:
     dependencies:
       possible-typed-array-names: 1.1.0
 
-  axios@1.20.0(supports-color@10.2.2):
+  axios@1.20.0:
     dependencies:
       follow-redirects: 1.16.0
       form-data: 4.0.6
-      https-proxy-agent: 5.0.1(supports-color@10.2.2)
+      https-proxy-agent: 5.0.1
       proxy-from-env: 2.1.0
     transitivePeerDependencies:
       - debug
@@ -12552,9 +12567,9 @@ snapshots:
       statuses: 2.0.2
       toidentifier: 1.0.1
 
-  https-proxy-agent@5.0.1(supports-color@10.2.2):
+  https-proxy-agent@5.0.1:
     dependencies:
-      agent-base: 6.0.2(supports-color@10.2.2)
+      agent-base: 6.0.2
       debug: 4.4.3(supports-color@10.2.2)
     transitivePeerDependencies:
       - supports-color

package/zova/src/suite/a-home/modules/home-base/src/service/ssrLayout.ts

@@ -37,17 +37,26 @@ export class ServiceSsrLayout extends BeanBase {
             `<script id="__leftDrawerOpenJS">
   ${this.options?.sidebarLeftOpenPCCapability ? this._getJsHandlerSidebar() : ''}
   ${this._getJsHandlerPageContainer()}
-  window.ssr_body_ready_handler=()=>{
-    ${this.options?.sidebarLeftOpenPCCapability ? 'window.ssr_body_ready_handler_sidebar();' : ''}
-    window.ssr_body_ready_handler_pageContainer();
+  window.ssr_body_ready_handler=__targets=>{
+    ${this.options?.sidebarLeftOpenPCCapability ? 'window.ssr_body_ready_handler_sidebar(__targets);' : ''}
+    window.ssr_body_ready_handler_pageContainer(__targets);
   };
   window.ssr_body_ready_condition=()=>{
+    const __domDrawerContainer=document.querySelector('#q-app>.drawer');
     const __domPageContainer=document.querySelector('#q-app>.drawer>.drawer-content');
-    return __domPageContainer;
+    ${this.options?.sidebarLeftOpenPCCapability ? "const __domDrawer=document.querySelector('#q-app>.drawer>.drawer-side');" : ''}
+    return __domDrawerContainer&&__domPageContainer${this.options?.sidebarLeftOpenPCCapability ? '&&__domDrawer' : ''}?{
+      drawerContainer:__domDrawerContainer,
+      pageContainer:__domPageContainer,
+      ${this.options?.sidebarLeftOpenPCCapability ? 'drawer:__domDrawer,' : ''}
+    }:undefined;
   };
-  window.ssr_body_ready_callback=()=>{
-    window.ssr_body_ready_handler();
-    document.querySelector('#__leftDrawerOpenJS').remove();
+  window.ssr_body_ready_callback=__targets=>{
+    try{
+      window.ssr_body_ready_handler(__targets);
+    }finally{
+      document.querySelector('#__leftDrawerOpenJS')?.remove();
+    }
   };
 </script>`.replaceAll('\n', '') + getBodyReadyObserverScript();
         }
@@ -61,7 +70,7 @@ export class ServiceSsrLayout extends BeanBase {
   }
 
   private _getJsHandlerSidebar() {
-    return `window.ssr_body_ready_handler_sidebar=()=>{
+    return `window.ssr_body_ready_handler_sidebar=__targets=>{
       const __belowBreakpoint=document.documentElement.clientWidth <= ${this.options?.sidebarBreakpoint};
       let __leftDrawerOpen;
       if(__belowBreakpoint){
@@ -70,10 +79,11 @@ export class ServiceSsrLayout extends BeanBase {
         const __leftDrawerOpenPC=window.ssr_load_local('sidebarLeftOpenPC');
         __leftDrawerOpen=__leftDrawerOpenPC!==undefined?__leftDrawerOpenPC:${this.options?.sidebarLeftOpenPCFallback ?? false};
       }
-      const __domDrawerContainer=document.querySelector('#q-app>.drawer');
-      const __domDrawer=document.querySelector('#q-app>.drawer>.drawer-side');
+      const __domDrawerContainer=__targets?.drawerContainer;
+      const __domDrawer=__targets?.drawer;
       const sidebarWidth = '${this.scope.config.layout.sidebar.width}px';
       const navbarHeight = '${this.scope.config.layout.navbar.height}px';
+      if(!__domDrawerContainer||!__domDrawer)return;
       if(__leftDrawerOpen){
         __domDrawer.style.transform='translateX(0px)';
         __domDrawer.style.width=sidebarWidth;