underpost 2.8.847 → 2.8.848

package/README.md

@@ -38,6 +38,10 @@ template
 
 
 
+
+
+
+
 
 
 
@@ -46,7 +50,7 @@ template
 <!-- badges -->
 
 
-[![Node.js CI](https://github.com/underpostnet/engine/actions/workflows/docker-image.ci.yml/badge.svg?branch=master)](https://github.com/underpostnet/engine/actions/workflows/docker-image.yml) [![Test](https://github.com/underpostnet/engine/actions/workflows/coverall.ci.yml/badge.svg?branch=master)](https://github.com/underpostnet/engine/actions/workflows/coverall.yml) [![Downloads](https://img.shields.io/npm/dm/underpost.svg)](https://www.npmjs.com/package/underpost) [![Socket Badge](https://socket.dev/api/badge/npm/package/underpost/2.8.847)](https://socket.dev/npm/package/underpost/overview/2.8.847) [![Coverage Status](https://coveralls.io/repos/github/underpostnet/engine/badge.svg?branch=master)](https://coveralls.io/github/underpostnet/engine?branch=master) [![Version](https://img.shields.io/npm/v/underpost.svg)](https://www.npmjs.org/package/underpost) [![License](https://img.shields.io/npm/l/underpost.svg)](https://www.npmjs.com/package/underpost)
+[![Node.js CI](https://github.com/underpostnet/engine/actions/workflows/docker-image.ci.yml/badge.svg?branch=master)](https://github.com/underpostnet/engine/actions/workflows/docker-image.yml) [![Test](https://github.com/underpostnet/engine/actions/workflows/coverall.ci.yml/badge.svg?branch=master)](https://github.com/underpostnet/engine/actions/workflows/coverall.yml) [![Downloads](https://img.shields.io/npm/dm/underpost.svg)](https://www.npmjs.com/package/underpost) [![Socket Badge](https://socket.dev/api/badge/npm/package/underpost/2.8.848)](https://socket.dev/npm/package/underpost/overview/2.8.848) [![Coverage Status](https://coveralls.io/repos/github/underpostnet/engine/badge.svg?branch=master)](https://coveralls.io/github/underpostnet/engine?branch=master) [![Version](https://img.shields.io/npm/v/underpost.svg)](https://www.npmjs.org/package/underpost) [![License](https://img.shields.io/npm/l/underpost.svg)](https://www.npmjs.com/package/underpost)
 
 
 <!-- end-badges -->
@@ -67,6 +71,10 @@ template
 
 
 
+
+
+
+
 
 
 
@@ -116,7 +124,7 @@ Run dev client server
 npm run dev
 ```
 <!-- -->
-## underpost ci/cd cli v2.8.847
+## underpost ci/cd cli v2.8.848
 
 ### Usage: `underpost [options] [command]`
   ```

package/cli.md

@@ -1,4 +1,4 @@
-## underpost ci/cd cli v2.8.847
+## underpost ci/cd cli v2.8.848
 
 ### Usage: `underpost [options] [command]`
   ```
@@ -574,7 +574,7 @@ Options:
 Runs a script from the specified path.
 
 Arguments:
-  runner-id                                The runner ID to run. Options: spark-template, rmi, kill, secret, gpu-env, tf-gpu-test, dev-cluster, cyberia-ide, engine-ide, ssh-deploy, ide, monitor, db-client, cluster, deploy, tf-vae-test, deploy-job.
+  runner-id                                The runner ID to run. Options: spark-template, rmi, kill, secret, gpu-env, tf-gpu-test, dev-cluster, cyberia-ide, engine-ide, template-deploy, ssh-deploy, ide, monitor, db-client, cluster, deploy, tf-vae-test, deploy-job.
   path                                     The absolute or relative directory path where the script is located.
 
 Options:

package/conf.js

@@ -6,7 +6,7 @@ const DefaultConf = /**/ {
   client: {
     default: {
       metadata: {
-        title: 'Demo App',
+        title: 'PWA Demo App',
         backgroundImage: 'assets/background/white0-min.jpg',
         description: 'Web application',
         keywords: ['web', 'app', 'spa', 'demo', 'github-pages'],

package/docker-compose.yml

@@ -58,7 +58,7 @@ services:
           cpus: '0.25'
           memory: 20M
     labels: # labels in Compose file instead of Dockerfile
-      engine.version: '2.8.847'
+      engine.version: '2.8.848'
     networks:
       - load-balancer
 

package/manifests/deployment/dd-template-development/deployment.yaml

@@ -17,7 +17,7 @@ spec:
     spec:
       containers:
         - name: dd-template-development-blue
-          image: localhost/rockylinux9-underpost:v2.8.847
+          image: localhost/rockylinux9-underpost:v2.8.848
           #          resources:
           #            requests:
           #              memory: "124Ki"
@@ -100,7 +100,7 @@ spec:
     spec:
       containers:
         - name: dd-template-development-green
-          image: localhost/rockylinux9-underpost:v2.8.847
+          image: localhost/rockylinux9-underpost:v2.8.848
           #          resources:
           #            requests:
           #              memory: "124Ki"

package/package.json

@@ -2,7 +2,7 @@
     "type": "module",
     "main": "src/index.js",
     "name": "underpost",
-    "version": "2.8.847",
+    "version": "2.8.848",
     "description": "pwa api rest template",
     "scripts": {
         "start": "env-cmd -f .env.production node --max-old-space-size=8192 src/server",

package/src/api/user/user.service.js

@@ -444,7 +444,7 @@ const UserService = {
           _id: user._id,
         }).select(UserDto.select.get());
       } else throw new Error('invalid token');
-    }
+    } else delete req.body.password;
 
     switch (req.params.id) {
       default: {
@@ -453,9 +453,6 @@ const UserService = {
         });
         switch (user.role) {
           case 'admin': {
-            if (req.body.password !== undefined && req.body.password !== user.password)
-              req.body.password = await hashPassword(req.body.password);
-            else delete req.body.password;
             return await User.findByIdAndUpdate(req.params.id, req.body, {
               runValidators: true,
             });

package/src/cli/run.js

@@ -86,6 +86,13 @@ class UnderpostRun {
       shellExec(`${baseCommand} run ide /home/dd/engine`);
       shellExec(`${baseCommand} run ide /home/dd/engine/engine-private`);
     },
+    'template-deploy': (path, options = UnderpostRun.DEFAULT_OPTION) => {
+      const baseCommand = options.dev || true ? 'node bin' : 'underpost';
+      shellCd('/home/dd/engine');
+      shellExec(`git reset`);
+      shellExec(`${baseCommand} cmt . --empty ci package-pwa-microservices-template`);
+      shellExec(`${baseCommand} push . underpostnet/engine`);
+    },
     'ssh-deploy': (path, options = UnderpostRun.DEFAULT_OPTION) => {
       const baseCommand = options.dev || true ? 'node bin' : 'underpost';
       shellCd('/home/dd/engine');

package/src/client/Default.index.js

@@ -16,6 +16,7 @@ import { SocketIo } from './components/core/SocketIo.js';
 import { SocketIoDefault } from './components/default/SocketIoDefault.js';
 import { ElementsDefault } from './components/default/ElementsDefault.js';
 import { Scroll } from './components/core/Scroll.js';
+import { CssDefaultDark, CssDefaultLight } from './components/default/CssDefault.js';
 
 const htmlMainBody = async () => {
   return html`<span>Hello World!!</span>`;
@@ -25,12 +26,15 @@ window.onload = () =>
   Worker.instance({
     router: RouterDefault,
     render: async () => {
-      await Css.loadThemes();
+      await Css.loadThemes([CssDefaultLight, CssDefaultDark]);
       await TranslateCore.Init();
       await TranslateDefault.Init();
       await Responsive.Init();
       await MenuDefault.Render({ htmlMainBody });
-      await SocketIo.Init({ channels: ElementsDefault.Data });
+      await SocketIo.Init({
+        channels: ElementsDefault.Data,
+        path: `/`,
+      });
       await SocketIoDefault.Init();
       await LogInDefault();
       await LogOutDefault();

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

@@ -44,7 +44,7 @@ const Account = {
         { model: 'email', id: `account-email`, rules: [{ type: 'isEmpty' }, { type: 'isEmail' }] },
         {
           model: 'password',
-          defaultValue: '*******',
+          defaultValue: '#Changethis123',
           id: `account-password`,
           rules: [{ type: 'isStrongPassword' }],
         },

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

@@ -51,8 +51,8 @@ const Css = {
     // if (!ThemesScope.find((t) => t.dark)) addTheme(CssCoreDark);
     // if (!ThemesScope.find((t) => !t.dark)) addTheme(CssCoreLight);
     if (ThemesScope.length === 0) {
-      addTheme(CssCoreDark);
       addTheme(CssCoreLight);
+      addTheme(CssCoreDark);
     }
     const localStorageTheme = localStorage.getItem('_theme');
     if (localStorageTheme && Themes[localStorageTheme]) {
@@ -199,6 +199,7 @@ const addTheme = (options) => {
       if (!['core', 'css-core'].includes(options.theme))
         render += darkTheme ? await CssCoreDark.render() : await CssCoreLight.render();
       render += await options.render();
+      render += await subThemeManager.render();
       htmls('.theme', render);
       TriggerThemeEvents();
     }
@@ -232,18 +233,29 @@ const borderChar = (px, color, selectors, hover = false) => {
     ${color}, ${px}px ${px}px ${px}px ${color};
   `;
 };
-
 const boxShadow = ({ selector }) => html`
-  <style>
-    ${selector} {
-      box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.2), 0 6px 20px 0 rgba(0, 0, 0, 0.19);
-    }
-    ${selector}:hover {
-      box-shadow: 0 8px 16px 0 rgba(0, 0, 0, 0.2), 0 10px 30px 0 rgba(0, 0, 0, 0.3);
-    }
-  </style>
+  ${darkTheme
+    ? html`
+        <style>
+          ${selector} {
+            box-shadow: 0 4px 8px 0 rgba(255, 255, 255, 0.1), 0 6px 20px 0 rgba(255, 255, 255, 0.08);
+          }
+          ${selector}:hover {
+            box-shadow: 0 8px 16px 0 rgba(255, 255, 255, 0.15), 0 10px 30px 0 rgba(255, 255, 255, 0.1);
+          }
+        </style>
+      `
+    : html`
+        <style>
+          ${selector} {
+            box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.2), 0 6px 20px 0 rgba(0, 0, 0, 0.19);
+          }
+          ${selector}:hover {
+            box-shadow: 0 8px 16px 0 rgba(0, 0, 0, 0.2), 0 10px 30px 0 rgba(0, 0, 0, 0.3);
+          }
+        </style>
+      `}
 `;
-
 const renderMediaQuery = (mediaData) => {
   //  first limit should be '0'
   return html`
@@ -677,6 +689,166 @@ const scrollBarLightRender = () => {
     .join('');
 };
 
+/**
+ * Adjust hex color brightness toward white/black ("mix") or by modifying HSL lightness ("hsl").
+ *
+ * @param {string} hex - Color as '#rrggbb', 'rrggbb', '#rgb', or 'rgb'.
+ * @param {number} factor - -1..1 or -100..100 (percent). Positive = lighten, negative = darken.
+ * @param {{mode?: 'mix'|'hsl'}} [options]
+ * @returns {string} - Adjusted color as '#rrggbb' (lowercase).
+ */
+function adjustHex(hex, factor = 0.1, options = {}) {
+  if (typeof hex !== 'string') throw new TypeError('hex must be a string');
+  if (typeof factor !== 'number') throw new TypeError('factor must be a number');
+
+  // normalize factor: allow -100..100 or -1..1
+  if (factor > 1 && factor <= 100) factor = factor / 100;
+  if (factor < -1 && factor >= -100) factor = factor / 100;
+  factor = Math.max(-1, Math.min(1, factor));
+
+  const mode = options.mode === 'hsl' ? 'hsl' : 'mix';
+
+  // normalize hex
+  let h = hex.replace(/^#/, '').trim();
+  if (!(h.length === 3 || h.length === 6)) throw new Error('Invalid hex format');
+  if (h.length === 3)
+    h = h
+      .split('')
+      .map((c) => c + c)
+      .join('');
+
+  const r = parseInt(h.slice(0, 2), 16);
+  const g = parseInt(h.slice(2, 4), 16);
+  const b = parseInt(h.slice(4, 6), 16);
+
+  const clamp = (v, a = 0, z = 255) => Math.max(a, Math.min(z, v));
+
+  const rgbToHex = (rr, gg, bb) =>
+    '#' +
+    [rr, gg, bb]
+      .map((v) => Math.round(v).toString(16).padStart(2, '0'))
+      .join('')
+      .toLowerCase();
+
+  if (mode === 'mix') {
+    // positive: mix toward white (255); negative: mix toward black (0)
+    const mixChannel = (c) => {
+      if (factor >= 0) {
+        return clamp(Math.round(c + (255 - c) * factor));
+      } else {
+        const a = Math.abs(factor);
+        return clamp(Math.round(c * (1 - a)));
+      }
+    };
+    return rgbToHex(mixChannel(r), mixChannel(g), mixChannel(b));
+  } else {
+    // HSL mode: convert rgb to hsl, adjust L by factor, convert back
+    const rgbToHsl = (r, g, b) => {
+      r /= 255;
+      g /= 255;
+      b /= 255;
+      const max = Math.max(r, g, b),
+        min = Math.min(r, g, b);
+      let h = 0,
+        s = 0,
+        l = (max + min) / 2;
+      if (max !== min) {
+        const d = max - min;
+        s = l > 0.5 ? d / (2 - max - min) : d / (max + min);
+        switch (max) {
+          case r:
+            h = (g - b) / d + (g < b ? 6 : 0);
+            break;
+          case g:
+            h = (b - r) / d + 2;
+            break;
+          case b:
+            h = (r - g) / d + 4;
+            break;
+        }
+        h /= 6;
+      }
+      return { h, s, l };
+    };
+
+    const hslToRgb = (h, s, l) => {
+      let r, g, b;
+      if (s === 0) {
+        r = g = b = l;
+      } else {
+        const hue2rgb = (p, q, t) => {
+          if (t < 0) t += 1;
+          if (t > 1) t -= 1;
+          if (t < 1 / 6) return p + (q - p) * 6 * t;
+          if (t < 1 / 2) return q;
+          if (t < 2 / 3) return p + (q - p) * (2 / 3 - t) * 6;
+          return p;
+        };
+        const q = l < 0.5 ? l * (1 + s) : l + s - l * s;
+        const p = 2 * l - q;
+        r = hue2rgb(p, q, h + 1 / 3);
+        g = hue2rgb(p, q, h);
+        b = hue2rgb(p, q, h - 1 / 3);
+      }
+      return { r: r * 255, g: g * 255, b: b * 255 };
+    };
+
+    const { h: hh, s: ss, l: ll } = rgbToHsl(r, g, b);
+    // add factor to lightness (factor already normalized -1..1)
+    let newL = ll + factor;
+    newL = Math.max(0, Math.min(1, newL));
+    const { r: r2, g: g2, b: b2 } = hslToRgb(hh, ss, newL);
+    return rgbToHex(r2, g2, b2);
+  }
+}
+
+// Convenience helpers:
+function lightenHex(hex, percentOr01 = 0.1, options = {}) {
+  return adjustHex(hex, Math.abs(percentOr01), options);
+}
+function darkenHex(hex, percentOr01 = 0.1, options = {}) {
+  return adjustHex(hex, -Math.abs(percentOr01), options);
+}
+
+const subThemeManager = {
+  render: async function () {
+    if (darkTheme && this.renderDark) {
+      return await this.renderDark();
+    } else if (!darkTheme && this.renderLight) {
+      return await this.renderLight();
+    }
+    return html``;
+  },
+  lightColor: null,
+  setLightTheme: function (color) {
+    this.lightColor = color;
+    this.renderLight = async function () {
+      return html`<style>
+        button:hover,
+        .a-btn:hover,
+        .main-btn-menu-active {
+          color: ${this.lightColor};
+          background-color: ${lightenHex(this.lightColor, 0.8)};
+        }
+      </style>`;
+    };
+  },
+  darkColor: null,
+  setDarkTheme: function (color) {
+    this.darkColor = color;
+    this.renderDark = async function () {
+      return html`<style>
+        button:hover,
+        .a-btn:hover,
+        .main-btn-menu-active {
+          color: ${lightenHex(this.darkColor, 0.8)};
+          background-color: ${darkenHex(this.darkColor, 0.75)};
+        }
+      </style>`;
+    };
+  },
+};
+
 const scrollBarDarkRender = () => {
   return cssBrowserCodes
     .map(
@@ -685,8 +857,8 @@ const scrollBarDarkRender = () => {
     ::-` +
         b +
         `-scrollbar {
-      width: 5px;
-      height: 5px; 
+      width: 8px;
+      height: 8px; 
       /* line-height: 1em; */
     }
 
@@ -702,7 +874,7 @@ const scrollBarDarkRender = () => {
         b +
         `-scrollbar-thumb {
       background: #74747457;
-      border-radius: 3px;
+      border-radius: 4px;
     }
 
     /* Handle on hover */
@@ -907,4 +1079,8 @@ export {
   simpleIconsRender,
   extractBackgroundImageUrl,
   renderChessPattern,
+  subThemeManager,
+  lightenHex,
+  darkenHex,
+  adjustHex,
 };

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

@@ -33,7 +33,7 @@ const CssCommonCore = async () => {
         top: 0;
         left: 0;
         transition: 0.3s;
-        height: 5px;
+        height: 10px;
         width: 100%;
         z-index: 11;
       }

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

@@ -16,10 +16,7 @@ const Docs = {
     const docData = this.Data.find((d) => d.type === type);
     const ModalId = `modal-docs-${docData.type}`;
     const { barConfig } = await Themes[Css.currentTheme]();
-    barConfig.buttons.close.onClick = () => {
-      setQueryPath({ path: 'docs' });
-      Modal.removeModal(ModalId);
-    };
+
     await Modal.Render({
       barConfig,
       title: renderViewTitle(docData),
@@ -53,6 +50,9 @@ const Docs = {
       }
     };
     Modal.Data[ModalId].onObserverListener[ModalId]();
+    Modal.Data[ModalId].onCloseListener[ModalId] = () => {
+      setQueryPath({ path: 'docs', queryPath: '' });
+    };
   },
   Data: [
     {

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

@@ -1,7 +1,7 @@
 import { CoreService } from '../../services/core/core.service.js';
 import { BtnIcon } from './BtnIcon.js';
 import { s4 } from './CommonJs.js';
-import { darkTheme, renderCssAttr } from './Css.js';
+import { darkTheme, renderCssAttr, subThemeManager } from './Css.js';
 import { loggerFactory } from './Logger.js';
 import { append, getAllChildNodes, getProxyPath, htmls, s, sa } from './VanillaJs.js';
 
@@ -23,12 +23,12 @@ const LoadingAnimation = {
           <div
             class="fix progress-bar box-shadow ${id}"
             style="left: -100%; background: ${darkTheme
-              ? LoadingAnimation.darkColor
-                ? LoadingAnimation.darkColor
-                : `#c9c9c9`
-              : LoadingAnimation.lightColor
-              ? LoadingAnimation.lightColor
-              : `#515151`};"
+              ? subThemeManager.darkColor
+                ? subThemeManager.darkColor
+                : `#66e400`
+              : subThemeManager.lightColor
+              ? subThemeManager.lightColor
+              : `#157e00`};"
           ></div>
         `,
       );
@@ -140,14 +140,7 @@ const LoadingAnimation = {
         }, 300);
       });
   },
-  lightColor: null,
-  setLightColor: function (color) {
-    this.lightColor = color;
-  },
-  darkColor: null,
-  setDarkColor: function (color) {
-    this.darkColor = color;
-  },
+
   RenderCurrentSrcLoad: function (event) {
     if (s(`.ssr-loading-info`)) {
       let nameSrcLoad = event.data.path;

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

@@ -166,9 +166,9 @@ const Modal = {
                       height: 100px;
                     }
                     .default-slide-menu-top-bar-fix-logo {
-                      width: 80px;
-                      height: 80px;
-                      padding: 10px;
+                      width: 50px;
+                      height: 50px;
+                      padding: 24px;
                     }
                     .default-slide-menu-top-bar-fix-title-container-text {
                       font-size: 30px;
@@ -502,7 +502,9 @@ const Modal = {
                       class="abs modal slide-menu-top-bar-fix"
                       style="height: ${options.heightTopBar}px; top: 0px"
                     >
-                      <a class="a-link-top-banner"> ${await options.slideMenuTopBarBannerFix()}</a>
+                      <a class="a-link-top-banner">
+                        <div class="inl">${await options.slideMenuTopBarBannerFix()}</div></a
+                      >
                     </div>`
                   : ''}
               </div>`,
@@ -711,6 +713,9 @@ const Modal = {
 
               const updateSearchBoxValue = (selector) => {
                 if (!selector) selector = getDefaultSearchBoxSelector();
+                // check exist childNodes
+                if (!s(selector) || !s(selector).hasChildNodes()) return;
+
                 if (s(selector).childNodes) {
                   if (
                     s(selector).childNodes[s(selector).childNodes.length - 1] &&
@@ -734,6 +739,10 @@ const Modal = {
 
               const setSearchValue = (selector) => {
                 if (!selector) selector = getDefaultSearchBoxSelector();
+
+                // check exist childNodes
+                if (!s(selector) || !s(selector).hasChildNodes()) return;
+
                 historySearchBox = historySearchBox.filter(
                   (h) => h.routerId !== results[currentKeyBoardSearchBoxIndex].routerId,
                 );
@@ -1538,12 +1547,12 @@ const Modal = {
             if (
               ![idModal, 'main-body-top', 'main-body'].concat(this.Data[idModal]?.homeModals || []).includes(keyModal)
             )
-              s(`.btn-close-${keyModal}`).click();
+              if (s(`.btn-close-${keyModal}`)) s(`.btn-close-${keyModal}`).click();
             backMenuButtonEvent();
           }
-          s(`.btn-close-modal-menu`).click();
+          if (s(`.btn-close-modal-menu`)) s(`.btn-close-modal-menu`).click();
           setPath(getProxyPath());
-          setDocTitle({ ...options.RouterInstance, route: '' });
+          setDocTitle();
         };
         s(`.main-btn-home`).onclick = async () => {
           // await this.onHomeRouterEvent();
@@ -2217,7 +2226,6 @@ const Modal = {
     if (s(`.a-link-top-banner`)) {
       s(`.a-link-top-banner`).setAttribute('href', `${location.origin}${getProxyPath()}`);
       EventsUI.onClick(`.a-link-top-banner`, (e) => {
-        if (location.pathname === '/') return location.reload();
         e.preventDefault();
         s(`.action-btn-home`).click();
       });

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

@@ -15,7 +15,7 @@ import { getSrcFromFileData } from './Input.js';
 import { imageShimmer, renderCssAttr } from './Css.js';
 import { Translate } from './Translate.js';
 import { Modal } from './Modal.js';
-import { closeModalRouteChangeEvents, listenQueryPathInstance, renderTitle, setQueryPath } from './Router.js';
+import { closeModalRouteChangeEvents, listenQueryPathInstance, setQueryPath } from './Router.js';
 
 const PanelForm = {
   Data: {},
@@ -92,7 +92,7 @@ const PanelForm = {
       },
     ];
 
-    const titleIcon = html`<i class="fa-solid fa-quote-left"></i>`;
+    const titleIcon = html`<i class="fa-solid fa-quote-left title-icon-${idPanel}"></i>`;
     const panelRender = async ({ data }) =>
       await Panel.Render({
         idPanel,
@@ -440,7 +440,6 @@ const PanelForm = {
       if (options.route === 'home') Modal.homeCid = newInstance(cid);
       htmls(`.${options.parentIdModal ? 'html-' + options.parentIdModal : 'main-body'}`, await renderSrrPanelData());
       await getPanelData();
-      if (this.Data[idPanel].data.length === 1) renderTitle(this.Data[idPanel].data[0].title);
       htmls(
         `.${options.parentIdModal ? 'html-' + options.parentIdModal : 'main-body'}`,
         await panelRender({ data: this.Data[idPanel].data }),