@underpostnet/underpost 2.98.0 → 2.98.3

package/src/cli/run.js

@@ -146,111 +146,6 @@ class UnderpostRun {
    * @memberof UnderpostRun
    */
   static RUNNERS = {
-    /**
-     * @method spark-template
-     * @description Creates a new Spark template project using `sbt new` in `/home/dd/spark-template`, initializes a Git repository, and runs `replace_params.sh` and `build.sh`.
-     * @param {string} path - The input value, identifier, or path for the operation.
-     * @param {Object} options - The default underpost runner options for customizing workflow
-     * @memberof UnderpostRun
-     */
-    'spark-template': (path, options = UnderpostRun.DEFAULT_OPTION) => {
-      const dir = '/home/dd/spark-template';
-      shellExec(`sudo rm -rf ${dir}`);
-      shellCd('/home/dd');
-
-      // pbcopy(`cd /home/dd && sbt new ${process.env.GITHUB_USERNAME}/spark-template.g8`);
-      // await read({ prompt: 'Command copy to clipboard, press enter to continue.\n' });
-      shellExec(`cd /home/dd && sbt new ${process.env.GITHUB_USERNAME}/spark-template.g8 '--name=spark-template'`);
-
-      shellCd(dir);
-
-      shellExec(`git init && git add . && git commit -m "Base implementation"`);
-      shellExec(`chmod +x ./replace_params.sh`);
-      shellExec(`chmod +x ./build.sh`);
-
-      shellExec(`./replace_params.sh`);
-      shellExec(`./build.sh`);
-
-      shellCd('/home/dd/engine');
-    },
-    /**
-     * @method rmi
-     * @description Forces the removal of all local Podman images (`podman rmi $(podman images -qa) --force`).
-     * @param {string} path - The input value, identifier, or path for the operation.
-     * @param {Object} options - The default underpost runner options for customizing workflow
-     * @memberof UnderpostRun
-     */
-    rmi: (path, options = UnderpostRun.DEFAULT_OPTION) => {
-      shellExec(`podman rmi $(podman images -qa) --force`);
-    },
-    /**
-     * @method kill
-     * @description Kills processes listening on the specified port(s). If the `path` contains a `+`, it treats it as a range of ports to kill.
-     * @param {string} path - The input value, identifier, or path for the operation (used as the port number).
-     * @param {Object} options - The default underpost runner options for customizing workflow
-     * @memberof UnderpostRun
-     */
-    kill: (path = '', options = UnderpostRun.DEFAULT_OPTION) => {
-      if (options.pid) return shellExec(`sudo kill -9 ${options.pid}`);
-      for (const _path of path.split(',')) {
-        if (_path.split('+')[1]) {
-          let [port, sumPortOffSet] = _path.split('+');
-          port = parseInt(port);
-          sumPortOffSet = parseInt(sumPortOffSet);
-          for (const sumPort of range(0, sumPortOffSet))
-            shellExec(`sudo kill -9 $(lsof -t -i:${parseInt(port) + parseInt(sumPort)})`);
-        } else shellExec(`sudo kill -9 $(lsof -t -i:${_path})`);
-      }
-    },
-    /**
-     * @method secret
-     * @description Creates an Underpost secret named 'underpost' from a file, defaulting to `/home/dd/engine/engine-private/conf/dd-cron/.env.production` if no path is provided.
-     * @param {string} path - The input value, identifier, or path for the operation (used as the optional path to the secret file).
-     * @param {Object} options - The default underpost runner options for customizing workflow
-     * @memberof UnderpostRun
-     */
-    secret: (path, options = UnderpostRun.DEFAULT_OPTION) => {
-      shellExec(
-        `underpost secret underpost --create-from-file ${
-          path ? path : `/home/dd/engine/engine-private/conf/dd-cron/.env.production`
-        }`,
-      );
-    },
-    /**
-     * @method underpost-config
-     * @description Calls `UnderpostDeploy.API.configMap` to create a Kubernetes ConfigMap, defaulting to the 'production' environment.
-     * @param {string} path - The input value, identifier, or path for the operation (used as the optional configuration name/environment).
-     * @param {Object} options - The default underpost runner options for customizing workflow
-     * @memberof UnderpostRun
-     */
-    'underpost-config': (path = '', options = UnderpostRun.DEFAULT_OPTION) => {
-      UnderpostDeploy.API.configMap(path ? path : 'production', options.namespace);
-    },
-    /**
-     * @method gpu-env
-     * @description Sets up a dedicated GPU development environment cluster, resetting and then setting up the cluster with `--dedicated-gpu` and monitoring the pods.
-     * @param {string} path - The input value, identifier, or path for the operation.
-     * @param {Object} options - The default underpost runner options for customizing workflow
-     * @memberof UnderpostRun
-     */
-    'gpu-env': (path, options = UnderpostRun.DEFAULT_OPTION) => {
-      shellExec(
-        `node bin cluster --dev --reset && node bin cluster --dev --dedicated-gpu --kubeadm && kubectl get pods --all-namespaces -o wide -w`,
-      );
-    },
-    /**
-     * @method tf-gpu-test
-     * @description Deletes existing `tf-gpu-test-script` ConfigMap and `tf-gpu-test-pod`, and applies the test manifest from `manifests/deployment/tensorflow/tf-gpu-test.yaml`.
-     * @param {string} path - The input value, identifier, or path for the operation.
-     * @param {Object} options - The default underpost runner options for customizing workflow
-     * @memberof UnderpostRun
-     */
-    'tf-gpu-test': (path, options = UnderpostRun.DEFAULT_OPTION) => {
-      const { underpostRoot, namespace } = options;
-      shellExec(`kubectl delete configmap tf-gpu-test-script -n ${namespace} --ignore-not-found`);
-      shellExec(`kubectl delete pod tf-gpu-test-pod -n ${namespace} --ignore-not-found`);
-      shellExec(`kubectl apply -f ${underpostRoot}/manifests/deployment/tensorflow/tf-gpu-test.yaml -n ${namespace}`);
-    },
     /**
      * @method dev-cluster
      * @description Resets and deploys a full development cluster including MongoDB, Valkey, exposes services, and updates `/etc/hosts` for local access.
@@ -899,7 +794,7 @@ EOF
     'host-update': async (path, options = UnderpostRun.DEFAULT_OPTION) => {
       // const baseCommand = options.dev ? 'node bin' : 'underpost';
       shellExec(`chmod +x ${options.underpostRoot}/scripts/rocky-setup.sh`);
-      shellExec(`${options.underpostRoot}/scripts/rocky-setup.sh --yes${options.dev ? ' --install-dev' : ``}`);
+      shellExec(`${options.underpostRoot}/scripts/rocky-setup.sh${options.dev ? ' --install-dev' : ``}`);
     },
 
     /**
@@ -1600,6 +1495,113 @@ EOF
         ],
       });
     },
+
+    /**
+     * @method spark-template
+     * @description Creates a new Spark template project using `sbt new` in `/home/dd/spark-template`, initializes a Git repository, and runs `replace_params.sh` and `build.sh`.
+     * @param {string} path - The input value, identifier, or path for the operation.
+     * @param {Object} options - The default underpost runner options for customizing workflow
+     * @memberof UnderpostRun
+     */
+    'spark-template': (path, options = UnderpostRun.DEFAULT_OPTION) => {
+      const dir = '/home/dd/spark-template';
+      shellExec(`sudo rm -rf ${dir}`);
+      shellCd('/home/dd');
+
+      // pbcopy(`cd /home/dd && sbt new ${process.env.GITHUB_USERNAME}/spark-template.g8`);
+      // await read({ prompt: 'Command copy to clipboard, press enter to continue.\n' });
+      shellExec(`cd /home/dd && sbt new ${process.env.GITHUB_USERNAME}/spark-template.g8 '--name=spark-template'`);
+
+      shellCd(dir);
+
+      shellExec(`git init && git add . && git commit -m "Base implementation"`);
+      shellExec(`chmod +x ./replace_params.sh`);
+      shellExec(`chmod +x ./build.sh`);
+
+      shellExec(`./replace_params.sh`);
+      shellExec(`./build.sh`);
+
+      shellCd('/home/dd/engine');
+    },
+    /**
+     * @method rmi
+     * @description Forces the removal of all local Podman images (`podman rmi $(podman images -qa) --force`).
+     * @param {string} path - The input value, identifier, or path for the operation.
+     * @param {Object} options - The default underpost runner options for customizing workflow
+     * @memberof UnderpostRun
+     */
+    rmi: (path, options = UnderpostRun.DEFAULT_OPTION) => {
+      shellExec(`podman rmi $(podman images -qa) --force`);
+    },
+    /**
+     * @method kill
+     * @description Kills processes listening on the specified port(s). If the `path` contains a `+`, it treats it as a range of ports to kill.
+     * @param {string} path - The input value, identifier, or path for the operation (used as the port number).
+     * @param {Object} options - The default underpost runner options for customizing workflow
+     * @memberof UnderpostRun
+     */
+    kill: (path = '', options = UnderpostRun.DEFAULT_OPTION) => {
+      if (options.pid) return shellExec(`sudo kill -9 ${options.pid}`);
+      for (const _path of path.split(',')) {
+        if (_path.split('+')[1]) {
+          let [port, sumPortOffSet] = _path.split('+');
+          port = parseInt(port);
+          sumPortOffSet = parseInt(sumPortOffSet);
+          for (const sumPort of range(0, sumPortOffSet))
+            shellExec(`sudo kill -9 $(lsof -t -i:${parseInt(port) + parseInt(sumPort)})`);
+        } else shellExec(`sudo kill -9 $(lsof -t -i:${_path})`);
+      }
+    },
+    /**
+     * @method secret
+     * @description Creates an Underpost secret named 'underpost' from a file, defaulting to `/home/dd/engine/engine-private/conf/dd-cron/.env.production` if no path is provided.
+     * @param {string} path - The input value, identifier, or path for the operation (used as the optional path to the secret file).
+     * @param {Object} options - The default underpost runner options for customizing workflow
+     * @memberof UnderpostRun
+     */
+    secret: (path, options = UnderpostRun.DEFAULT_OPTION) => {
+      const secretPath = path ? path : `/home/dd/engine/engine-private/conf/dd-cron/.env.production`;
+      const command = options.dev
+        ? `node bin secret underpost --create-from-file ${secretPath}`
+        : `underpost secret underpost --create-from-file ${secretPath}`;
+      shellExec(command);
+    },
+    /**
+     * @method underpost-config
+     * @description Calls `UnderpostDeploy.API.configMap` to create a Kubernetes ConfigMap, defaulting to the 'production' environment.
+     * @param {string} path - The input value, identifier, or path for the operation (used as the optional configuration name/environment).
+     * @param {Object} options - The default underpost runner options for customizing workflow
+     * @memberof UnderpostRun
+     */
+    'underpost-config': (path = '', options = UnderpostRun.DEFAULT_OPTION) => {
+      UnderpostDeploy.API.configMap(path ? path : 'production', options.namespace);
+    },
+    /**
+     * @method gpu-env
+     * @description Sets up a dedicated GPU development environment cluster, resetting and then setting up the cluster with `--dedicated-gpu` and monitoring the pods.
+     * @param {string} path - The input value, identifier, or path for the operation.
+     * @param {Object} options - The default underpost runner options for customizing workflow
+     * @memberof UnderpostRun
+     */
+    'gpu-env': (path, options = UnderpostRun.DEFAULT_OPTION) => {
+      shellExec(
+        `node bin cluster --dev --reset && node bin cluster --dev --dedicated-gpu --kubeadm && kubectl get pods --all-namespaces -o wide -w`,
+      );
+    },
+    /**
+     * @method tf-gpu-test
+     * @description Deletes existing `tf-gpu-test-script` ConfigMap and `tf-gpu-test-pod`, and applies the test manifest from `manifests/deployment/tensorflow/tf-gpu-test.yaml`.
+     * @param {string} path - The input value, identifier, or path for the operation.
+     * @param {Object} options - The default underpost runner options for customizing workflow
+     * @memberof UnderpostRun
+     */
+    'tf-gpu-test': (path, options = UnderpostRun.DEFAULT_OPTION) => {
+      const { underpostRoot, namespace } = options;
+      shellExec(`kubectl delete configmap tf-gpu-test-script -n ${namespace} --ignore-not-found`);
+      shellExec(`kubectl delete pod tf-gpu-test-pod -n ${namespace} --ignore-not-found`);
+      shellExec(`kubectl apply -f ${underpostRoot}/manifests/deployment/tensorflow/tf-gpu-test.yaml -n ${namespace}`);
+    },
+
     /**
      * @method deploy-job
      * @description Creates and applies a custom Kubernetes Pod manifest (Job) for running arbitrary commands inside a container image (defaulting to a TensorFlow/NVIDIA image).

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

@@ -1,6 +1,6 @@
 import { marked } from 'marked';
 import { FileService } from '../../services/file/file.service.js';
-import { append, getBlobFromUint8ArrayFile, getRawContentFile, htmls, s } from './VanillaJs.js';
+import { append, getBlobFromUint8ArrayFile, getRawContentFile, htmls, s, sa } from './VanillaJs.js';
 import { s4 } from './CommonJs.js';
 import { Translate } from './Translate.js';
 import { Modal, renderViewTitle } from './Modal.js';
@@ -8,10 +8,53 @@ import { DocumentService } from '../../services/document/document.service.js';
 import { CoreService, getApiBaseUrl, headersFactory } from '../../services/core/core.service.js';
 import { loggerFactory } from './Logger.js';
 import { imageShimmer, renderChessPattern, renderCssAttr, styleFactory } from './Css.js';
-import { getQueryParams } from './Router.js';
+import { getQueryParams, setPath } from './Router.js';
 
 const logger = loggerFactory(import.meta);
 
+const attachMarkdownLinkHandlers = (containerSelector) => {
+  const container = s(containerSelector);
+  if (!container || container.dataset.mdLinkHandler) return;
+  container.dataset.mdLinkHandler = 'true';
+
+  container.addEventListener('click', async (e) => {
+    const link = e.target.closest('.markdown-content a[href]');
+    if (!link) return;
+
+    const href = link.getAttribute('href');
+    if (!href || href.startsWith('#')) return;
+
+    e.preventDefault();
+    const isExternal = href.startsWith('http://') || href.startsWith('https://');
+
+    if (isExternal) {
+      const result = await Modal.RenderConfirm({
+        id: `external-link-${s4()}`,
+        html: async () => html`
+          <div class="in section-mp" style="text-align: center; padding: 20px;">
+            <p>${Translate.Render('external-link-warning')}</p>
+            <p style="word-break: break-all; margin-top: 10px;"><strong>${href}</strong></p>
+          </div>
+        `,
+        icon: html`<i class="fas fa-external-link-alt"></i>`,
+        style: {
+          width: '350px',
+          height: '500px',
+          overflow: 'auto',
+          'z-index': '11',
+          resize: 'none',
+        },
+      });
+
+      if (result && result.status === 'confirm') {
+        window.open(href, '_blank', 'noopener,noreferrer');
+      }
+    } else {
+      setPath(href);
+    }
+  });
+};
+
 const Content = {
   Render: async function (options = { idModal: '' }) {
     const { idModal } = options;
@@ -171,7 +214,9 @@ const Content = {
         case 'md':
           {
             const content = await Content.getFileContent(file, options);
-            render += html`<div class="${options.class}" ${styleFactory(options.style)}>${marked.parse(content)}</div>`;
+            render += html`<div class="${options.class} markdown-content" ${styleFactory(options.style)}>
+              ${marked.parse(content)}
+            </div>`;
           }
           break;
 
@@ -239,6 +284,11 @@ ${JSON.stringify(JSON.parse(content), null, 4)}</pre
 
     if (options.raw) return render;
     append(container, render);
+
+    // Scrape and handle markdown links after DOM insertion
+    if (ext === 'md') {
+      attachMarkdownLinkHandlers(container);
+    }
   },
 
   /**
@@ -274,4 +324,4 @@ ${JSON.stringify(JSON.parse(content), null, 4)}</pre
   },
 };
 
-export { Content };
+export { Content, attachMarkdownLinkHandlers };

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

@@ -1,31 +1,224 @@
+/**
+ * Utility module for fullscreen mode management with cross-browser and PWA compatibility.
+ * Provides robust fullscreen detection, event handling, and UI synchronization.
+ * @module src/client/components/core/FullScreen.js
+ * @namespace FullScreenClient
+ */
+
 import { Responsive } from './Responsive.js';
 import { ToggleSwitch } from './ToggleSwitch.js';
 import { Translate } from './Translate.js';
 import { checkFullScreen, fullScreenIn, fullScreenOut, s } from './VanillaJs.js';
 
+/**
+ * Manages fullscreen mode state, event handling, and UI synchronization.
+ * Supports all major browsers and PWA/Nativefier environments with comprehensive
+ * vendor-prefixed API detection.
+ * @memberof FullScreenClient
+ */
 const FullScreen = {
+  /**
+   * Internal state flag tracking the intended fullscreen mode.
+   * @type {boolean}
+   * @private
+   */
+  _fullScreenSwitch: false,
+
+  /**
+   * Flag indicating whether event listeners have been attached.
+   * Prevents duplicate event listener registration.
+   * @type {boolean}
+   * @private
+   */
+  _eventListenersAdded: false,
+
+  /**
+   * Flag preventing concurrent sync operations.
+   * Ensures state synchronization happens sequentially.
+   * @type {boolean}
+   * @private
+   */
+  _syncInProgress: false,
+
+  /**
+   * Checks if the browser is currently in fullscreen mode.
+   * Supports all vendor-prefixed fullscreen APIs for maximum compatibility:
+   * - Standard Fullscreen API
+   * - Webkit (Chrome, Safari, Opera)
+   * - Mozilla (Firefox)
+   * - Microsoft (IE/Edge)
+   * @private
+   * @memberof FullScreenClient.FullScreen
+   * @returns {boolean} True if currently in fullscreen mode, false otherwise.
+   */
+  _isFullScreen: function () {
+    return !!(
+      document.fullscreenElement ||
+      document.webkitFullscreenElement ||
+      document.mozFullScreenElement ||
+      document.msFullscreenElement ||
+      document.fullscreen ||
+      document.webkitIsFullScreen ||
+      document.mozFullScreen
+    );
+  },
+
+  /**
+   * Synchronizes the toggle switch UI state with the actual fullscreen state.
+   * Prevents race conditions using the _syncInProgress flag.
+   * Updates the toggle switch only if there's a mismatch between UI and actual state.
+   * @private
+   * @memberof FullScreenClient.FullScreen
+   * @returns {void}
+   */
+  _syncToggleState: function () {
+    if (this._syncInProgress) return;
+    this._syncInProgress = true;
+
+    const actualFullScreen = this._isFullScreen();
+
+    // Only update if there's a mismatch
+    if (this._fullScreenSwitch !== actualFullScreen) {
+      this._fullScreenSwitch = actualFullScreen;
+
+      // Update toggle switch UI if it exists
+      const toggle = s('.fullscreen');
+      if (toggle && ToggleSwitch.Tokens[`fullscreen`]) {
+        const switchState = ToggleSwitch.Tokens[`fullscreen`].checked;
+        if (switchState !== actualFullScreen) {
+          ToggleSwitch.Tokens[`fullscreen`].click();
+        }
+      }
+    }
+
+    setTimeout(() => {
+      this._syncInProgress = false;
+    }, 100);
+  },
+
+  /**
+   * Event handler for fullscreen change events.
+   * Triggers UI state synchronization when fullscreen mode changes.
+   * @private
+   * @memberof FullScreenClient.FullScreen
+   * @returns {void}
+   */
+  _handleFullScreenChange: function () {
+    this._syncToggleState();
+  },
+
+  /**
+   * Attaches all necessary event listeners for fullscreen mode detection.
+   * Handles multiple scenarios:
+   * - Vendor-prefixed fullscreen change events (Chrome, Firefox, IE/Edge)
+   * - Window resize events (for PWA/Nativefier compatibility)
+   * - ESC key detection (fallback for manual fullscreen exit)
+   * Only attaches listeners once to prevent duplicates.
+   * @private
+   * @memberof FullScreenClient.FullScreen
+   * @returns {void}
+   */
+  _addEventListeners: function () {
+    if (this._eventListenersAdded) return;
+
+    const events = ['fullscreenchange', 'webkitfullscreenchange', 'mozfullscreenchange', 'MSFullscreenChange'];
+
+    events.forEach((eventName) => {
+      document.addEventListener(eventName, () => this._handleFullScreenChange(), false);
+    });
+
+    // Additional check for PWA/Nativefier window resize events
+    window.addEventListener(
+      'resize',
+      () => {
+        setTimeout(() => this._syncToggleState(), 150);
+      },
+      false,
+    );
+
+    // ESC key detection fallback
+    document.addEventListener(
+      'keydown',
+      (e) => {
+        if (e.key === 'Escape' || e.keyCode === 27) {
+          setTimeout(() => this._syncToggleState(), 100);
+        }
+      },
+      false,
+    );
+
+    this._eventListenersAdded = true;
+  },
+
+  /**
+   * Enters fullscreen mode if not already in fullscreen.
+   * Updates internal state and triggers fullscreen API.
+   * Verifies the state change after a delay to ensure synchronization.
+   * @private
+   * @memberof FullScreenClient.FullScreen
+   * @returns {void}
+   */
+  _enterFullScreen: function () {
+    if (this._isFullScreen()) return;
+
+    this._fullScreenSwitch = true;
+    fullScreenIn();
+
+    // Verify after attempt
+    setTimeout(() => this._syncToggleState(), 300);
+  },
+
+  /**
+   * Exits fullscreen mode if currently in fullscreen.
+   * Updates internal state and triggers fullscreen exit API.
+   * Verifies the state change after a delay to ensure synchronization.
+   * @private
+   * @memberof FullScreenClient.FullScreen
+   * @returns {void}
+   */
+  _exitFullScreen: function () {
+    if (!this._isFullScreen()) return;
+
+    this._fullScreenSwitch = false;
+    fullScreenOut();
+
+    // Verify after attempt
+    setTimeout(() => this._syncToggleState(), 300);
+  },
+
+  /**
+   * Renders the fullscreen toggle setting UI component.
+   * Initializes fullscreen state detection, sets up event listeners,
+   * and creates a toggle switch for user interaction.
+   * Integrates with the Responsive system for dynamic updates.
+   * @memberof FullScreenClient.FullScreen
+   * @returns {Promise<string>} A promise resolving to the HTML string for the fullscreen setting component.
+   */
   RenderSetting: async function () {
-    let fullScreenSwitch = checkFullScreen();
+    // Initialize state from actual fullscreen status
+    this._fullScreenSwitch = this._isFullScreen();
+
+    // Setup event listeners once
+    this._addEventListeners();
+
+    // Update responsive event
     Responsive.Event['full-screen-settings'] = () => {
-      let fullScreenMode = checkFullScreen();
-      if ((fullScreenSwitch && !fullScreenMode) || (!fullScreenSwitch && fullScreenMode))
-        if (s('.fullscreen')) ToggleSwitch.Tokens[`fullscreen`].click();
+      this._syncToggleState();
     };
+
     return html`<div class="in section-mp">
       ${await ToggleSwitch.Render({
         wrapper: true,
         wrapperLabel: html`<i class="fa-solid fa-expand"></i> ${Translate.Render('fullscreen')}`,
         id: 'fullscreen',
         disabledOnClick: true,
-        checked: fullScreenSwitch,
+        checked: this._fullScreenSwitch,
         on: {
           unchecked: () => {
-            fullScreenSwitch = false;
-            if (checkFullScreen()) fullScreenOut();
+            this._exitFullScreen();
           },
           checked: () => {
-            fullScreenSwitch = true;
-            if (!checkFullScreen()) fullScreenIn();
+            this._enterFullScreen();
           },
         },
       })}