underpost 2.8.878 → 2.8.881

package/src/api/document/document.service.js

@@ -0,0 +1,125 @@
+import { loggerFactory } from '../../server/logger.js';
+import { DataBaseProvider } from '../../db/DataBaseProvider.js';
+import { DocumentDto } from './document.model.js';
+import { uniqueArray } from '../../client/components/core/CommonJs.js';
+import { getBearerToken, verifyJWT } from '../../server/auth.js';
+import { isValidObjectId } from 'mongoose';
+
+const logger = loggerFactory(import.meta);
+
+const DocumentService = {
+  post: async (req, res, options) => {
+    /** @type {import('./document.model.js').DocumentModel} */
+    const Document = DataBaseProvider.instance[`${options.host}${options.path}`].mongoose.models.Document;
+
+    switch (req.params.id) {
+      default:
+        req.body.userId = req.auth.user._id;
+        return await new Document(req.body).save();
+    }
+  },
+  get: async (req, res, options) => {
+    /** @type {import('./document.model.js').DocumentModel} */
+    const Document = DataBaseProvider.instance[`${options.host}${options.path}`].mongoose.models.Document;
+    /** @type {import('../user/user.model.js').UserModel} */
+    const User = DataBaseProvider.instance[`${options.host}${options.path}`].mongoose.models.User;
+
+    if (req.path.startsWith('/public') && req.query['tags']) {
+      const publisherUsers = await User.find({ $or: [{ role: 'admin' }, { role: 'moderator' }] });
+
+      const token = getBearerToken(req);
+      let user;
+      if (token) user = verifyJWT(token, options);
+
+      const queryPayload = {
+        userId: {
+          $in: publisherUsers.map((p) => p._id).concat(user?.role && user.role !== 'guest' ? [user._id] : []),
+        },
+        tags: {
+          // $in: uniqueArray(['public'].concat(req.query['tags'].split(','))),
+          $all: uniqueArray(['public'].concat(req.query['tags'].split(','))),
+        },
+        ...(req.query.cid
+          ? {
+              _id: {
+                $in: req.query.cid.split(',').filter((cid) => isValidObjectId(cid)),
+              },
+            }
+          : undefined),
+      };
+      logger.info('queryPayload', queryPayload);
+      // sort in descending (-1) order by length
+      const sort = { createdAt: -1 };
+      const limit = req.query.limit ? parseInt(req.query.limit, 10) : 6;
+      const skip = req.query.skip ? parseInt(req.query.skip, 10) : 0;
+
+      return await Document.find(queryPayload)
+        .sort(sort)
+        .limit(limit)
+        .skip(skip)
+        .populate(DocumentDto.populate.file())
+        .populate(user && user.role !== 'guest' ? DocumentDto.populate.user() : null);
+    }
+
+    switch (req.params.id) {
+      default:
+        return await Document.find({
+          userId: req.auth.user._id,
+          ...(req.params.id ? { _id: req.params.id } : undefined),
+        }).populate(DocumentDto.populate.file());
+    }
+  },
+  delete: async (req, res, options) => {
+    /** @type {import('./document.model.js').DocumentModel} */
+    const Document = DataBaseProvider.instance[`${options.host}${options.path}`].mongoose.models.Document;
+    /** @type {import('../file/file.model.js').FileModel} */
+    const File = DataBaseProvider.instance[`${options.host}${options.path}`].mongoose.models.File;
+
+    switch (req.params.id) {
+      default: {
+        const document = await Document.findOne({ _id: req.params.id });
+        if (!document) throw new Error('document not found');
+
+        if (document.userId.toString() !== req.auth.user._id) throw new Error('invalid user');
+
+        if (document.mdFileId) {
+          const file = await File.findOne({ _id: document.mdFileId });
+          if (file) await File.findByIdAndDelete(document.mdFileId);
+        }
+
+        if (document.fileId) {
+          const file = await File.findOne({ _id: document.fileId });
+          if (file) await File.findByIdAndDelete(document.fileId);
+        }
+
+        return await Document.findByIdAndDelete(req.params.id);
+      }
+    }
+  },
+  put: async (req, res, options) => {
+    /** @type {import('./document.model.js').DocumentModel} */
+    const Document = DataBaseProvider.instance[`${options.host}${options.path}`].mongoose.models.Document;
+    /** @type {import('../file/file.model.js').FileModel} */
+    const File = DataBaseProvider.instance[`${options.host}${options.path}`].mongoose.models.File;
+
+    switch (req.params.id) {
+      default: {
+        const document = await Document.findOne({ _id: req.params.id });
+        if (!document) throw new Error(`Document not found`);
+
+        if (document.mdFileId) {
+          const file = await File.findOne({ _id: document.mdFileId });
+          if (file) await File.findByIdAndDelete(document.mdFileId);
+        }
+
+        if (document.fileId) {
+          const file = await File.findOne({ _id: document.fileId });
+          if (file) await File.findByIdAndDelete(document.fileId);
+        }
+        return await Document.findByIdAndUpdate(req.params.id, req.body);
+      }
+    }
+  },
+};
+
+export { DocumentService };

package/src/cli/deploy.js

@@ -334,7 +334,7 @@ EOF`);
       if (!options.replicas) options.replicas = 1;
       if (options.sync) UnderpostDeploy.API.sync(deployList, options);
       if (options.buildManifest === true) await UnderpostDeploy.API.buildManifest(deployList, env, options);
-      if (options.infoRouter === true) {
+      if (options.infoRouter === true || options.buildManifest === true) {
         logger.info('router', await UnderpostDeploy.API.routerFactory(deployList, env));
         return;
       }

package/src/cli/index.js

@@ -360,6 +360,8 @@ program
   .option('--image-name <image-name>', 'Optional: Specifies the image name for test execution.')
   .option('--container-name <container-name>', 'Optional: Specifies the container name for test execution.')
   .option('--namespace <namespace>', 'Optional: Specifies the namespace for test execution.')
+  .option('--kubeadm', 'Flag to indicate Kubeadm cluster type context')
+  .option('--k3s', 'Flag to indicate K3s cluster type context')
   .description('Runs a script from the specified path.')
   .action(UnderpostRun.API.callback);
 

package/src/cli/run.js

@@ -23,6 +23,8 @@ class UnderpostRun {
     namespace: '',
     build: false,
     replicas: 1,
+    k3s: false,
+    kubeadm: false,
   };
   static RUNNERS = {
     'spark-template': (path, options = UnderpostRun.DEFAULT_OPTION) => {
@@ -253,7 +255,24 @@ class UnderpostRun {
     },
     'db-client': async (path, options = UnderpostRun.DEFAULT_OPTION) => {
       const { underpostRoot } = options;
+
+      const image = 'adminer:4.7.6-standalone';
+
+      if (!options.kubeadm && !options.k3s) {
+        // Only load if not kubeadm/k3s (Kind needs it)
+        shellExec(`docker pull ${image}`);
+        shellExec(`sudo kind load docker-image ${image}`);
+      } else if (options.kubeadm || options.k3s)
+        // For kubeadm/k3s, ensure it's available for containerd
+        shellExec(`sudo crictl pull ${image}`);
+
+      shellExec(`kubectl delete deployment adminer`);
       shellExec(`kubectl apply -k ${underpostRoot}/manifests/deployment/adminer/.`);
+      const successInstance = await UnderpostTest.API.statusMonitor('adminer', 'Running', 'pods', 1000, 60 * 10);
+
+      if (successInstance) {
+        shellExec(`underpost deploy --expose adminer`);
+      }
     },
     promote: async (path, options = UnderpostRun.DEFAULT_OPTION) => {
       let [inputDeployId, inputEnv, inputReplicas] = path.split(',');
@@ -332,8 +351,15 @@ class UnderpostRun {
       const checkStatusIterationMsDelay = 1000;
       const iteratorTag = `[${deployId}-${env}-${targetTraffic}]`;
       logger.info('Deployment init', { deployId, env, targetTraffic, checkStatusIterationMsDelay });
+      const minReadyOk = 3;
+      let readyOk = 0;
 
-      while (!UnderpostDeploy.API.checkDeploymentReadyStatus(deployId, env, targetTraffic, ignorePods).ready) {
+      while (readyOk < minReadyOk) {
+        const ready = UnderpostDeploy.API.checkDeploymentReadyStatus(deployId, env, targetTraffic, ignorePods).ready;
+        if (ready === true) {
+          readyOk++;
+          logger.info(`${iteratorTag} | Deployment ready. Verification number: ${readyOk}`);
+        }
         await timer(checkStatusIterationMsDelay);
         checkStatusIteration++;
         logger.info(

package/src/client/Default.index.js

@@ -16,6 +16,50 @@ import { SocketIo } from './components/core/SocketIo.js';
 import { SocketIoDefault } from './components/default/SocketIoDefault.js';
 import { ElementsDefault } from './components/default/ElementsDefault.js';
 import { CssDefaultDark, CssDefaultLight } from './components/default/CssDefault.js';
+import { EventsUI } from './components/core/EventsUI.js';
+import { Modal } from './components/core/Modal.js';
+
+const htmlMainBody = async () => {
+  setTimeout(() => {
+    EventsUI.onClick('.get-started-button', (e) => {
+      e.preventDefault();
+      location.href = `https://www.nexodev.org/docs/?cid=src`;
+    });
+  });
+  return html`
+    <div class="landing-container">
+      <div class="content-wrapper">
+        <h1 class="animated-text">
+          <span class="greeting">Hello, World!</span>
+          <span class="subtitle">Welcome to Our Platform</span>
+        </h1>
+
+        <div class="features">
+          <div class="feature-card">
+            <i class="icon">🚀</i>
+            <h3>Fast & Reliable</h3>
+            <p>Lightning-fast performance with 99.9% uptime</p>
+          </div>
+          <div class="feature-card">
+            <i class="icon">🎨</i>
+            <h3>Beautiful UI</h3>
+            <p>Modern and intuitive user interface</p>
+          </div>
+          <div class="feature-card">
+            <i class="icon">⚡</i>
+            <h3>Powerful Features</h3>
+            <p>Everything you need in one place</p>
+          </div>
+        </div>
+
+        <button class="cta-button get-started-button">
+          Get Started
+          <span class="button-icon">→</span>
+        </button>
+      </div>
+    </div>
+  `;
+};
 
 window.onload = () =>
   Worker.instance({
@@ -25,7 +69,7 @@ window.onload = () =>
       await TranslateCore.Init();
       await TranslateDefault.Init();
       await Responsive.Init();
-      await MenuDefault.Render();
+      await MenuDefault.Render({ htmlMainBody });
       await SocketIo.Init({
         channels: ElementsDefault.Data,
         path: `/`,
@@ -35,5 +79,6 @@ window.onload = () =>
       await LogOutDefault();
       await SignUpDefault();
       await Keyboard.Init({ callBackTime: DefaultParams.EVENT_CALLBACK_TIME });
+      await Modal.RenderSeoSanitizer();
     },
   });

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

@@ -195,7 +195,14 @@ const Account = {
       await this.instanceModalUiEvents({ user });
     });
     return html`
-      <input type="file" accept="${profileFileAccept.join(', ')}" class="account-profile-image-input hide" />
+      <label for="account-profile-image-input-label"
+        ><span class="hide">Profile Image</span>
+        <input
+          type="file"
+          accept="${profileFileAccept.join(', ')}"
+          class="account-profile-image-input hide"
+          id="account-profile-image-input-label"
+      /></label>
       ${renderWave({ id: waveAnimationId })}
 
       <form class="in">

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

@@ -5,6 +5,7 @@ import { ThemeEvents, darkTheme } from './Css.js';
 import { append, htmls, s } from './VanillaJs.js';
 import { getProxyPath } from './Router.js';
 import './Pagination.js';
+import { Modal } from './Modal.js';
 
 const AgGrid = {
   grids: {},
@@ -57,18 +58,26 @@ const AgGrid = {
           delete ThemeEvents[id];
         }
       };
+
+      if (!options.style || !options.style.height) {
+        if (options.parentModal && Modal.Data[options.parentModal].options.observer) {
+          Modal.Data[options.parentModal].onObserverListener[id + '-observer'] = ({ width, height }) => {
+            if (s(`.${id}`)) s(`.${id}`).style.height = `${height - 180}px`;
+            else delete Modal.Data[options.parentModal].onObserverListener[id + '-observer'];
+          };
+          s(`.${id}`).style.height = `${s(`.${options.parentModal}`).offsetHeight - 180}px`;
+        } else s(`.${id}`).style.height = '500px';
+      }
     });
     const usePagination = options?.usePagination;
     return html`
-      <div>
-        <div
-          class="${id} ${this.theme}${options?.darkTheme ? `-dark` : ''}"
-          style="${options?.style
-            ? Object.keys(options.style).map((styleKey) => `${styleKey}: ${options.style[styleKey]}; `)
-            : 'height: 500px'}"
-        ></div>
-        ${usePagination ? `<ag-pagination id="ag-pagination-${id}"></ag-pagination>` : ''}
-      </div>
+      <div
+        class="${id} ${this.theme}${options?.darkTheme ? `-dark` : ''}"
+        style="${options?.style
+          ? Object.keys(options.style).map((styleKey) => `${styleKey}: ${options.style[styleKey]}; `)
+          : ''}"
+      ></div>
+      ${usePagination ? `<ag-pagination id="ag-pagination-${id}"></ag-pagination>` : ''}
     `;
   },
   RenderStyle: async function (

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

@@ -1,7 +1,7 @@
 import { getId, s4 } from './CommonJs.js';
 import { renderCssAttr } from './Css.js';
 import { ToolTip } from './ToolTip.js';
-import { getAllChildNodes, s } from './VanillaJs.js';
+import { getAllChildNodes, htmlStrSanitize, s } from './VanillaJs.js';
 
 const BtnIcon = {
   Tokens: {},
@@ -32,7 +32,7 @@ const BtnIcon = {
       : ''}`;
     let render = html`<button
       ${options?.class ? `class="${options.class} ${tokenId}"` : ''}
-      ${options?.type ? `type="${options.type}"` : ''}
+      ${options?.type ? `type="${options.type}"` : `type="button"`}
       ${options?.style ? `style="${options.style}"` : ''}
       ${options?.attrs ? `${options.attrs}` : ''}
     >
@@ -49,6 +49,7 @@ const BtnIcon = {
             >`
           : label}
       </div>
+      <label class="hide">${htmlStrSanitize(options.label) ? htmlStrSanitize(options.label) : tokenId}</label>
     </button>`;
     if (options.tooltipHtml)
       setTimeout(() => {

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

@@ -1,7 +1,7 @@
 import { marked } from 'marked';
 import { FileService } from '../../services/file/file.service.js';
 import { append, getBlobFromUint8ArrayFile, getRawContentFile, htmls, s } from './VanillaJs.js';
-import { titleFormatted } from './CommonJs.js';
+import { s4 } from './CommonJs.js';
 import { Translate } from './Translate.js';
 import { Modal, renderViewTitle } from './Modal.js';
 import { DocumentService } from '../../services/document/document.service.js';
@@ -139,6 +139,7 @@ const Content = {
       case 'png': {
         const url = Content.urlFactory(options);
         const imgRender = html`<img
+          alt="${file.name ? file.name : `file ${s4()}`}"
           class="in ${options.class}"
           ${styleFactory(options.style, `${renderChessPattern(50)}`)}
           src="${url}"

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

@@ -215,6 +215,10 @@ const CssCommonCore = async () => {
       .bar-default-modal {
         overflow: hidden;
       }
+      .panel-placeholder-bottom {
+        height: 100px;
+        color: gray;
+      }
     </style>
     ${boxShadow({ selector: '.account-profile-image' })}
     <div class="ag-grid-style"></div>`;

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

@@ -129,19 +129,16 @@ const Docs = {
       s(`.btn-docs-src`).onclick = async () => {
         setQueryPath({ path: 'docs', queryPath: 'src' });
         cleanActive();
-        s(`.btn-docs-src`).classList.add('main-btn-menu-active');
         await this.RenderModal('src', options.modalOptions);
       };
       s(`.btn-docs-api`).onclick = async () => {
         setQueryPath({ path: 'docs', queryPath: 'api' });
         cleanActive();
-        s(`.btn-docs-api`).classList.add('main-btn-menu-active');
         await this.RenderModal('api', options.modalOptions);
       };
       s(`.btn-docs-coverage`).onclick = async () => {
         setQueryPath({ path: 'docs', queryPath: 'coverage' });
         cleanActive();
-        s(`.btn-docs-coverage`).classList.add('main-btn-menu-active');
         await this.RenderModal('coverage', options.modalOptions);
       };
 

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

@@ -7,7 +7,7 @@ import { loggerFactory } from './Logger.js';
 import { RichText } from './RichText.js';
 import { ToggleSwitch } from './ToggleSwitch.js';
 import { Translate } from './Translate.js';
-import { htmls, s } from './VanillaJs.js';
+import { htmls, htmlStrSanitize, s } from './VanillaJs.js';
 const logger = loggerFactory(import.meta);
 
 const fileFormDataFactory = (e, extensions) => {
@@ -61,22 +61,27 @@ const Input = {
         };
     });
 
-    const inputElement = html` <input
-        type="${options?.type ? options.type : 'text'}"
-        class="${options.inputClass ? options.inputClass : 'in wfa'} ${id}"
-        ${options?.min !== undefined ? `min="${options.min}"` : ''}
-        ${options?.max !== undefined ? `max="${options.max}"` : ''}
-        placeholder${options?.placeholder ? `="${options.placeholder}"` : ''}
-        ${options?.value !== undefined ? `value="${options.value}"` : ''}
-        ${options?.autocomplete ? `autocomplete="${options.autocomplete}"` : ''}
-        ${options?.disabled ? `disabled` : ''}
-        ${options?.name !== undefined ? `name="${options.name}"` : ''}
-        ${options?.pattern !== undefined ? `pattern="${options.pattern}"` : ''}
-        ${options?.pattern === undefined && options.type === 'tel' ? `pattern="[0-9]{3}-[0-9]{3}-[0-9]{4}"` : ''}
-        ${options?.required ? ` required ` : ''}
-        ${options?.accept ? `accept="${options.accept}"` : ''}
-        ${options?.multiple ? `multiple="multiple"` : ''}
-      />
+    const labelValue = htmlStrSanitize(options.label) ? htmlStrSanitize(options.label) : id;
+
+    const inputElement = html` <label for="${id}-name">
+        <span class="hide">${labelValue}</span>
+        <input
+          type="${options?.type ? options.type : 'text'}"
+          class="${options.inputClass ? options.inputClass : 'in wfa'} ${id}"
+          ${options?.min !== undefined ? `min="${options.min}"` : ''}
+          ${options?.max !== undefined ? `max="${options.max}"` : ''}
+          placeholder${options?.placeholder ? `="${options.placeholder}"` : ''}
+          ${options?.value !== undefined ? `value="${options.value}"` : ''}
+          ${options?.autocomplete ? `autocomplete="${options.autocomplete}"` : ''}
+          ${options?.disabled ? `disabled` : ''}
+          ${options?.name !== undefined ? `name="${options.name}"` : `name='${id}-name'`}
+          ${options?.pattern !== undefined ? `pattern="${options.pattern}"` : ''}
+          ${options?.pattern === undefined && options.type === 'tel' ? `pattern="[0-9]{3}-[0-9]{3}-[0-9]{4}"` : ''}
+          ${options?.required ? ` required ` : ''}
+          ${options?.accept ? `accept="${options.accept}"` : ''}
+          ${options?.multiple ? `multiple="multiple"` : ''}
+          id="${id}-name"
+      /></label>
       <div class="${id}-input-extension input-info input-extension ${options?.extension ? '' : 'hide'}">
         ${options?.extension ? await options.extension() : ''}
       </div>`;
@@ -244,7 +249,12 @@ const Input = {
 };
 
 const InputFile = {
-  Render: async function ({ id, multiple }, on = { change: () => {}, clear: () => {} }) {
+  Render: async function (
+    options = { id: '', multiple: false, extensionsAccept: [] },
+    on = { change: () => {}, clear: () => {} },
+  ) {
+    let { id, multiple, extensionsAccept } = options;
+    if (!extensionsAccept) extensionsAccept = [];
     // drag drop multi file
     const gridId = `ag-grid-input-file-${id}`;
     setTimeout(() => {
@@ -322,7 +332,12 @@ const InputFile = {
     return html` <div class="fl">
       <div class="in fll input-file-col">
         <div class="in section-mp input-file-sub-col">
-          <input class="wfa ${id}" type="file" ${multiple ? `multiple="multiple"` : ''} />
+          <input
+            class="wfa ${id}"
+            type="file"
+            ${multiple ? `multiple="multiple"` : ''}
+            ${extensionsAccept.length > 0 ? `accept="${extensionsAccept.join(', ')}"` : ''}
+          />
           <div class="in">
             ${await BtnIcon.Render({
               class: `wfa btn-clear-input-file-${id}`,

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

@@ -1,4 +1,4 @@
-import { getId, newInstance } from './CommonJs.js';
+import { getId, newInstance, s4 } from './CommonJs.js';
 import { Draggable } from '@neodrag/vanilla';
 import { append, s, prepend, htmls, sa, getAllChildNodes, isActiveElement } from './VanillaJs.js';
 import { BtnIcon } from './BtnIcon.js';
@@ -30,8 +30,9 @@ import { DropDown } from './DropDown.js';
 import { Keyboard } from './Keyboard.js';
 import { Badge } from './Badge.js';
 import { Worker } from './Worker.js';
+import { Scroll } from './Scroll.js';
 
-const logger = loggerFactory(import.meta);
+const logger = loggerFactory(import.meta, { trace: true });
 
 const Modal = {
   Data: {},
@@ -87,10 +88,15 @@ const Modal = {
       homeModals: options.homeModals ? options.homeModals : [],
       query: options.query ? `${window.location.search}` : undefined,
       getTop: () => window.innerHeight - (options.heightBottomBar ? options.heightBottomBar : heightDefaultBottomBar),
-      getHeight: () =>
-        window.innerHeight -
-        (options.heightTopBar ? options.heightTopBar : heightDefaultTopBar) -
-        (options.heightBottomBar ? options.heightBottomBar : heightDefaultBottomBar),
+      getHeight: () => {
+        return (
+          window.innerHeight -
+          (s(`.main-body-btn-ui-close`) && !s(`.main-body-btn-ui-close`).classList.contains('hide')
+            ? (options.heightTopBar ? options.heightTopBar : heightDefaultTopBar) +
+              (options.heightBottomBar ? options.heightBottomBar : heightDefaultBottomBar)
+            : 0)
+        );
+      },
     };
 
     if (idModal !== 'main-body' && options.mode !== 'view') {
@@ -367,6 +373,7 @@ const Modal = {
                   s(`.modal-menu`).style.top = '0px';
                   s(`.main-body-btn-container`).style.top = '50px';
                   s(`.main-body`).style.top = '0px';
+                  s(`.main-body`).style.height = `${window.innerHeight}px`;
                   for (const event of Object.keys(Modal.Data[idModal].onBarUiClose))
                     Modal.Data[idModal].onBarUiClose[event]();
                 } else {
@@ -379,6 +386,7 @@ const Modal = {
                   s(`.slide-menu-top-bar`).classList.remove('hide');
                   s(`.bottom-bar`).classList.remove('hide');
                   s(`.main-body`).style.top = `${options.heightTopBar}px`;
+                  s(`.main-body`).style.height = `${window.innerHeight - options.heightTopBar}px`;
                   for (const event of Object.keys(Modal.Data[idModal].onBarUiOpen))
                     Modal.Data[idModal].onBarUiOpen[event]();
                 }
@@ -1291,6 +1299,15 @@ const Modal = {
               }
 
               await NotificationManager.RenderBoard(options);
+
+              const { removeEvent } = Scroll.setEvent('.main-body', async (payload) => {
+                console.warn('scroll', payload);
+                if (payload.scrollTop > 100) {
+                  if (!s(`.main-body-btn-ui-close`).classList.contains('hide')) s(`.main-body-btn-ui-close`).click();
+
+                  removeEvent();
+                }
+              });
             });
           })();
           break;
@@ -1385,7 +1402,7 @@ const Modal = {
       <div
         class="fix ${options && options.class ? options.class : ''} modal ${options.disableBoxShadow
           ? ''
-          : 'box-shadow'} ${idModal}"
+          : 'box-shadow'} ${idModal === 'main-body' ? `${idModal} modal-home` : idModal}"
       >
         <div class="abs modal-handle-${idModal}"></div>
         <div class="in modal-html-${idModal}">
@@ -2246,6 +2263,11 @@ const Modal = {
     s(`.bottom-bar`).classList.remove('hide');
     s(`.modal-menu`).classList.remove('hide');
   },
+  RenderSeoSanitizer: async () => {
+    sa('img').forEach((img) => {
+      if (!img.getAttribute('alt')) img.setAttribute('alt', 'image ' + Worker.title + ' ' + s4());
+    });
+  },
 };
 
 const renderMenuLabel = ({ img, text, icon }) => {