underpost 2.85.7 → 2.89.1

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

@@ -1,21 +1,24 @@
-import { getQueryParams, setQueryParams } from './Router.js';
+import { getQueryParams, setQueryParams, listenQueryParamsChange } from './Router.js';
 
 class AgPagination extends HTMLElement {
   constructor() {
     super();
     this.attachShadow({ mode: 'open' });
     this._gridId = null;
-    const queryParams = getQueryParams();
+    let queryParams = getQueryParams();
     this._currentPage = parseInt(queryParams.page, 10) || 1;
     this._limit = parseInt(queryParams.limit, 10) || 10;
     this._totalPages = 1;
     this._totalItems = 0;
+    this._limitOptions = [10, 20, 50, 100]; // Default options
     this.handlePageChange = this.handlePageChange.bind(this);
     this.handleLimitChange = this.handleLimitChange.bind(this);
+
+    this.handleQueryParamsChange = this.handleQueryParamsChange.bind(this);
   }
 
   static get observedAttributes() {
-    return ['grid-id', 'current-page', 'total-pages', 'total-items', 'limit'];
+    return ['grid-id', 'current-page', 'total-pages', 'total-items', 'limit', 'limit-options'];
   }
 
   attributeChangedCallback(name, oldValue, newValue) {
@@ -35,6 +38,16 @@ class AgPagination extends HTMLElement {
       case 'limit':
         this._limit = parseInt(newValue, 10) || this._limit;
         break;
+      case 'limit-options':
+        try {
+          const parsed = JSON.parse(newValue);
+          if (Array.isArray(parsed) && parsed.length > 0) {
+            this._limitOptions = parsed.map((v) => parseInt(v, 10)).filter((v) => !isNaN(v) && v > 0);
+          }
+        } catch (e) {
+          console.warn('Invalid limit-options format, using defaults');
+        }
+        break;
     }
     this.update();
   }
@@ -42,11 +55,43 @@ class AgPagination extends HTMLElement {
   connectedCallback() {
     this.render();
     this.addEventListeners();
-    this.update();
+    // Subscribe to query parameter changes once the component is connected and _gridId is potentially set.
+    listenQueryParamsChange({
+      id: `ag-pagination-${this._gridId || 'default'}`, // Use _gridId for a unique listener ID
+      event: this.handleQueryParamsChange,
+    });
+    // The initial state is already set in the constructor from getQueryParams().
+    // The `listenQueryParamsChange` in `Router.js` will trigger an immediate (setTimeout) call
+    // to `handleQueryParamsChange`, which will re-sync the state if needed and update the component.
+    this.update(); // Keep the initial update for rendering based on constructor's initial state.
   }
 
   disconnectedCallback() {
-    // Event listeners on shadow DOM are garbage collected with the component
+    // If Router.js held strong references to queryParamsChangeListeners, you might need to unsubscribe here.
+    // However, for this example, we'll assume the component's lifecycle or weak references handle cleanup.
+  }
+
+  handleQueryParamsChange(queryParams) {
+    const newPage = parseInt(queryParams.page, 10) || 1;
+    const newLimit = parseInt(queryParams.limit, 10) || 10;
+
+    let shouldUpdate = false;
+
+    if (newPage !== this._currentPage) {
+      this._currentPage = newPage;
+      shouldUpdate = true;
+    }
+    if (newLimit !== this._limit) {
+      this._limit = newLimit;
+      shouldUpdate = true;
+    }
+
+    if (shouldUpdate) {
+      this.update();
+      this.dispatchEvent(
+        new CustomEvent('pagination-query-params-change', { detail: { page: this._currentPage, limit: this._limit } }),
+      );
+    }
   }
 
   handlePageChange(newPage) {
@@ -54,7 +99,7 @@ class AgPagination extends HTMLElement {
       return;
     }
     this._currentPage = newPage;
-    setQueryParams({ page: newPage, limit: this._limit });
+    setQueryParams({ page: newPage, limit: this._limit }, { replace: false }); // Use pushState
     this.dispatchEvent(new CustomEvent('page-change', { detail: { page: newPage } }));
   }
 
@@ -65,7 +110,7 @@ class AgPagination extends HTMLElement {
     }
     this._limit = newLimit;
     this._currentPage = 1; // Reset to first page on limit change
-    setQueryParams({ page: 1, limit: newLimit });
+    setQueryParams({ page: 1, limit: newLimit }, { replace: false }); // Use pushState
     this.dispatchEvent(new CustomEvent('limit-change', { detail: { limit: newLimit } }));
   }
 
@@ -87,7 +132,8 @@ class AgPagination extends HTMLElement {
     this.shadowRoot.querySelector('#page-info').textContent = `Page ${this._currentPage} of ${this._totalPages}`;
 
     const limitSelector = this.shadowRoot.querySelector('#limit-selector');
-    if (limitSelector.value != this._limit) {
+    if (limitSelector && limitSelector.value != this._limit) {
+      // Added null check for limitSelector
       limitSelector.value = this._limit;
     }
 
@@ -133,6 +179,8 @@ class AgPagination extends HTMLElement {
   }
 
   render() {
+    const limitOptionsHtml = this._limitOptions.map((value) => `<option value="${value}">${value}</option>`).join('');
+
     this.shadowRoot.innerHTML = html`
       <style>
         :host {
@@ -193,10 +241,7 @@ class AgPagination extends HTMLElement {
       <button id="next-page">Next</button>
       <button id="last-page">Last</button>
       <select id="limit-selector">
-        <option value="10">10</option>
-        <option value="20">20</option>
-        <option value="50">50</option>
-        <option value="100">100</option>
+        ${limitOptionsHtml}
       </select>
     `;
   }

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

@@ -19,6 +19,13 @@ const logger = loggerFactory(import.meta, { trace: true });
  */
 const RouterEvents = {};
 
+/**
+ * @type {Object.<string, function>}\n
+ * @description Holds event listeners for query parameter changes.\n
+ * @memberof PwaRouter
+ */
+const queryParamsChangeListeners = {};
+
 /**
  * @type {string[]}
  * @description Array of core UI component IDs that should not trigger modal close route changes.
@@ -227,6 +234,22 @@ const listenQueryPathInstance = ({ id, routeId, event }, queryKey = 'cid') => {
     });
 };
 
+/**
+ * Registers a listener for changes to query parameters.\n
+ * The provided event callback is triggered with the current query parameters object.\n
+ * @param {object} options - The listener options.\n
+ * @param {string} options.id - A unique ID for the listener.\n
+ * @param {function(Object.<string, string>): void} options.event - The callback function to execute with the new query parameters.\n
+ * @memberof PwaRouter
+ */
+const listenQueryParamsChange = ({ id, event }) => {
+  queryParamsChangeListeners[id] = event;
+  // Immediately call with current query params for initial state
+  setTimeout(() => {
+    event(getQueryParams());
+  });
+};
+
 /**
  * Handles the logic for changing the route when a modal is closed. It determines the next URL
  * based on the remaining open modals or falls back to a home URL.
@@ -300,7 +323,18 @@ const setQueryParams = (newParams, options = { replace: true }) => {
 
   const newPath = url.pathname + url.search + url.hash;
 
-  history.pushState(history.state, '', newPath);
+  if (options.replace) {
+    history.replaceState(history.state, '', newPath);
+  } else {
+    history.pushState(history.state, '', newPath);
+  }
+
+  const updatedParams = getQueryParams();
+  for (const listenerId in queryParamsChangeListeners) {
+    if (Object.hasOwnProperty.call(queryParamsChangeListeners, listenerId)) {
+      queryParamsChangeListeners[listenerId](updatedParams);
+    }
+  }
 };
 
 export {
@@ -319,4 +353,6 @@ export {
   setPath,
   setQueryParams,
   sanitizeRoute,
+  queryParamsChangeListeners,
+  listenQueryParamsChange,
 };

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

@@ -516,6 +516,10 @@ const TranslateCore = {
       en: 'Cron Management',
       es: 'Gestion de cron jobs',
     };
+    Translate.Data['success-reload-data'] = {
+      en: 'Data reloaded successfully.',
+      es: 'Datos recargados con éxito.',
+    };
   },
 };
 

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

@@ -53,15 +53,22 @@ class PwaWorker {
    */
   constructor() {
     this.title = `${s('title').textContent}`;
+    if (!window.renderPayload.dev) {
+      console.log = () => null;
+      console.error = () => null;
+      console.info = () => null;
+      console.warn = () => null;
+    }
   }
 
   /**
    * Checks if the application is running in development mode (localhost or 127.0.0.1).
+   * @method devMode
    * @memberof PwaWorker
    * @returns {boolean} True if in development mode.
    */
   devMode() {
-    return location.origin.match('localhost') || location.origin.match('127.0.0.1');
+    return window.renderPayload.dev || location.origin.match('localhost') || location.origin.match('127.0.0.1');
   }
 
   /**

package/src/client/services/default/default.management.js

@@ -18,7 +18,7 @@ const DefaultOptions = {
   serviceId: 'default-management',
   entity: 'default',
   columnDefs: [
-    { field: '0', headerName: '0' },
+    { field: '0', headerName: '0', cellClassRules: { 'row-new-highlight': (params) => true } },
     { field: '1', headerName: '1' },
     { field: '2', headerName: '2' },
     { field: 'createdAt', headerName: 'createdAt', cellDataType: 'date', editable: false },
@@ -29,6 +29,10 @@ const DefaultOptions = {
   permissions: {
     add: true,
     remove: true,
+    reload: true,
+  },
+  paginationOptions: {
+    limitOptions: [10, 20, 50, 100],
   },
 };
 
@@ -66,25 +70,36 @@ const DefaultManagement = {
       paginationComp.setAttribute('current-page', this.Tokens[id].page);
       paginationComp.setAttribute('total-pages', this.Tokens[id].totalPages);
       paginationComp.setAttribute('total-items', this.Tokens[id].total);
+      setTimeout(async () => {
+        if (DefaultManagement.Tokens[id].readyRowDataEvent)
+          for (const event of Object.keys(DefaultManagement.Tokens[id].readyRowDataEvent))
+            await DefaultManagement.Tokens[id].readyRowDataEvent[event](rowDataScope);
+      }, 1);
+    }
+  },
+  refreshTable: async function (id) {
+    const gridApi = AgGrid.grids[this.Tokens[id].gridId];
+    if (gridApi) {
+      // Use refreshCells with change detection for optimal performance
+      // This is preferred over redrawRows() as it only updates changed cells
+      gridApi.refreshCells({
+        force: false, // Use change detection - only refresh cells whose values have changed
+        suppressFlash: false, // Show flash animation for changed cells (requires enableCellChangeFlash)
+      });
     }
   },
   RenderTable: async function (options = DefaultOptions) {
     if (!options) options = DefaultOptions;
-    const { serviceId, columnDefs, entity, defaultColKeyFocus, ServiceProvider, permissions } = options;
+    const { serviceId, columnDefs, entity, defaultColKeyFocus, ServiceProvider, permissions, paginationOptions } =
+      options;
     logger.info('DefaultManagement RenderTable', options);
     const id = options?.idModal ? options.idModal : getId(this.Tokens, `${serviceId}-`);
     const gridId = `${serviceId}-grid-${id}`;
     const queryParams = getQueryParams();
     const page = parseInt(queryParams.page) || 1;
-    const limit = parseInt(queryParams.limit) || 10;
-    this.Tokens[id] = {
-      ...options,
-      gridId,
-      page,
-      limit,
-      total: 0,
-      totalPages: 1,
-    };
+    const defaultLimit = paginationOptions?.limitOptions?.[0] || 10;
+    const limit = parseInt(queryParams.limit) || defaultLimit;
+    this.Tokens[id] = { ...this.Tokens[id], ...options, gridId, page, limit, total: 0, totalPages: 1 };
 
     setQueryParams({ page, limit });
     setTimeout(async () => {
@@ -107,7 +122,7 @@ const DefaultManagement = {
             label: html`<div class="abs center">
               <i class="fas fa-times"></i>
             </div> `,
-            class: `in fll section-mp management-table-btn-mini management-table-btn-remove-${id}-${cellRenderId}`,
+            class: `in fll section-mp management-table-btn-mini management-table-btn-remove-${id}-${cellRenderId} ${!params.data._id ? 'hide' : ''}`,
           })}`;
           setTimeout(() => {
             EventsUI.onClick(
@@ -191,9 +206,16 @@ const DefaultManagement = {
       //   }
       // }
       s(`.management-table-btn-save-${id}`).onclick = () => {
+        s(`.management-table-btn-save-${id}`).classList.add('hide');
+        // s(`.management-table-btn-stop-${id}`).classList.add('hide');
+        if (permissions.add) s(`.management-table-btn-add-${id}`).classList.remove('hide');
+        if (permissions.remove) s(`.management-table-btn-clean-${id}`).classList.remove('hide');
+        if (permissions.reload) s(`.management-table-btn-reload-${id}`).classList.remove('hide');
         AgGrid.grids[gridId].stopEditing();
       };
       EventsUI.onClick(`.management-table-btn-add-${id}`, async () => {
+        if (options.customEvent && options.customEvent.add) return await options.customEvent.add();
+
         const rowObj = {};
         for (const def of columnDefs) {
           rowObj[def.field] = '';
@@ -260,6 +282,11 @@ const DefaultManagement = {
         // }
 
         setTimeout(() => {
+          s(`.management-table-btn-save-${id}`).classList.remove('hide');
+          // s(`.management-table-btn-stop-${id}`).classList.remove('hide');
+          if (permissions.add) s(`.management-table-btn-add-${id}`).classList.add('hide');
+          if (permissions.remove) s(`.management-table-btn-clean-${id}`).classList.add('hide');
+          if (permissions.reload) s(`.management-table-btn-reload-${id}`).classList.add('hide');
           AgGrid.grids[gridId].startEditingCell({
             rowIndex: 0,
             colKey: defaultColKeyFocus,
@@ -268,6 +295,15 @@ const DefaultManagement = {
           });
         });
       });
+
+      EventsUI.onClick(`.management-table-btn-stop-${id}`, async () => {
+        s(`.management-table-btn-save-${id}`).classList.add('hide');
+        // s(`.management-table-btn-stop-${id}`).classList.add('hide');
+        if (permissions.add) s(`.management-table-btn-add-${id}`).classList.remove('hide');
+        if (permissions.remove) s(`.management-table-btn-clean-${id}`).classList.remove('hide');
+        if (permissions.reload) s(`.management-table-btn-reload-${id}`).classList.remove('hide');
+        AgGrid.grids[gridId].stopEditing();
+      });
       EventsUI.onClick(`.management-table-btn-clean-${id}`, async () => {
         const confirmResult = await Modal.RenderConfirm(
           {
@@ -292,6 +328,26 @@ const DefaultManagement = {
           DefaultManagement.loadTable(id);
         }
       });
+      EventsUI.onClick(`.management-table-btn-reload-${id}`, async () => {
+        try {
+          // Reload data from server
+          await DefaultManagement.loadTable(id);
+
+          // Other option: Refresh cells to update UI
+          // DefaultManagement.refreshTable(id);
+
+          NotificationManager.Push({
+            html: Translate.Render('success-reload-data') || 'Data reloaded successfully',
+            status: 'success',
+          });
+        } catch (error) {
+          NotificationManager.Push({
+            html: error.message || 'Error reloading data',
+            status: 'error',
+          });
+        } finally {
+        }
+      });
       s(`#ag-pagination-${gridId}`).addEventListener('page-change', async (event) => {
         const token = DefaultManagement.Tokens[id];
         token.page = event.detail.page;
@@ -318,7 +374,7 @@ const DefaultManagement = {
         }
       };
     }, 1);
-    return html`<div class="fl">
+    return html`<div class="fl management-table-toolbar">
         ${await BtnIcon.Render({
           class: `in fll section-mp management-table-btn-mini management-table-btn-add-${id} ${
             permissions.add ? '' : 'hide'
@@ -327,12 +383,15 @@ const DefaultManagement = {
           type: 'button',
         })}
         ${await BtnIcon.Render({
-          class: `in fll section-mp management-table-btn-mini management-table-btn-save-${id} ${
-            permissions.add ? '' : 'hide'
-          }`,
+          class: `in fll section-mp management-table-btn-mini management-table-btn-save-${id} hide`,
           label: html`<div class="abs center btn-save-${id}-label"><i class="fas fa-save"></i></div> `,
           type: 'button',
         })}
+        ${await BtnIcon.Render({
+          class: `in fll section-mp management-table-btn-mini management-table-btn-stop-${id} hide`,
+          label: html`<div class="abs center btn-save-${id}-label"><i class="fa-solid fa-rectangle-xmark"></i></div> `,
+          type: 'button',
+        })}
         ${await BtnIcon.Render({
           class: `in fll section-mp management-table-btn-mini management-table-btn-clean-${id} ${
             permissions.remove ? '' : 'hide'
@@ -340,12 +399,21 @@ const DefaultManagement = {
           label: html`<div class="abs center btn-clean-${id}-label"><i class="fas fa-broom"></i></div> `,
           type: 'button',
         })}
+        ${await BtnIcon.Render({
+          class: `in fll section-mp management-table-btn-mini management-table-btn-reload-${id} ${
+            permissions.reload ? '' : 'hide'
+          }`,
+          label: html`<div class="abs center btn-reload-${id}-label"><i class="fas fa-sync-alt"></i></div> `,
+          type: 'button',
+        })}
       </div>
       <div class="in section-mp">
         ${await AgGrid.Render({
           id: gridId,
           parentModal: options.idModal,
           usePagination: true,
+          paginationOptions,
+          customHeightOffset: !permissions.add && !permissions.remove && !permissions.reload ? 50 : 0,
           darkTheme,
           gridOptions: {
             defaultColDef: {
@@ -425,6 +493,7 @@ const DefaultManagement = {
                     //   rowNode.setData(newRow);
                     // }, 2000);
                   }
+                  s(`.management-table-btn-save-${id}`).click();
                 }
               } else {
                 const body = event.data ? event.data : {};
@@ -441,6 +510,7 @@ const DefaultManagement = {
                 }
               }
             },
+            ...(options.gridOptions ? options.gridOptions : undefined),
           },
         })}
       </div>`;

package/src/db/mariadb/MariaDB.js

@@ -42,9 +42,9 @@ class MariaDBService {
     try {
       conn = await pool.getConnection();
       result = await conn.query(query, { supportBigNumbers: true, bigNumberStrings: true });
-      logger.info(query, result);
+      logger.info('query');
+      console.log(result);
     } catch (error) {
-      if (error.stack.startsWith('TypeError: Do not know how to serialize a BigInt')) return;
       logger.error(error, error.stack);
     } finally {
       if (conn) conn.release(); // release to pool

package/src/index.js

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

package/src/server/client-build.js

@@ -32,6 +32,51 @@ dotenv.config();
 
 // Static Site Generation (SSG)
 
+/**
+ * Recursively copies files from source to destination, but only files that don't exist in destination.
+ * @function copyNonExistingFiles
+ * @param {string} src - Source directory path
+ * @param {string} dest - Destination directory path
+ * @returns {void}
+ * @memberof clientBuild
+ */
+const copyNonExistingFiles = (src, dest) => {
+  // Ensure source exists
+  if (!fs.existsSync(src)) {
+    throw new Error(`Source directory does not exist: ${src}`);
+  }
+
+  // Get stats for source
+  const srcStats = fs.statSync(src);
+
+  // If source is a file, copy only if it doesn't exist in destination
+  if (srcStats.isFile()) {
+    if (!fs.existsSync(dest)) {
+      const destDir = dir.dirname(dest);
+      fs.mkdirSync(destDir, { recursive: true });
+      fs.copyFileSync(src, dest);
+    }
+    return;
+  }
+
+  // If source is a directory, create destination if it doesn't exist
+  if (srcStats.isDirectory()) {
+    if (!fs.existsSync(dest)) {
+      fs.mkdirSync(dest, { recursive: true });
+    }
+
+    // Read all items in source directory
+    const items = fs.readdirSync(src);
+
+    // Recursively process each item
+    for (const item of items) {
+      const srcPath = dir.join(src, item);
+      const destPath = dir.join(dest, item);
+      copyNonExistingFiles(srcPath, destPath);
+    }
+  }
+};
+
 /**
  * @async
  * @function buildClient
@@ -83,6 +128,7 @@ const buildClient = async (options = { liveClientBuildPaths: [], instances: [] }
    * @param {string} options.publicClientId - Public client ID.
    * @param {boolean} options.iconsBuild - Whether to build icons.
    * @param {Object} options.metadata - Metadata for the client.
+   * @param {boolean} options.publicCopyNonExistingFiles - Whether to copy non-existing files from public directory.
    * @returns {Promise<void>} - Promise that resolves when the full build is complete.
    * @throws {Error} - If the full build fails.
    * @memberof clientBuild
@@ -98,6 +144,7 @@ const buildClient = async (options = { liveClientBuildPaths: [], instances: [] }
     publicClientId,
     iconsBuild,
     metadata,
+    publicCopyNonExistingFiles,
   }) => {
     logger.warn('Full build', rootClientPath);
 
@@ -169,11 +216,15 @@ const buildClient = async (options = { liveClientBuildPaths: [], instances: [] }
           fs.copySync(dist.styles, `${rootClientPath}${dist.public_styles_folder}`);
         }
       }
+
+    if (publicCopyNonExistingFiles)
+      copyNonExistingFiles(`./src/client/public/${publicCopyNonExistingFiles}`, rootClientPath);
   };
 
   // { srcBuildPath, publicBuildPath }
   const enableLiveRebuild =
     options && options.liveClientBuildPaths && options.liveClientBuildPaths.length > 0 ? true : false;
+  const isDevelopment = process.env.NODE_ENV === 'development';
 
   let currentPort = parseInt(process.env.PORT) + 1;
   for (const host of Object.keys(confServer)) {
@@ -205,7 +256,8 @@ const buildClient = async (options = { liveClientBuildPaths: [], instances: [] }
       } = confServer[host][path];
       if (singleReplica) continue;
       if (!confClient[client]) confClient[client] = {};
-      const { components, dists, views, services, metadata, publicRef } = confClient[client];
+      const { components, dists, views, services, metadata, publicRef, publicCopyNonExistingFiles } =
+        confClient[client];
       let backgroundImage;
       if (metadata) {
         backgroundImage = metadata.backgroundImage;
@@ -240,6 +292,7 @@ const buildClient = async (options = { liveClientBuildPaths: [], instances: [] }
           publicClientId,
           iconsBuild,
           metadata,
+          publicCopyNonExistingFiles,
         });
 
       if (components)
@@ -520,6 +573,7 @@ const buildClient = async (options = { liveClientBuildPaths: [], instances: [] }
                 apiBaseHost,
                 apiBasePath: process.env.BASE_API,
                 version: Underpost.version,
+                ...(isDevelopment ? { dev: true } : undefined),
               },
               renderApi: {
                 JSONweb,
@@ -613,6 +667,7 @@ Sitemap: https://${host}${path === '/' ? '' : path}/sitemap.xml`,
                   apiBaseHost,
                   apiBasePath: process.env.BASE_API,
                   version: Underpost.version,
+                  ...(isDevelopment ? { dev: true } : undefined),
                 },
                 renderApi: {
                   JSONweb,
@@ -687,4 +742,4 @@ ${fs.readFileSync(`${rootClientPath}/sw.js`, 'utf8')}`,
   }
 };
 
-export { buildClient };
+export { buildClient, copyNonExistingFiles };

package/src/server/object-layer.js

@@ -192,6 +192,49 @@ export class ObjectLayerEngine {
     return objectLayerFrameDirections;
   }
 
+  /**
+   * @memberof CyberiaObjectLayer
+   * @static
+   * @description Processes an image file through frameFactory and adds the resulting frame to the render data structure.
+   * Updates the color palette and pushes the frame to all keyframe directions corresponding to the given direction code.
+   * Initializes colors array, frames object, and direction arrays if they don't exist.
+   * @param {Object} renderData - The render data object containing frames and colors.
+   * @param {string} imagePath - The path to the image file to process.
+   * @param {string} directionCode - The numerical direction code (e.g., '08', '14').
+   * @returns {Promise<Object>} - The updated render data object.
+   * @memberof CyberiaObjectLayer
+   */
+  static async processAndPushFrame(renderData, imagePath, directionCode) {
+    // Initialize colors array if it doesn't exist
+    if (!renderData.colors) {
+      renderData.colors = [];
+    }
+
+    // Initialize frames object if it doesn't exist
+    if (!renderData.frames) {
+      renderData.frames = {};
+    }
+
+    // Process the image and extract frame matrix and updated colors
+    const frameFactoryResult = await ObjectLayerEngine.frameFactory(imagePath, renderData.colors);
+
+    // Update the colors palette
+    renderData.colors = frameFactoryResult.colors;
+
+    // Get all keyframe directions for this direction code
+    const keyframeDirections = ObjectLayerEngine.getKeyFramesDirectionsFromNumberFolderDirection(directionCode);
+
+    // Push the frame to all corresponding directions
+    for (const keyframeDirection of keyframeDirections) {
+      if (!renderData.frames[keyframeDirection]) {
+        renderData.frames[keyframeDirection] = [];
+      }
+      renderData.frames[keyframeDirection].push(frameFactoryResult.frame);
+    }
+
+    return renderData;
+  }
+
   /**
    * @memberof CyberiaObjectLayer
    * @static
@@ -290,5 +333,6 @@ export const readPngAsync = ObjectLayerEngine.readPngAsync;
 export const frameFactory = ObjectLayerEngine.frameFactory;
 export const getKeyFramesDirectionsFromNumberFolderDirection =
   ObjectLayerEngine.getKeyFramesDirectionsFromNumberFolderDirection;
+export const processAndPushFrame = ObjectLayerEngine.processAndPushFrame;
 export const buildImgFromTile = ObjectLayerEngine.buildImgFromTile;
 export const generateRandomStats = ObjectLayerEngine.generateRandomStats;

package/src/server/start.js

@@ -122,6 +122,12 @@ class UnderpostStartUp {
       if (options.build === true) await UnderpostStartUp.API.build(deployId, env);
       if (options.run === true) await UnderpostStartUp.API.run(deployId, env);
     },
+    /**
+     * Run itc-scripts and builds client bundle.
+     * @param {string} deployId - The ID of the deployment.
+     * @param {string} env - The environment of the deployment.
+     * @memberof UnderpostStartUp
+     */
     async build(deployId = 'dd-default', env = 'development') {
       const buildBasePath = `/home/dd`;
       const repoName = `engine-${deployId.split('-')[1]}`;
@@ -139,6 +145,12 @@ class UnderpostStartUp {
       }
       shellExec(`node bin/deploy build-full-client ${deployId}`);
     },
+    /**
+     * Runs a deployment.
+     * @param {string} deployId - The ID of the deployment.
+     * @param {string} env - The environment of the deployment.
+     * @memberof UnderpostStartUp
+     */
     async run(deployId = 'dd-default', env = 'development') {
       const runCmd = env === 'production' ? 'run prod-img' : 'run dev-img';
       if (fs.existsSync(`./engine-private/replica`)) {