underpost 2.8.867 → 2.8.871

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

@@ -0,0 +1,441 @@
+import { CoreService } from '../../services/core/core.service.js';
+import { BtnIcon } from './BtnIcon.js';
+import { borderChar, dynamicCol } from './Css.js';
+import { DropDown } from './DropDown.js';
+import { EventsUI } from './EventsUI.js';
+import { Translate } from './Translate.js';
+import { getProxyPath, s, append, hexToRgbA } from './VanillaJs.js';
+import { s4 } from './CommonJs.js';
+import { Input } from './Input.js';
+import { ToggleSwitch } from './ToggleSwitch.js';
+import { ObjectLayerService } from '../../services/object-layer/object-layer.service.js';
+
+const ObjectLayerEngineModal = {
+  templates: [
+    {
+      label: 'empty',
+      id: 'empty',
+      data: [],
+    },
+  ],
+  RenderTemplate: (colorTemplate) => {
+    const ole = s('object-layer-engine');
+    if (!ole) {
+      return;
+    }
+
+    if (colorTemplate.length === 0) {
+      ole.clear();
+      return;
+    }
+
+    const matrix = colorTemplate.map((row) => row.map((hex) => [...hexToRgbA(hex), 255]));
+    ole.loadMatrix(matrix);
+  },
+  ObjectLayerData: {},
+  Render: async (options = { idModal: '' }) => {
+    await import(`${getProxyPath()}components/core/ObjectLayerEngine.js`);
+    // await import(`${getProxyPath()}components/core/WebComponent.js`);
+    const directionCodes = ['08', '18', '02', '12', '04', '14', '06', '16'];
+    const itemTypes = ['skin', 'weapon', 'armor', 'artifact', 'floor'];
+    const statTypes = ['effect', 'resistance', 'agility', 'range', 'intelligence', 'utility'];
+    let selectItemType = itemTypes[0];
+    let itemActivable = false;
+    let renderIsStateless = false;
+    let renderFrameDuration = 100;
+
+    for (const url of [
+      `${getProxyPath()}assets/templates/item-skin-08.json`,
+      `${getProxyPath()}assets/templates/item-skin-06.json`,
+    ]) {
+      const id = url.split('/').pop().replace('.json', '');
+      ObjectLayerEngineModal.templates.push({
+        label: id,
+        id,
+        data: JSON.parse(await CoreService.getRaw({ url })).color,
+      });
+    }
+
+    const cells = 26;
+    const pixelSize = parseInt(320 / cells);
+    const idSectionA = 'template-section-a';
+    const idSectionB = 'template-section-b';
+
+    let directionsCodeBarRender = '';
+
+    for (const directionCode of directionCodes) {
+      setTimeout(() => {
+        EventsUI.onClick(`.direction-code-bar-frames-btn-${directionCode}`, async () => {
+          const image = await s('object-layer-engine').toBlob();
+          const json = s('object-layer-engine').exportMatrixJSON();
+          const id = `frame-capture-${s4()}-${s4()}`;
+
+          if (!ObjectLayerEngineModal.ObjectLayerData[directionCode])
+            ObjectLayerEngineModal.ObjectLayerData[directionCode] = [];
+          ObjectLayerEngineModal.ObjectLayerData[directionCode].push({ id, image, json });
+
+          append(
+            `.frames-${directionCode}`,
+            html`
+              <div class="in fll ${id}">
+                <img class="in fll direction-code-bar-frames-img" src="${URL.createObjectURL(image)}" />
+                ${await BtnIcon.Render({
+                  label: html`<i class="fa-solid fa-trash"></i>`,
+                  class: `abs direction-code-bar-trash-btn direction-code-bar-trash-btn-${id}`,
+                })}
+              </div>
+            `,
+          );
+
+          EventsUI.onClick(`.direction-code-bar-trash-btn-${id}`, async () => {
+            s(`.${id}`).remove();
+            ObjectLayerEngineModal.ObjectLayerData[directionCode] = ObjectLayerEngineModal.ObjectLayerData[
+              directionCode
+            ].filter((frame) => frame.id !== id);
+          });
+        });
+
+        EventsUI.onClick(`.ol-btn-save`, async () => {
+          const objectLayer = {
+            data: {
+              render: {
+                frames: {},
+                color: [],
+                frame_duration: 0,
+                is_stateless: false,
+              },
+              stats: {},
+              item: {},
+            },
+          };
+          for (const directionCode of directionCodes) {
+            const directions = ObjectLayerEngineModal.getDirectionsFromDirectionCode(directionCode);
+            for (const direction of directions) {
+              if (!objectLayer.data.render.frames[direction]) objectLayer.data.render.frames[direction] = [];
+
+              if (!(directionCode in ObjectLayerEngineModal.ObjectLayerData)) {
+                console.warn('No set directionCodeBarFrameData for directionCode', directionCode);
+                continue;
+              }
+
+              for (const frameData of ObjectLayerEngineModal.ObjectLayerData[directionCode]) {
+                const { matrix } = JSON.parse(frameData.json);
+                const frameIndexColorMatrix = [];
+                let indexRow = -1;
+                for (const row of matrix) {
+                  indexRow++;
+                  frameIndexColorMatrix[indexRow] = [];
+                  let indexCol = -1;
+                  for (const value of row) {
+                    indexCol++;
+                    let colorIndex = objectLayer.data.render.color.findIndex(
+                      (color) =>
+                        color[0] === value[0] &&
+                        color[1] === value[1] &&
+                        color[2] === value[2] &&
+                        color[3] === value[3],
+                    );
+                    if (colorIndex === -1) {
+                      objectLayer.data.render.color.push(value);
+                      colorIndex = objectLayer.data.render.color.length - 1;
+                    }
+                    frameIndexColorMatrix[indexRow][indexCol] = colorIndex;
+                  }
+                }
+                objectLayer.data.render.frames[direction].push(frameIndexColorMatrix);
+              }
+            }
+          }
+          objectLayer.data.render.frame_duration = parseInt(s(`.ol-input-render-frame-duration`).value);
+          objectLayer.data.render.is_stateless = renderIsStateless;
+          objectLayer.data.stats = {
+            effect: parseInt(s(`.ol-input-item-stats-effect`).value),
+            resistance: parseInt(s(`.ol-input-item-stats-resistance`).value),
+            agility: parseInt(s(`.ol-input-item-stats-agility`).value),
+            range: parseInt(s(`.ol-input-item-stats-range`).value),
+            intelligence: parseInt(s(`.ol-input-item-stats-intelligence`).value),
+            utility: parseInt(s(`.ol-input-item-stats-utility`).value),
+          };
+          objectLayer.data.item = {
+            type: selectItemType,
+            activable: itemActivable,
+            id: s(`.ol-input-item-id`).value,
+            description: s(`.ol-input-item-description`).value,
+          };
+          console.warn('objectLayer', objectLayer);
+
+          // Upload images
+          {
+            for (const directionCode of Object.keys(ObjectLayerEngineModal.ObjectLayerData)) {
+              let frameIndex = -1;
+              for (const frame of ObjectLayerEngineModal.ObjectLayerData[directionCode]) {
+                frameIndex++;
+                const pngBlob = frame.image;
+
+                const form = new FormData();
+                form.append(directionCode, pngBlob, `${frameIndex}.png`);
+
+                const { status, data } = await ObjectLayerService.post({
+                  id: `frame-image/${objectLayer.data.item.type}/${objectLayer.data.item.id}/${directionCode}`,
+                  body: form,
+                  headerId: 'file',
+                });
+              }
+            }
+          }
+
+          // Upload metadata
+          {
+            delete objectLayer.data.render.frames;
+            delete objectLayer.data.render.color;
+            const { status, data } = await ObjectLayerService.post({
+              id: `metadata/${objectLayer.data.item.type}/${objectLayer.data.item.id}`,
+              body: objectLayer,
+            });
+          }
+        });
+      });
+      directionsCodeBarRender += html`
+        <div class="in section-mp-border">
+          <div class="fl">
+            <div class="in fll">
+              <div class="in direction-code-bar-frames-title">${directionCode}</div>
+              <div class="in direction-code-bar-frames-btn">
+                ${await BtnIcon.Render({
+                  label: html`<i class="fa-solid fa-plus"></i>`,
+                  class: `direction-code-bar-frames-btn-${directionCode}`,
+                })}
+              </div>
+            </div>
+            <div class="frames-${directionCode}"></div>
+          </div>
+        </div>
+      `;
+    }
+
+    let statsInputsRender = '';
+    for (const statType of statTypes) {
+      statsInputsRender += html`
+        ${await Input.Render({
+          id: `ol-input-item-stats-${statType}`,
+          label: html`<div class="inl" style="width: 120px; font-size: 16px; overflow: hidden">
+            <i class="fa-solid fa-chart-simple"></i> ${statType}
+          </div>`,
+          containerClass: 'inl',
+          type: 'number',
+          min: 0,
+          max: 10,
+          placeholder: true,
+          value: 0,
+        })}
+      `;
+    }
+
+    return html`
+      <style>
+        .direction-code-bar-frames-title {
+          font-weight: bold;
+          font-size: 1.2rem;
+          padding: 0.5rem;
+        }
+        .direction-code-bar-frames-img {
+          width: 100px;
+          height: auto;
+          margin: 3px;
+        }
+        .direction-code-bar-trash-btn {
+          top: 3px;
+          left: 3px;
+          background: red;
+          color: white;
+        }
+        .ol-btn-save {
+          padding: 0.5rem;
+          font-size: 30px;
+          font-weight: bold;
+        }
+        .ol-number-label {
+          width: 120px;
+          font-size: 16px;
+          overflow: hidden;
+          font-family: 'retro-font';
+        }
+        .sub-title-modal {
+          color: #ffcc00;
+        }
+      </style>
+      ${borderChar(2, 'black', ['.sub-title-modal'])}
+
+      <div class="in section-mp section-mp-border">
+        <div class="in sub-title-modal"><i class="fa-solid fa-table-cells-large"></i> Frame editor</div>
+
+        <object-layer-engine id="ole" width="${cells}" height="${cells}" pixel-size="${pixelSize}">
+        </object-layer-engine>
+      </div>
+
+      <div class="in section-mp section-mp-border">
+        <div class="in sub-title-modal"><i class="fa-solid fa-database"></i> Render data</div>
+        ${dynamicCol({ containerSelector: options.idModal, id: idSectionA })}
+
+        <div class="fl">
+          <div class="in fll ${idSectionA}-col-a">
+            <div class="in section-mp">
+              ${await DropDown.Render({
+                value: ObjectLayerEngineModal.templates[0].id,
+                label: html`${Translate.Render('select-template')}`,
+                data: ObjectLayerEngineModal.templates.map((template) => {
+                  return {
+                    value: template.id,
+                    display: html`<i class="fa-solid fa-paint-roller"></i> ${template.label}`,
+                    onClick: async () => {
+                      ObjectLayerEngineModal.RenderTemplate(template.data);
+                    },
+                  };
+                }),
+              })}
+            </div>
+          </div>
+          <div class="in fll ${idSectionA}-col-b">
+            <div class="in section-mp-border" style="width: 135px;">
+              ${await Input.Render({
+                id: `ol-input-render-frame-duration`,
+                label: html`<div class="inl ol-number-label">
+                  <i class="fa-solid fa-chart-simple"></i> Frame duration
+                </div>`,
+                containerClass: 'inl',
+                type: 'number',
+                min: 100,
+                max: 1000,
+                placeholder: true,
+                value: renderFrameDuration,
+              })}
+            </div>
+            <div class="in section-mp">
+              ${await ToggleSwitch.Render({
+                id: 'ol-toggle-render-is-stateless',
+                wrapper: true,
+                wrapperLabel: html`${Translate.Render('is-stateless')}`,
+                disabledOnClick: true,
+                checked: renderIsStateless,
+                on: {
+                  unchecked: () => {
+                    renderIsStateless = false;
+                    console.warn('renderIsStateless', renderIsStateless);
+                  },
+                  checked: () => {
+                    renderIsStateless = true;
+                    console.warn('renderIsStateless', renderIsStateless);
+                  },
+                },
+              })}
+            </div>
+          </div>
+        </div>
+        ${directionsCodeBarRender}
+      </div>
+      ${dynamicCol({ containerSelector: options.idModal, id: idSectionB, type: 'a-50-b-50' })}
+
+      <div class="fl">
+        <div class="in fll ${idSectionB}-col-a">
+          <div class="in section-mp section-mp-border">
+            <div class="in sub-title-modal"><i class="fa-solid fa-database"></i> Item data</div>
+            ${await Input.Render({
+              id: `ol-input-item-id`,
+              label: html`<i class="fa-solid fa-pen-to-square"></i> ${Translate.Render('item-id')}`,
+              containerClass: '',
+              placeholder: true,
+            })}
+            ${await Input.Render({
+              id: `ol-input-item-description`,
+              label: html`<i class="fa-solid fa-pen-to-square"></i> ${Translate.Render('item-description')}`,
+              containerClass: '',
+              placeholder: true,
+            })}
+            <div class="in section-mp">
+              ${await DropDown.Render({
+                value: itemTypes[0],
+                label: html`${Translate.Render('select-item-type')}`,
+                data: itemTypes.map((itemType) => {
+                  return {
+                    value: itemType,
+                    display: html`${itemType}`,
+                    onClick: async () => {
+                      console.warn('itemType click', itemType);
+                      selectItemType = itemType;
+                    },
+                  };
+                }),
+              })}
+            </div>
+            <div class="in section-mp">
+              ${await ToggleSwitch.Render({
+                id: 'ol-toggle-item-activable',
+                wrapper: true,
+                wrapperLabel: html`${Translate.Render('item-activable')}`,
+                disabledOnClick: true,
+                checked: itemActivable,
+                on: {
+                  unchecked: () => {
+                    itemActivable = false;
+                    console.warn('itemActivable', itemActivable);
+                  },
+                  checked: () => {
+                    itemActivable = true;
+                    console.warn('itemActivable', itemActivable);
+                  },
+                },
+              })}
+            </div>
+          </div>
+        </div>
+        <div class="in fll ${idSectionB}-col-b">
+          <div class="in section-mp section-mp-border">
+            <div class="in sub-title-modal"><i class="fa-solid fa-database"></i> Stats data</div>
+            ${statsInputsRender}
+          </div>
+        </div>
+      </div>
+
+      <div class="in section-mp">
+        ${await BtnIcon.Render({
+          label: html`<i class="fa-solid fa-save"></i> ${Translate.Render('save')}`,
+          class: `in flr ol-btn-save`,
+        })}
+      </div>
+    `;
+  },
+  getDirectionsFromDirectionCode(directionCode = '08') {
+    let objectLayerFrameDirections = [];
+
+    switch (directionCode) {
+      case '08':
+        objectLayerFrameDirections = ['down_idle', 'none_idle', 'default_idle'];
+        break;
+      case '18':
+        objectLayerFrameDirections = ['down_walking'];
+        break;
+      case '02':
+        objectLayerFrameDirections = ['up_idle'];
+        break;
+      case '12':
+        objectLayerFrameDirections = ['up_walking'];
+        break;
+      case '04':
+        objectLayerFrameDirections = ['left_idle', 'up_left_idle', 'down_left_idle'];
+        break;
+      case '14':
+        objectLayerFrameDirections = ['left_walking', 'up_left_walking', 'down_left_walking'];
+        break;
+      case '06':
+        objectLayerFrameDirections = ['right_idle', 'up_right_idle', 'down_right_idle'];
+        break;
+      case '16':
+        objectLayerFrameDirections = ['right_walking', 'up_right_walking', 'down_right_walking'];
+        break;
+    }
+
+    return objectLayerFrameDirections;
+  },
+};
+
+export { ObjectLayerEngineModal };

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

@@ -12,7 +12,7 @@ import { dynamicCol, renderCssAttr } from './Css.js';
 import { EventsUI } from './EventsUI.js';
 import { ToggleSwitch } from './ToggleSwitch.js';
 import { Modal } from './Modal.js';
-import { RouterEvents } from './Router.js';
+import { RouterEvents, setQueryPath } from './Router.js';
 import { RichText } from './RichText.js';
 import { loggerFactory } from './Logger.js';
 import { Badge } from './Badge.js';
@@ -473,6 +473,9 @@ const Panel = {
         setTimeout(() => {
           s(`.${idPanel}-form-body`).classList.add('hide');
         });
+        if (options.route && getQueryParams().cid) {
+          setQueryPath({ path: options.route, queryPath: '', replace: true });
+        }
       };
       s(`.btn-${idPanel}-add`).onclick = (e) => {
         e.preventDefault();

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

@@ -170,7 +170,7 @@ const PanelForm = {
                 status,
               });
               if (getQueryParams().cid === data.id) {
-                setQueryPath({ path: options.route, queryPath: '' });
+                setQueryPath({ path: options.route, queryPath: '', replace: true });
                 if (PanelForm.Data[idPanel].updatePanel) await PanelForm.Data[idPanel].updatePanel();
               }
 

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

@@ -55,13 +55,13 @@ const LoadRouter = function (RouterInstance) {
   window.onpopstate = (e) => Router({ ...RouterInstance, e });
 };
 
-const setQueryPath = (options = { path: '', queryPath: '' }, queryKey = 'cid') => {
-  const { queryPath, path } = options;
+const setQueryPath = (options = { path: '', queryPath: '', replace: false }, queryKey = 'cid') => {
+  const { queryPath, path, replace } = options;
   const newUri = `${getProxyPath()}${path === 'home' ? '' : `${path}/`}${
-    typeof queryPath === 'string' ? `?${queryKey}=${queryPath}` : ''
+    typeof queryPath === 'string' && queryPath ? `?${queryKey}=${queryPath}` : ''
   }`;
   const currentUri = `${window.location.pathname}${location.search}`;
-  if (currentUri !== newUri && currentUri !== `${newUri}/`) setPath(newUri);
+  if (currentUri !== newUri && currentUri !== `${newUri}/`) setPath(newUri, {}, '', { replace });
 };
 
 const listenQueryPathInstance = ({ id, routeId, event }, queryKey = 'cid') => {
@@ -86,27 +86,31 @@ const triggerCloseModalRouteChangeEvents = (newPath) => {
 };
 
 const closeModalRouteChangeEvent = (options = {}) => {
-  const { route, RouterInstance, homeCid } = options;
-  if (!route) return;
-
-  let path = window.location.pathname;
-  if (path[path.length - 1] !== '/') path = `${path}/`;
-  let newPath = `${getProxyPath()}`;
-
-  if (path !== newPath) {
-    for (const subIdModal of Object.keys(Modal.Data).reverse()) {
-      if (Modal.Data[subIdModal]?.options?.route) {
-        newPath = `${newPath}${Modal.Data[subIdModal].options.route}`;
-        triggerCloseModalRouteChangeEvents(newPath);
-        setPath(newPath);
-        setDocTitle(newPath);
-        Modal.setTopModalCallback(subIdModal);
-      }
-    }
-    newPath = `${newPath}${homeCid ? `?cid=${homeCid}` : ''}`;
-    triggerCloseModalRouteChangeEvents(newPath);
-    setPath(newPath);
-    setDocTitle(newPath);
+  const { closedId, homeCid } = options;
+  if (!closedId) return;
+
+  const remainingModals = Object.keys(Modal.Data).filter(
+    (id) => id !== closedId && (Modal.Data[id]?.options?.route || Modal.Data[id]?.options?.query),
+  );
+
+  const topModalId = remainingModals.reverse().find((id) => Modal.Data[id]);
+
+  if (topModalId) {
+    const topModal = Modal.Data[topModalId];
+    const route = topModal.options.route;
+    const query = topModal.query;
+    const path = route ? `${getProxyPath()}${route}` : location.pathname;
+    const newUrl = `${path}${query || ''}`;
+
+    triggerCloseModalRouteChangeEvents(newUrl);
+    setPath(newUrl, {}, '', { replace: true });
+    setDocTitle(route || path);
+    Modal.setTopModalCallback(topModalId);
+  } else {
+    const homeUrl = `${getProxyPath()}${homeCid ? `?cid=${homeCid}` : ''}`;
+    triggerCloseModalRouteChangeEvents(homeUrl);
+    setPath(homeUrl, {}, '', { replace: true });
+    setDocTitle('home');
   }
 };
 

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

@@ -67,7 +67,7 @@ const ToggleSwitch = {
 
     if (options.type === 'checkbox') {
     }
-    return html`
+    const htmlRender = html`
       ${options?.displayMode === 'checkbox'
         ? html`<div class="${options?.containerClass ? options.containerClass : 'inl box-content-border'} ${id}">
             <div class="in ${id}-content toggle-switch-content-checkbox">
@@ -81,6 +81,20 @@ const ToggleSwitch = {
           </div>`}
       <input type="checkbox" class="${id}-checkbox" style="display: none" />
     `;
+    if (options.wrapper) {
+      setTimeout(() => (s(`.toggle-form-container-${id}`).onclick = () => ToggleSwitch.Tokens[`${id}`].click()));
+      return html`
+        <div class="in toggle-form-container toggle-form-container-${id} hover">
+          <div class="fl ">
+            <div class="in fll" style="width: 70%">
+              <div class="in">${options.wrapperLabel}</div>
+            </div>
+            <div class="in fll" style="width: 30%">${htmlRender}</div>
+          </div>
+        </div>
+      `;
+    }
+    return htmlRender;
   },
 };
 

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

@@ -144,9 +144,11 @@ const pasteData = () => new Promise((resolve) => navigator.clipboard.readText().
  * @param title - The `title` parameter in the `setPath` function is a string that represents the
  * title of the new history entry. It is used as the title of the new history entry in the browser's
  * history.
+ * @param {object} [options={}] - Additional options.
+ * @param {boolean} [options.replace=false] - If true, use `history.replaceState` instead of `history.pushState`.
  * @memberof VanillaJS
  */
-const setPath = (path = '/', stateStorage = {}, title = '') => {
+const setPath = (path = '/', stateStorage = {}, title = '', options = {}) => {
   if (!path) path = '/';
 
   const [inputPath, inputSearch] = `${path}`.split('?');
@@ -159,28 +161,25 @@ const setPath = (path = '/', stateStorage = {}, title = '') => {
   if (sanitizedPath.length > 1 && sanitizedPath[sanitizedPath.length - 1] === '/')
     sanitizedPath = sanitizedPath.slice(0, -1);
 
-  if (window.location.pathname === sanitizedPath && (!inputSearch || inputSearch === location.search)) {
+  const newFullPath = `${sanitizedPath}${inputSearch ? `?${inputSearch}` : location.search}${location.hash ?? ''}`;
+  const currentFullPath = `${window.location.pathname}${location.search}${location.hash}`;
+
+  if (currentFullPath === newFullPath) {
     console.warn('Prevent overwriting same path', {
-      inputPath: inputPath,
-      inputSearch: inputSearch,
-      sanitizedPath: sanitizedPath,
-      currentLocationSearch: location.search,
-      currentLocationHash: location.hash,
+      newFullPath,
+      currentFullPath,
     });
     return;
   }
-  console.warn('Set path', {
+  const historyMethod = options.replace ? history.replaceState : history.pushState;
+  console.warn(`Set path (${options.replace ? 'replace' : 'push'})`, {
     inputPath: inputPath,
     inputSearch: inputSearch,
     sanitizedPath: sanitizedPath,
     currentLocationSearch: location.search,
     currentLocationHash: location.hash,
   });
-  return history.pushState(
-    stateStorage,
-    title,
-    `${sanitizedPath}${inputSearch ? `?${inputSearch}` : ''}${location.hash ?? ''}`,
-  );
+  return historyMethod.call(history, stateStorage, title, newFullPath);
 };
 
 /**

package/src/index.js

@@ -35,7 +35,7 @@ class Underpost {
    * @type {String}
    * @memberof Underpost
    */
-  static version = 'v2.8.867';
+  static version = 'v2.8.871';
   /**
    * Repository cli API
    * @static

package/src/server/client-build.js

@@ -19,7 +19,7 @@ import * as dir from 'path';
 import { shellExec } from './process.js';
 import { SitemapStream, streamToPromise } from 'sitemap';
 import { Readable } from 'stream';
-import { buildIcons, buildTextImg, getBufferPngText } from './client-icons.js';
+import { buildIcons } from './client-icons.js';
 import Underpost from '../index.js';
 import { buildDocs } from './client-build-docs.js';
 
@@ -65,16 +65,8 @@ const fullBuild = async ({
   fs.removeSync(rootClientPath);
 
   if (fs.existsSync(`./src/client/public/${publicClientId}`)) {
-    if (iconsBuild) {
-      const defaultBaseIconFolderPath = `src/client/public/${publicClientId}/assets/logo`;
-      if (!fs.existsSync(defaultBaseIconFolderPath)) fs.mkdirSync(defaultBaseIconFolderPath, { recursive: true });
-      const defaultBaseIconPath = `${defaultBaseIconFolderPath}/base-icon.png`;
-      if (!fs.existsSync(defaultBaseIconPath))
-        await buildTextImg(metadata.title, { debugFilename: defaultBaseIconPath });
-
-      if (!fs.existsSync(`./src/client/public/${publicClientId}/site.webmanifest`))
-        await buildIcons({ publicClientId, metadata });
-    }
+    if (iconsBuild === true) await buildIcons({ publicClientId, metadata });
+
     fs.copySync(
       `./src/client/public/${publicClientId}`,
       rootClientPath /* {