underpost 3.2.8 → 3.2.9

package/src/cli/run.js

@@ -110,6 +110,10 @@ const logger = loggerFactory(import.meta);
  * @property {string|Array<{ip: string, hostnames: string[]}>} hostAliases - Adds entries to the Pod /etc/hosts via Kubernetes hostAliases.
  *   As a string (CLI): semicolon-separated entries of "ip=hostname1,hostname2" (e.g., "127.0.0.1=foo.local,bar.local;10.1.2.3=foo.remote").
  *   As an array (programmatic): objects with `ip` and `hostnames` fields (e.g., [{ ip: "127.0.0.1", hostnames: ["foo.local"] }]).
+ * @property {boolean} gitClean - Whether to perform a `git clean` before running.
+ * @property {boolean} copy - Whether to copy the command to the clipboard instead of executing it.
+ * @property {boolean} skipFullBuild - Whether to skip the full client bundle build during deployment (supported by: sync, template-deploy).
+ * @property {boolean} pullBundle - Whether to pull the bundle before running. Use together with --skip-full-build to skip the local build entirely (supported by: sync, template-deploy).
  * @memberof UnderpostRun
  */
 const DEFAULT_OPTION = {
@@ -174,6 +178,8 @@ const DEFAULT_OPTION = {
   hostAliases: '',
   gitClean: false,
   copy: false,
+  skipFullBuild: false,
+  pullBundle: false,
 };
 
 /**
@@ -435,6 +441,15 @@ class UnderpostRun {
         deployType = 'init';
       }
 
+      // If --build is set and path is a sync-engine-* target, push the pre-built client bundle
+      // to Cloudinary so the remote container can pull it instead of rebuilding from source.
+      if (options.build && deployConfId && deployConfId.startsWith('engine-')) {
+        const confName = deployConfId.replace(/^engine-/, '');
+        const pushDeployId = options.deployId || `dd-${confName}`;
+        logger.info(`[template-deploy] Running push-bundle for deployId: ${pushDeployId}`);
+        shellExec(`${baseCommand} run push-bundle --deploy-id ${pushDeployId}`);
+      }
+
       // Dispatch npmpkg CI workflow — this builds pwa-microservices-template first.
       // If deployConfId is set, npmpkg.ci.yml will dispatch the engine-<conf-id> CI
       // with sync=true after template build completes. The engine CI then dispatches
@@ -683,12 +698,15 @@ echo -e "[code]\nname=Visual Studio Code\nbaseurl=https://packages.microsoft.com
         : '';
       const gitCleanFlag = options.gitClean ? ' --git-clean' : '';
 
+      const skipFullBuildFlag = options.skipFullBuild ? ' --skip-full-build' : '';
+      const pullBundleFlag = options.pullBundle ? ' --pull-bundle' : '';
+
       shellExec(
         `${baseCommand} deploy${clusterFlag} --build-manifest --sync --info-router --replicas ${replicas} --node ${node}${
           image ? ` --image ${image}` : ''
         }${versions ? ` --versions ${versions}` : ''}${
           options.namespace ? ` --namespace ${options.namespace}` : ''
-        }${timeoutFlags}${cmdString}${gitCleanFlag} ${deployId} ${env}`,
+        }${timeoutFlags}${cmdString}${gitCleanFlag}${skipFullBuildFlag}${pullBundleFlag} ${deployId} ${env}`,
       );
 
       if (isDeployRunnerContext(path, options)) {
@@ -1288,6 +1306,44 @@ EOF
       shellExec(`${options.underpostRoot}/scripts/rocky-setup.sh${options.dev ? ' --install-dev' : ``}`);
     },
 
+    /**
+     * @method install-crio
+     * @description Installs and configures CRI-O as the container runtime for kubeadm clusters.
+     * Adds the stable v1.33 CRI-O yum repository, installs the `cri-o` package, configures
+     * the systemd cgroup driver, enables the `crio` service, and writes `/etc/crictl.yaml`
+     * so that `crictl` targets the CRI-O socket by default.
+     * @param {string} path - Unused.
+     * @param {Object} options - The default underpost runner options for customizing workflow.
+     * @memberof UnderpostRun
+     */
+    'install-crio': (path, options = DEFAULT_OPTION) => {
+      logger.info('Installing CRI-O...');
+      shellExec(`cat <<EOF | sudo tee /etc/yum.repos.d/cri-o.repo
+[cri-o]
+name=CRI-O
+baseurl=https://download.opensuse.org/repositories/isv:/cri-o:/stable:/v1.33/rpm/
+enabled=1
+gpgcheck=1
+gpgkey=https://download.opensuse.org/repositories/isv:/cri-o:/stable:/v1.33/rpm/repodata/repomd.xml.key
+EOF`);
+      shellExec(`sudo dnf -y install cri-o`);
+      // crictl is in the kubernetes repo but excluded by default — install it explicitly
+      shellExec(`sudo yum install -y cri-tools --disableexcludes=kubernetes`);
+      // Ensure CRI-O uses systemd cgroup driver (matches kubelet default)
+      shellExec(
+        `sudo sed -i 's/^#\?cgroup_manager =.*/cgroup_manager = "systemd"/' /etc/crio/crio.conf 2>/dev/null || true`,
+      );
+      shellExec(`sudo systemctl enable --now crio`);
+      logger.info('CRI-O installed and started.');
+      // Write crictl config so all crictl calls default to the CRI-O socket
+      shellExec(`cat <<EOF | sudo tee /etc/crictl.yaml
+runtime-endpoint: unix:///var/run/crio/crio.sock
+image-endpoint: unix:///var/run/crio/crio.sock
+timeout: 10
+debug: false
+EOF`);
+    },
+
     /**
      * @method dd-container
      * @description Deploys a development or debug container tasks jobs, setting up necessary volumes and images, and running specified commands within the container.
@@ -1430,6 +1486,9 @@ EOF
     /**
      * @method promote
      * @description Switches traffic between blue/green deployments for a specified deployment ID(s) (uses `dd.router` for 'dd', or a specific ID).
+     * When `--tls` is set, rebuilds the proxy manifest with `--cert` so the HTTPProxy includes
+     * TLS config, deletes stale Certificate resources, then reapplies the proxy and secret.yaml
+     * (cert-manager Certificate resources) for each affected deployment.
      * @param {string} path - The input value, identifier, or path for the operation (used as a comma-separated string: `deployId,env,replicas`).
      * @param {Object} options - The default underpost runner options for customizing workflow
      * @memberof UnderpostRun
@@ -1438,11 +1497,34 @@ EOF
       let [inputDeployId, inputEnv, inputReplicas] = path.split(',');
       if (!inputEnv) inputEnv = 'production';
       if (!inputReplicas) inputReplicas = 1;
+      // TODO: normalize: --tls maps to --cert for deploy.js isValidTLSContext compatibility
+      if (options.tls) options.cert = true;
+
+      const applyCerts = (deployId, targetTraffic) => {
+        if (!options.tls) return;
+        // Rebuild proxy.yaml with --cert so the HTTPProxy includes TLS virtualhost config
+        shellExec(
+          `node bin deploy --build-manifest --cert --traffic ${targetTraffic} --replicas ${inputReplicas} --namespace ${options.namespace} ${deployId} ${inputEnv}`,
+        );
+        // Delete stale Certificate resources before reapplying
+        const confServerPath = `./engine-private/conf/${deployId}/conf.server.json`;
+        if (fs.existsSync(confServerPath)) {
+          for (const host of Object.keys(JSON.parse(fs.readFileSync(confServerPath, 'utf8'))))
+            shellExec(`sudo kubectl delete Certificate ${host} -n ${options.namespace} --ignore-not-found`);
+        }
+        shellExec(
+          `sudo kubectl apply -f ./engine-private/conf/${deployId}/build/${inputEnv}/proxy.yaml -n ${options.namespace}`,
+        );
+        const secretPath = `./engine-private/conf/${deployId}/build/${inputEnv}/secret.yaml`;
+        if (fs.existsSync(secretPath)) shellExec(`kubectl apply -f ${secretPath} -n ${options.namespace}`);
+      };
+
       if (inputDeployId === 'dd') {
         for (const deployId of fs.readFileSync(`./engine-private/deploy/dd.router`, 'utf8').split(',')) {
           const currentTraffic = Underpost.deploy.getCurrentTraffic(deployId, { namespace: options.namespace });
           const targetTraffic = currentTraffic === 'blue' ? 'green' : 'blue';
           Underpost.deploy.switchTraffic(deployId, inputEnv, targetTraffic, inputReplicas, options.namespace, options);
+          applyCerts(deployId, targetTraffic);
         }
       } else {
         const currentTraffic = Underpost.deploy.getCurrentTraffic(inputDeployId, { namespace: options.namespace });
@@ -1455,6 +1537,7 @@ EOF
           options.namespace,
           options,
         );
+        applyCerts(inputDeployId, targetTraffic);
       }
     },
     /**
@@ -2371,9 +2454,11 @@ EOF`;
     /**
      * @method pull-bundle
      * @description Downloads split zip parts from file storage, merges and extracts them, and moves the result into the public directory.
-     *   Steps: set cron env, download parts (omit-unzip), merge zip, unzip, remove zip, move to public/<host>.
-     * @param {string} path - Optional host name(s) used to locate zip(s) and as public destination(s) (e.g. 'underpost.net' or 'a.com,b.com').
-     *   If omitted, hosts are loaded from `engine-private/conf/<deployId>/conf.server.json`.
+     *   Steps: set env, download parts (omit-unzip), merge zip, unzip, remove zip + parts, move to public/<host>[/path].
+     *   Iterates over every non-singleReplica, non-redirect, non-disabledRebuild route in conf.server.json
+     *   so that multi-path deployments are handled correctly.
+     * @param {string} path - Optional comma-separated host name(s) to restrict processing (e.g. 'underpost.net' or 'a.com,b.com').
+     *   If omitted, all hosts from `engine-private/conf/<deployId>/conf.server.json` are used.
      * @param {Object} options - The default underpost runner options for customizing workflow.
      * @param {string} [options.deployId] - Deploy ID for storage lookup (defaults to 'dd-default').
      * @param {boolean} [options.dev] - Use development environment; defaults to production.
@@ -2384,21 +2469,16 @@ EOF`;
       const env = options.dev ? 'development' : 'production';
       const deployId = options.deployId || 'dd-default';
       const confServerPath = `./engine-private/conf/${deployId}/conf.server.json`;
-      const hosts = path
+      const confServer = fs.existsSync(confServerPath) ? loadConfServerJson(confServerPath) : {};
+      const hostsArg = path
         ? path
             .split(',')
             .map((h) => h.trim())
             .filter(Boolean)
-        : fs.existsSync(confServerPath)
-          ? Object.keys(loadConfServerJson(confServerPath))
-          : [];
+        : Object.keys(confServer);
 
-      if (hosts.length === 0) {
-        logger.error('pull-bundle: no hosts resolved', {
-          deployId,
-          path,
-          confServerPath,
-        });
+      if (hostsArg.length === 0) {
+        logger.error('pull-bundle: no hosts resolved', { deployId, path, confServerPath });
         return;
       }
 
@@ -2407,28 +2487,62 @@ EOF`;
       shellExec(
         `${baseCommand} fs build --recursive --deploy-id ${deployId} --storage-file-path engine-private/conf/${deployId}/storage.bundle.json --pull --omit-unzip`,
       );
-      for (const host of hosts) {
-        const zipPath = `build/${host}-.zip`;
-        const hasZip = fs.existsSync(zipPath);
-        const hasParts =
-          fs.existsSync('./build') &&
-          fs
-            .readdirSync('./build')
-            .some((name) => name.startsWith(`${host}-.zip.part`) || name.startsWith(`${host}-.zip-part`));
-
-        if (!hasZip && !hasParts) {
-          logger.warn(`Bundle not found for host '${host}'. Skipping host.`, {
-            zipPath,
-            deployId,
-          });
-          continue;
-        }
 
-        if (hasParts) shellExec(`${baseCommand} client --merge-zip ${zipPath}`);
-        shellExec(`${baseCommand} client --unzip ${zipPath}`);
-        shellExec(`sudo rm -rf ${zipPath}`);
-        if (fs.existsSync(`public/${host}`)) shellExec(`sudo rm -rf public/${host}`);
-        shellExec(`sudo mv build/${host} public/${host}`);
+      for (const host of hostsArg) {
+        // Gather all routes for this host; fall back to root '/' when host is not in confServer
+        // (e.g. when hosts were provided explicitly via the path argument).
+        const routePaths = confServer[host] ? Object.keys(confServer[host]) : ['/'];
+
+        for (const routePath of routePaths) {
+          const routeConf = confServer[host] ? confServer[host][routePath] || {} : {};
+          // Skip routes that are not built by buildClient (mirrors buildClient skip conditions)
+          if (routeConf.singleReplica || routeConf.redirect || routeConf.disabledRebuild) continue;
+
+          // buildClient names the zip as "<host>-<path-no-slashes>.zip"
+          // e.g. host="underpost.net", path="/" → buildId="underpost.net-", zip="build/underpost.net-.zip"
+          // e.g. host="app.net", path="/admin" → buildId="app.net-admin", zip="build/app.net-admin.zip"
+          const buildId = `${host}-${routePath.replaceAll('/', '')}`;
+          const zipPath = `build/${buildId}.zip`;
+          const buildDir = './build';
+          const hasZip = fs.existsSync(zipPath);
+          const hasParts =
+            fs.existsSync(buildDir) &&
+            fs
+              .readdirSync(buildDir)
+              .some((name) => name.startsWith(`${buildId}.zip.part`) || name.startsWith(`${buildId}.zip-part`));
+
+          if (!hasZip && !hasParts) {
+            logger.warn(`Bundle not found for '${host}${routePath}'. Skipping.`, { zipPath, deployId });
+            continue;
+          }
+
+          if (hasParts) shellExec(`${baseCommand} client --merge-zip ${zipPath}`);
+          shellExec(`${baseCommand} client --unzip ${zipPath}`);
+          shellExec(`sudo rm -rf ${zipPath}`);
+
+          // Clean up downloaded part wrapper zips left by --omit-unzip pull
+          if (fs.existsSync(buildDir)) {
+            fs.readdirSync(buildDir)
+              .filter((name) => name.startsWith(`${buildId}.zip.part`) || name.startsWith(`${buildId}.zip-part`))
+              .forEach((partFile) => shellExec(`sudo rm -rf ${buildDir}/${partFile}`));
+          }
+
+          // unzipClientBuild extracts to buildId with trailing '-' stripped
+          // e.g. "build/underpost.net-" → "build/underpost.net"
+          // e.g. "build/app.net-admin" → "build/app.net-admin" (no trailing dash, no change)
+          const extractedDir = `build/${buildId.replace(/-$/, '')}`;
+          if (!fs.existsSync(extractedDir)) {
+            logger.warn(`Extracted build dir not found: ${extractedDir}. Skipping move for '${host}${routePath}'.`);
+            continue;
+          }
+
+          // Destination mirrors the public directory layout used by the server
+          const publicDestPath = routePath === '/' ? `public/${host}` : `public/${host}${routePath}`;
+          if (fs.existsSync(publicDestPath)) shellExec(`sudo rm -rf ${publicDestPath}`);
+          // Ensure parent directory exists for sub-paths
+          if (routePath !== '/') shellExec(`sudo mkdir -p public/${host}`);
+          shellExec(`sudo mv ${extractedDir} ${publicDestPath}`);
+        }
       }
     },
   };

package/src/client/components/core/Auth.js

@@ -255,9 +255,11 @@ class Auth {
    * @returns {Promise<object>} A promise resolving to the newly created guest session data.
    */
   async sessionOut() {
-    // 1. End User Session
+    // 1. End User Session — skip the network call when there is no active user session
+    // (avoids a wasted DELETE round-trip for guests / new visitors)
+    const hasUserSession = !!GuestService.getUserToken();
     try {
-      const result = await UserService.delete({ id: 'logout' });
+      const result = hasUserSession ? await UserService.delete({ id: 'logout' }) : null;
       SearchBox.RecentResults.clear();
       this.deleteToken();
       if (this.#refreshTimeout) {
@@ -267,7 +269,7 @@ class Auth {
       this.renderGuestUi();
       // Reset user data in the LogIn state/model
       LogIn.Scope.user.main.model.user = {};
-      await LogOut.Trigger(result);
+      if (result) await LogOut.Trigger(result);
     } catch (error) {
       logger.error('Error during user logout:', error);
     }
@@ -279,8 +281,16 @@ class Auth {
 
       if (result.status === 'success' && result.data.token) {
         this.setGuestToken(result.data.token);
-        // Recursively call sessionIn to complete the guest login process (UI update, etc.)
-        return await this.sessionIn();
+        // Use the POST response data directly — avoids a redundant GET /user/auth
+        // round-trip that would otherwise re-verify the token we just received.
+        await GuestService.setMeta('guest-session', {
+          role: result.data.user?.role,
+          userId: result.data.user?._id,
+        });
+        LogIn.Scope.user.main.model.user = {};
+        await LogIn.Trigger(result.data);
+        await Account.updateForm(result.data.user);
+        return result.data;
       } else {
         logger.error('Failed to get a new guest token.');
         return { user: UserMock.default };

package/src/client/components/core/Docs.js

@@ -1,9 +1,7 @@
-import { Badge } from './Badge.js';
-import { BtnIcon } from './BtnIcon.js';
-import { Css, darkTheme, renderCssAttr, simpleIconsRender, ThemeEvents, Themes } from './Css.js';
-import { buildBadgeToolTipMenuOption, Modal, renderViewTitle } from './Modal.js';
+import { Css, darkTheme, simpleIconsRender, ThemeEvents, Themes } from './Css.js';
+import { Modal, renderViewTitle } from './Modal.js';
 import { listenQueryPathInstance, setQueryPath, closeModalRouteChangeEvent, getProxyPath } from './Router.js';
-import { htmls, s, sIframe } from './VanillaJs.js';
+import { s, sIframe } from './VanillaJs.js';
 // https://mintlify.com/docs/quickstart
 class Docs {
   static async RenderModal(type) {
@@ -289,41 +287,15 @@ class Docs {
         },
       });
     });
-    let docMenuRender = '';
+    // Register theme events for items that have them (Docs-specific concern)
     for (const docData of Docs.Data) {
       if (docData.themeEvent) {
         ThemeEvents[`doc-icon-${docData.type}`] = docData.themeEvent;
         setTimeout(ThemeEvents[`doc-icon-${docData.type}`]);
       }
-      let tabHref, style, labelStyle;
-      switch (docData.type) {
-        case 'repo':
-        case 'coverage-link':
-          style = renderCssAttr({ style: { height: '45px' } });
-          labelStyle = renderCssAttr({ style: { top: '8px', left: '9px' } });
-          break;
-        default:
-          break;
-      }
-      tabHref = docData.url();
-      const subMenuIcon =
-        options.subMenuIcon && typeof options.subMenuIcon === 'function'
-          ? options.subMenuIcon(docData.type)
-          : docData.icon;
-      docMenuRender += html`
-        ${await BtnIcon.instance({
-          class: `in wfa main-btn-menu submenu-btn btn-docs btn-docs-${docData.type}`,
-          label: html`<span class="inl menu-btn-icon">${subMenuIcon}</span
-            ><span class="menu-label-text menu-label-text-docs"> ${docData.text} </span>`,
-          tabHref,
-          tooltipHtml: await Badge.instance(buildBadgeToolTipMenuOption(docData.text, 'right')),
-          useMenuBtn: true,
-        })}
-      `;
     }
-    // s(`.menu-btn-container-children`).classList.remove('hide');
-    // htmls(`.nav-path-display-${'modal-menu'}`, location.pathname);
-    htmls('.menu-btn-container-children-docs', docMenuRender);
+    // Build submenu items and populate — submenu system is owned by Modal
+    Modal.subMenuPopulate('docs', await Modal.buildSubMenuItemsHtml('docs', Docs.Data, options));
     {
       const docsData = [
         {

package/src/client/components/core/FileExplorer.js

@@ -469,12 +469,12 @@ class FileExplorer {
       async init(params) {
         console.log('LoadFileActionsRenderer created', params);
         // params.data._id
-        FileExplorer.eGui = document.createElement('div');
+        this.eGui = document.createElement('div');
         const isPublic = params.data.isPublic;
         const toggleId = `toggle-public-${params.data._id}`;
         const hasGenericFile = !!params.data.hasGenericFile;
         const hasMdFile = !!params.data.hasMdFile;
-        FileExplorer.eGui.innerHTML = html`
+        this.eGui.innerHTML = html`
           <div class="fl">
             ${await BtnIcon.instance({
               class: `in fll management-table-btn-mini btn-file-download-${params.data._id}${!hasGenericFile ? ' btn-disabled' : ''}`,
@@ -981,7 +981,7 @@ class FileExplorer {
         });
       }
       getGui() {
-        return FileExplorer.eGui;
+        return this.eGui;
       }
       refresh(params) {
         console.log('LoadFileActionsRenderer refreshed', params);
@@ -994,8 +994,8 @@ class FileExplorer {
         console.log('LoadFolderActionsRenderer created', params);
         // params.data._id
         const id = params.data.locationId;
-        FileExplorer.eGui = document.createElement('div');
-        FileExplorer.eGui.innerHTML = html`
+        this.eGui = document.createElement('div');
+        this.eGui.innerHTML = html`
           <div class="fl">
             ${await BtnIcon.instance({
               class: `in fll management-table-btn-mini btn-folder-delete-${id}`,
@@ -1058,7 +1058,7 @@ class FileExplorer {
         });
       }
       getGui() {
-        return FileExplorer.eGui;
+        return this.eGui;
       }
       refresh(params) {
         console.log('LoadFolderActionsRenderer refreshed', params);

package/src/client/components/core/Modal.js

@@ -1789,6 +1789,12 @@ class Modal {
             if (options.onCollapseMenu) options.onCollapseMenu();
             s(`.sub-menu-title-container-${'modal-menu'}`).classList.add('hide');
             s(`.nav-path-container-${'modal-menu'}`).classList.add('hide');
+            // Shrink any already-open submenu containers to icon-only width
+            Object.keys(Modal.subMenuBtnClass).forEach((subMenuId) => {
+              const container = s(`.menu-btn-container-children-${subMenuId}`);
+              if (container && container.style.height && container.style.height !== '0px')
+                container.style.width = `${collapseSlideMenuWidth}px`;
+            });
             Object.keys(this.Data[idModal].onCollapseMenuListener).map((keyListener) =>
               this.Data[idModal].onCollapseMenuListener[keyListener](),
             );
@@ -1806,6 +1812,12 @@ class Modal {
             if (options.onExtendMenu) options.onExtendMenu();
             s(`.sub-menu-title-container-${'modal-menu'}`).classList.remove('hide');
             s(`.nav-path-container-${'modal-menu'}`).classList.remove('hide');
+            // Expand any already-open submenu containers back to full width
+            Object.keys(Modal.subMenuBtnClass).forEach((subMenuId) => {
+              const container = s(`.menu-btn-container-children-${subMenuId}`);
+              if (container && container.style.height && container.style.height !== '0px')
+                container.style.width = `${originSlideMenuWidth}px`;
+            });
             Object.keys(this.Data[idModal].onExtendMenuListener).map((keyListener) =>
               this.Data[idModal].onExtendMenuListener[keyListener](),
             );
@@ -2464,6 +2476,52 @@ class Modal {
     }
   };
 
+  /**
+   * Builds submenu item HTML using the canonical BtnIcon pattern.
+   * Centralises the item-rendering contract so individual submenu owners (e.g. Docs)
+   * only need to supply data — not layout concerns.
+   * @param {string} subMenuId - Submenu identifier (e.g. 'docs')
+   * @param {Array<{type:string, icon:string, text:string, url:function|string}>} items
+   * @param {Object} [options]
+   * @param {function} [options.subMenuIcon] - Optional icon override per item type
+   * @returns {Promise<string>} Rendered HTML string
+   */
+  static buildSubMenuItemsHtml = async (subMenuId, items = [], options = {}) => {
+    let result = '';
+    const _menuMode = Modal.Data['modal-menu']?.options?.mode;
+    const _tooltipSide = options.tooltipSide || (_menuMode === 'slide-menu-right' ? 'right' : 'left');
+    for (const item of items) {
+      const tabHref = typeof item.url === 'function' ? item.url() : item.url || '';
+      const icon =
+        options.subMenuIcon && typeof options.subMenuIcon === 'function' ? options.subMenuIcon(item.type) : item.icon;
+      result += html`${await BtnIcon.instance({
+        class: `in wfa main-btn-menu submenu-btn btn-${subMenuId} btn-${subMenuId}-${item.type}`,
+        label: html`<span class="inl menu-btn-icon">${icon}</span
+          ><span class="menu-label-text menu-label-text-${subMenuId}"> ${item.text} </span>`,
+        tabHref,
+        tooltipHtml: await Badge.instance(buildBadgeToolTipMenuOption(item.text, _tooltipSide)),
+        useMenuBtn: true,
+      })} `;
+    }
+    return result;
+  };
+
+  /**
+   * Injects pre-built submenu item HTML into the submenu container and syncs
+   * the collapse state so labels are hidden when the menu is icon-only.
+   * @param {string} subMenuId
+   * @param {string} itemsHtml
+   */
+  static subMenuPopulate = (subMenuId, itemsHtml) => {
+    htmls(`.menu-btn-container-children-${subMenuId}`, itemsHtml);
+    const _menuMode = Modal.Data['modal-menu']?.options?.mode;
+    const _collapseIndicatorClass =
+      _menuMode === 'slide-menu-right' ? '.btn-icon-menu-mode-left' : '.btn-icon-menu-mode-right';
+    if (s(_collapseIndicatorClass) && !s(_collapseIndicatorClass).classList.contains('hide')) {
+      sa(`.menu-label-text-${subMenuId}`).forEach((el) => el.classList.add('hide'));
+    }
+  };
+
   // Move modal title element into the bar's render container so it aligns with control buttons
   /**
    * Position a modal relative to an anchor element.
@@ -2769,9 +2827,14 @@ const subMenuRender = async (subMenuId) => {
     setTimeout(() => {
       Modal.menuTextLabelAnimation('modal-menu', subMenuId);
     });
-    // Open animation
+    // Open animation — match the current menu width (collapsed = 50px, extended = 320px)
+    const _menuMode = Modal.Data['modal-menu']?.options?.mode;
+    const _collapseIndicatorClass =
+      _menuMode === 'slide-menu-right' ? '.btn-icon-menu-mode-left' : '.btn-icon-menu-mode-right';
+    const _isMenuCollapsed = s(_collapseIndicatorClass) && !s(_collapseIndicatorClass).classList.contains('hide');
+    const _menuContainerWidth = _isMenuCollapsed ? 50 : 320;
     setTimeout(top, 360);
-    menuContainer.style.width = '320px';
+    menuContainer.style.width = `${_menuContainerWidth}px`;
     menuContainer.style.overflow = null;
     menuContainer.style.height = '0px';
     menuContainer.style.height = `${_hBtn * 6}px`;

package/src/client/components/core/Recover.js

@@ -37,7 +37,7 @@ class Recover {
         rules: [{ type: 'isEmpty' }, { type: 'isLength', options: { min: 2, max: 20 } }],
         show: () => false,
         disable: function () {
-          return !Recover.show();
+          return !this.show();
         },
       },
       'recover-email': {
@@ -46,7 +46,7 @@ class Recover {
         rules: [{ type: 'isEmpty' }, { type: 'isEmail' }],
         show: () => mode === 'recover-verify-email',
         disable: function () {
-          return !Recover.show();
+          return !this.show();
         },
       },
       'recover-password': {
@@ -55,7 +55,7 @@ class Recover {
         rules: [{ type: 'isStrongPassword' }],
         show: () => mode === 'change-password',
         disable: function () {
-          return !Recover.show();
+          return !this.show();
         },
       },
       'recover-repeat-password': {
@@ -63,7 +63,7 @@ class Recover {
         rules: [{ type: 'isEmpty' }, { type: 'passwordMismatch', options: `recover-password` }],
         show: () => mode === 'change-password',
         disable: function () {
-          return !Recover.show();
+          return !this.show();
         },
       },
     };

package/src/client/components/core/Worker.js

@@ -161,36 +161,33 @@ class PwaWorker {
 
     this.RouterInstance = typeof router?.instance === 'function' ? router.instance() : router();
     if (this.RouterInstance?.Routes) registerRoutes(this.RouterInstance.Routes);
-    const isInstall = await this.status();
-    if (!isInstall) await this.install();
+    // Defer SW registration entirely out of the render critical path.
+    // Firefox IPC for SW registration is notably slower than Chromium;
+    // scheduling after 'load' means the first meaningful paint is not blocked.
+    this.registerServiceWorkerDeferred();
 
     // ── declarative bootstrap path ──────────────────────────────────────────
-    if (typeof render !== 'function' || render.instance) {
-      // shared core inits
-      if (themes) await Css.loadThemes(themes);
-      await this.runComponentInit(TranslateCore);
-      await this.runComponentInit(translate);
-      await this.runComponentInit(Responsive);
-      // app shell render
-      if (render && typeof render.instance === 'function') {
-        const htmlMainBody = typeof template === 'function' ? template : undefined;
-        await this.runComponentInit(render, htmlMainBody ? { htmlMainBody } : undefined);
-      }
-      // socket init
-      const channels = appStore ? appStore.Data : (session && session.socket && session.socket.Data) || undefined;
-      await this.runComponentInit(SocketIo, { channels, path: socketPath });
-      if (session) {
-        await this.runComponentInit(session.socket);
-        await this.runComponentInit(session.login);
-        await this.runComponentInit(session.logout || session.signout);
-        await this.runComponentInit(session.signup);
-        await this.runComponentInit(session.account);
-      }
-      await this.runComponentInit(Keyboard);
-    } else {
-      // ── legacy raw render callback (backward-compat) ─────────────────────
-      await render();
+    // shared core inits
+    if (themes) await Css.loadThemes(themes);
+    await this.runComponentInit(TranslateCore);
+    await this.runComponentInit(translate);
+    await this.runComponentInit(Responsive);
+    // app shell render
+    if (render && typeof render.instance === 'function') {
+      const htmlMainBody = typeof template === 'function' ? template : undefined;
+      await this.runComponentInit(render, htmlMainBody ? { htmlMainBody } : undefined);
+    }
+    // socket init
+    const channels = appStore ? appStore.Data : (session && session.socket && session.socket.Data) || undefined;
+    await this.runComponentInit(SocketIo, { channels, path: socketPath });
+    if (session) {
+      await this.runComponentInit(session.socket);
+      await this.runComponentInit(session.login);
+      await this.runComponentInit(session.logout || session.signout);
+      await this.runComponentInit(session.signup);
+      await this.runComponentInit(session.account);
     }
+    await this.runComponentInit(Keyboard);
     // ────────────────────────────────────────────────────────────────────────
     await LoadRouter(this.RouterInstance);
     LoadingAnimation.removeSplashScreen();
@@ -316,6 +313,30 @@ class PwaWorker {
     }
   }
 
+  /**
+   * Schedules SW registration to run after the page 'load' event (or immediately
+   * if the page is already loaded). This keeps SW work off the render critical path,
+   * which is the primary cause of Firefox being slower than Chromium on first load.
+   * @memberof PwaWorker
+   * @returns {void}
+   */
+  registerServiceWorkerDeferred() {
+    if (!('serviceWorker' in navigator)) {
+      logger.warn('Service Worker Disabled in browser');
+      return;
+    }
+    const register = () => {
+      this.status().then((isInstall) => {
+        if (!isInstall) this.install();
+      });
+    };
+    if (document.readyState === 'complete') {
+      register();
+    } else {
+      window.addEventListener('load', register, { once: true });
+    }
+  }
+
   /**
    * Checks the current status of all service worker registrations and sets the
    * `updateServiceWorker` function reference if an active worker is found.