underpost 2.8.871 → 2.8.873

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

@@ -2,8 +2,9 @@
 // https://www.ag-grid.com/javascript-data-grid/themes/
 
 import { ThemeEvents, darkTheme } from './Css.js';
-import { append, getProxyPath, htmls, s } from './VanillaJs.js';
-import * as agGrid from 'ag-grid-community';
+import { append, htmls, s } from './VanillaJs.js';
+import { getProxyPath } from './Router.js';
+import './Pagination.js';
 
 const AgGrid = {
   grids: {},
@@ -14,6 +15,9 @@ const AgGrid = {
       // Grid Options: Contains all of the grid configurations
       const gridOptions = {
         // Row Data: The data to be displayed.
+        pagination: false, // Disabled by default, will be handled by the management view
+        // paginationPageSize: 100,
+        // suppressPaginationPanel: true, // We are using our own custom pagination component
         // rowHeight: 60,
         enableCellChangeFlash: true,
         defaultColDef: {
@@ -23,6 +27,12 @@ const AgGrid = {
           filter: true,
           autoHeight: true,
         },
+        rowClassRules: {
+          'row-new-highlight': (params) => {
+            // a temporary flag we can set on new rows to highlight them
+            return params.data && params.data._new;
+          },
+        },
         // domLayout: 'autoHeight', || 'normal'
         // Column Definitions: Defines & controls grid columns.
         columnDefs: options?.gridOptions?.rowData?.[0]
@@ -48,13 +58,17 @@ const AgGrid = {
         }
       };
     });
+    const usePagination = options?.usePagination;
     return html`
-      <div
-        class="${id} ${this.theme}${options?.darkTheme ? `-dark` : ''}"
-        style="${options?.style
-          ? Object.keys(options.style).map((styleKey) => `${styleKey}: ${options.style[styleKey]}; `)
-          : 'height: 500px'}"
-      ></div>
+      <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>
     `;
   },
   RenderStyle: async function (
@@ -136,6 +150,10 @@ const AgGrid = {
           ${darkTheme
             ? html`
                 <style>
+                  .ag-row.row-new-highlight {
+                    background-color: #6d68ff !important;
+                    transition: background-color 1s ease-out;
+                  }
                   .ag-cell-data-changed,
                   .ag-cell-data-changed-animation {
                     background-color: #6d68ff !important;
@@ -145,6 +163,10 @@ const AgGrid = {
                 </style>
               `
             : html`<style>
+                .ag-row.row-new-highlight {
+                  background-color: #d0eaf8 !important;
+                  transition: background-color 1s ease-out;
+                }
                 .ag-cell-data-changed,
                 .ag-cell-data-changed-animation {
                   background-color: #d1d1d1 !important;

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

@@ -8,12 +8,14 @@ import { SignUp } from './SignUp.js';
 import { Translate } from './Translate.js';
 import { s } from './VanillaJs.js';
 
-const logger = loggerFactory(import.meta);
+const logger = loggerFactory(import.meta, { trace: true });
 
 const token = Symbol('token');
 
 const guestToken = Symbol('guestToken');
 
+const refreshTimeout = Symbol('refreshTimeout');
+
 const Auth = {
   [token]: '',
   [guestToken]: '',
@@ -35,50 +37,65 @@ const Auth = {
   getGuestToken: function () {
     return this[guestToken];
   },
-  // jwt
   getJWT: function () {
-    return `Bearer ${this.getToken() ? this.getToken() : this.getGuestToken()}`;
+    if (Auth.getToken()) return `Bearer ${Auth.getToken()}`;
+    if (Auth.getGuestToken()) return `Bearer ${Auth.getGuestToken()}`;
+    return '';
   },
-  signUpToken: async function (
-    result = {
-      data: {
-        token: '',
-        user: null,
-      },
-    },
-  ) {
+  decodeJwt: function (token) {
     try {
-      localStorage.setItem('jwt', result.data.token);
-      await SignUp.Trigger(result.data);
-      await Auth.sessionIn();
-    } catch (error) {
-      logger.error(error);
-      localStorage.removeItem('jwt');
+      return JSON.parse(atob(token.split('.')[1]));
+    } catch (e) {
+      return null;
     }
   },
+  scheduleTokenRefresh: function () {
+    if (this[refreshTimeout]) {
+      clearTimeout(this[refreshTimeout]);
+    }
+
+    const currentToken = Auth.getToken();
+    if (!currentToken) return;
+
+    const payload = Auth.decodeJwt(currentToken);
+    if (!payload || !payload.refreshExpiresAt) return;
+
+    const expiresIn = payload.refreshExpiresAt - Date.now();
+    const refreshBuffer = 2 * 60 * 1000; // 2 minutes
+    const refreshIn = expiresIn - refreshBuffer;
+
+    logger.info(`Token refresh in ${refreshIn / (1000 * 60)} minutes`);
+
+    if (refreshIn <= 0) return; // Already expired or close to it
+
+    this[refreshTimeout] = setTimeout(async () => {
+      const { data, status } = await UserService.get({ id: 'auth' });
+      if (status === 'success') {
+        logger.info('Refreshed access token.');
+        Auth.setToken(data.token);
+        localStorage.setItem('jwt', data.token);
+        Auth.scheduleTokenRefresh();
+      } else Auth.sessionOut();
+    }, refreshIn);
+  },
   sessionIn: async function (userServicePayload) {
     try {
       const token = userServicePayload?.data?.token ? userServicePayload.data.token : localStorage.getItem('jwt');
-
       if (token) {
-        this.setToken(token);
+        Auth.setToken(token);
+
         const result = userServicePayload
-          ? userServicePayload
-          : await (async () => {
-              const _result = await UserService.get({ id: 'auth' });
-              return {
-                status: _result.status,
-                message: _result.message,
-                data: {
-                  user: _result.data,
-                },
-              };
-            })();
+          ? userServicePayload // From login/signup
+          : await UserService.get({ id: 'auth' });
+
         const { status, data, message } = result;
         if (status === 'success') {
+          Auth.setToken(data.token);
           localStorage.setItem('jwt', token);
+          Auth.renderSessionUI();
           await LogIn.Trigger({ user: data.user });
           await Account.updateForm(data.user);
+          Auth.scheduleTokenRefresh();
           return { user: data.user };
         }
         if (message && message.match('expired'))
@@ -89,41 +106,67 @@ const Auth = {
               status: 'warning',
             });
           });
-        return await Auth.sessionOut();
       }
-
-      // anon guest session
-      this.deleteToken();
+      Auth.deleteToken();
       localStorage.removeItem('jwt');
-      let guestToken = localStorage.getItem('jwt.g');
 
-      if (!guestToken) {
-        const result = await UserService.post({ id: 'guest' });
-        localStorage.setItem('jwt.g', result.data.token);
-        guestToken = result.data.token;
-      }
-
-      this.setGuestToken(guestToken);
-      let { data, status, message } = await UserService.get({ id: 'auth' });
-      if (status === 'error') {
-        if (message && message.match('expired')) {
-          localStorage.removeItem('jwt.g');
-          return await Auth.sessionOut();
-        } else throw new Error(message);
+      // Anon guest session
+      let guestToken = localStorage.getItem('jwt.g');
+      if (guestToken) {
+        Auth.setGuestToken(guestToken);
+        let { data, status, message } = await UserService.get({ id: 'auth' });
+        if (status === 'success') {
+          await LogIn.Trigger(data);
+          await Account.updateForm(data.user);
+          return data;
+        } else logger.error(message);
       }
-      await Account.updateForm(data);
-      return { user: data };
+      return await Auth.sessionOut();
     } catch (error) {
       logger.error(error);
       return { user: UserMock.default };
     }
   },
   sessionOut: async function () {
-    this.deleteToken();
-    localStorage.removeItem('jwt');
-    const result = await this.sessionIn();
-    await LogOut.Trigger(result);
-    return result;
+    {
+      const result = await UserService.delete({ id: 'logout' });
+      localStorage.removeItem('jwt');
+      Auth.deleteToken();
+      if (this[refreshTimeout]) {
+        clearTimeout(this[refreshTimeout]);
+      }
+      Auth.renderGuestUi();
+      LogIn.Scope.user.main.model.user = {};
+      await LogOut.Trigger(result);
+    }
+    {
+      localStorage.removeItem('jwt.g');
+      Auth.deleteGuestToken();
+      const result = await UserService.post({ id: 'guest' });
+      localStorage.setItem('jwt.g', result.data.token);
+      Auth.setGuestToken(result.data.token);
+      return await Auth.sessionIn();
+    }
+  },
+  renderSessionUI: function () {
+    s(`.main-btn-log-in`).style.display = 'none';
+    s(`.main-btn-sign-up`).style.display = 'none';
+    s(`.main-btn-log-out`).style.display = null;
+    s(`.main-btn-account`).style.display = null;
+    setTimeout(() => {
+      if (s(`.modal-log-in`)) s(`.btn-close-modal-log-in`).click();
+      if (s(`.modal-sign-up`)) s(`.btn-close-modal-sign-up`).click();
+    });
+  },
+  renderGuestUi: function () {
+    s(`.main-btn-log-in`).style.display = null;
+    s(`.main-btn-sign-up`).style.display = null;
+    s(`.main-btn-log-out`).style.display = 'none';
+    s(`.main-btn-account`).style.display = 'none';
+    setTimeout(() => {
+      if (s(`.modal-log-out`)) s(`.btn-close-modal-log-out`).click();
+      if (s(`.modal-account`)) s(`.btn-close-modal-account`).click();
+    });
   },
 };
 

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

@@ -7,9 +7,9 @@ import { Modal } from './Modal.js';
 import { NotificationManager } from './NotificationManager.js';
 import { Panel } from './Panel.js';
 import { Responsive } from './Responsive.js';
-import { listenQueryPathInstance, RouterEvents, setQueryPath } from './Router.js';
+import { listenQueryPathInstance, RouterEvents, setQueryPath, getQueryParams } from './Router.js';
 import { Translate } from './Translate.js';
-import { append, getQueryParams, getTimeZone, htmls, s, sa } from './VanillaJs.js';
+import { append, getTimeZone, htmls, s, sa } from './VanillaJs.js';
 
 // https://fullcalendar.io/docs/event-object
 
@@ -346,7 +346,7 @@ const CalendarCore = {
                   status,
                 });
 
-                setQueryPath({ path: options.route, queryPath: '', replace: true });
+                setQueryPath({ path: options.route, queryPath: '' });
                 await CalendarCore.Data[options.idModal].updatePanel();
 
                 return { status };
@@ -363,7 +363,6 @@ const CalendarCore = {
       const cid = getQueryParams().cid ? getQueryParams().cid : '';
       if (lastCid === cid) return;
       lastCid = cid;
-      if (options.route === 'home') Modal.homeCid = newInstance(cid);
       if (s(`.main-body-calendar-${options.idModal}`)) {
         // if (Auth.getToken())
         // else getSrrData();

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

@@ -577,8 +577,7 @@ const getCurrentTrace = () => {
   try {
     _stack;
   } catch (error) {
-    console.error(error);
-    return error;
+    return error.stack;
   }
 };
 

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

@@ -1,6 +1,6 @@
 import { marked } from 'marked';
 import { FileService } from '../../services/file/file.service.js';
-import { append, getBlobFromUint8ArrayFile, getQueryParams, getRawContentFile, htmls, s } from './VanillaJs.js';
+import { append, getBlobFromUint8ArrayFile, getRawContentFile, htmls, s } from './VanillaJs.js';
 import { titleFormatted } from './CommonJs.js';
 import { Translate } from './Translate.js';
 import { Modal, renderViewTitle } from './Modal.js';
@@ -8,6 +8,7 @@ import { DocumentService } from '../../services/document/document.service.js';
 import { CoreService, getApiBaseUrl } from '../../services/core/core.service.js';
 import { loggerFactory } from './Logger.js';
 import { imageShimmer, renderChessPattern, renderCssAttr, styleFactory } from './Css.js';
+import { getQueryParams } from './Router.js';
 
 const logger = loggerFactory(import.meta);
 

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

@@ -3,7 +3,8 @@ import { CssCoreDark, CssCoreLight } from './CssCore.js';
 import { DropDown } from './DropDown.js';
 import { Modal } from './Modal.js';
 import { Translate } from './Translate.js';
-import { append, getProxyPath, htmls, s, sa } from './VanillaJs.js';
+import { append, htmls, s, sa } from './VanillaJs.js';
+import { getProxyPath } from './Router.js';
 
 let ThemesScope = [];
 

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

@@ -1,7 +1,8 @@
 import { AgGrid } from './AgGrid.js';
 import { borderChar, boxShadow, scrollBarDarkRender, scrollBarLightRender } from './Css.js';
 import { LoadingAnimation } from './LoadingAnimation.js';
-import { append, getProxyPath, s } from './VanillaJs.js';
+import { append, s } from './VanillaJs.js';
+import { getProxyPath } from './Router.js';
 
 const CssCommonCore = async () => {
   if (!s(`.fa-link`))

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

@@ -1,12 +1,11 @@
 import { Badge } from './Badge.js';
 import { BtnIcon } from './BtnIcon.js';
-import { rgbToHex } from './CommonJs.js';
-import { Css, darkTheme, dynamicCol, renderCssAttr, simpleIconsRender, ThemeEvents, Themes } from './Css.js';
+import { Css, renderCssAttr, simpleIconsRender, ThemeEvents, Themes } from './Css.js';
 import { DropDown } from './DropDown.js';
 import { buildBadgeToolTipMenuOption, Modal, renderMenuLabel, renderViewTitle } from './Modal.js';
-import { listenQueryPathInstance, setQueryPath, closeModalRouteChangeEvent } from './Router.js';
+import { listenQueryPathInstance, setQueryPath, closeModalRouteChangeEvent, getProxyPath } from './Router.js';
 import { Translate } from './Translate.js';
-import { getProxyPath, getQueryParams, htmls, s, sa } from './VanillaJs.js';
+import { htmls, s } from './VanillaJs.js';
 import Sortable from 'sortablejs';
 
 // https://mintlify.com/docs/quickstart
@@ -34,6 +33,7 @@ const Docs = {
       },
       maximize: true,
       mode: 'view',
+      route: 'docs',
       slideMenu: 'modal-menu',
       observer: true,
       barMode: 'top-bottom-bar',

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

@@ -4,8 +4,7 @@ import { FileService } from '../../services/file/file.service.js';
 import { AgGrid } from './AgGrid.js';
 import { Auth } from './Auth.js';
 import { BtnIcon } from './BtnIcon.js';
-import { getSubpaths, timer, uniqueArray } from './CommonJs.js';
-import { Content } from './Content.js';
+import { getSubpaths, uniqueArray } from './CommonJs.js';
 import { darkTheme, renderCssAttr } from './Css.js';
 import { EventsUI } from './EventsUI.js';
 import { fileFormDataFactory, Input, InputFile } from './Input.js';
@@ -15,7 +14,8 @@ import { NotificationManager } from './NotificationManager.js';
 import { RouterEvents } from './Router.js';
 import { Translate } from './Translate.js';
 import { Validator } from './Validator.js';
-import { copyData, downloadFile, getProxyPath, getQueryParams, s, setPath } from './VanillaJs.js';
+import { copyData, downloadFile, s } from './VanillaJs.js';
+import { getProxyPath, getQueryParams, setPath } from './Router.js';
 
 const logger = loggerFactory(import.meta);
 

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

@@ -1,7 +1,7 @@
 import JoystickController from 'joystick-controller';
 import { getDirection, getId } from './CommonJs.js';
-import { loggerFactory } from './Logger.js';
-import { append, getProxyPath, s } from './VanillaJs.js';
+import { append, s } from './VanillaJs.js';
+import { getProxyPath } from './Router.js';
 
 const logger = loggerFactory(import.meta);
 

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

@@ -1,9 +1,9 @@
-import { CoreService } from '../../services/core/core.service.js';
 import { BtnIcon } from './BtnIcon.js';
 import { s4 } from './CommonJs.js';
 import { darkTheme, renderCssAttr, subThemeManager } from './Css.js';
 import { loggerFactory } from './Logger.js';
-import { append, getAllChildNodes, getProxyPath, htmls, s, sa } from './VanillaJs.js';
+import { append, htmls, s } from './VanillaJs.js';
+import { getProxyPath } from './Router.js';
 
 const logger = loggerFactory(import.meta);
 

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

@@ -24,8 +24,9 @@ const LogIn = {
   Event: {},
   Trigger: async function (options) {
     const { user } = options;
-    await Webhook.register({ user });
     for (const eventKey of Object.keys(this.Event)) await this.Event[eventKey](options);
+    if (!user || user.role === 'guest') return;
+    await Webhook.register({ user });
     if (s(`.session`))
       htmls(
         `.session`,
@@ -72,19 +73,18 @@ const LogIn = {
           imageSrc,
         };
       }
+      htmls(
+        `.action-btn-profile-log-in-render`,
+        html`<div class="abs center top-box-profile-img-container">
+          <img
+            class="abs center top-box-profile-img"
+            ${this.Scope.user.main.model.user.profileImage
+              ? `src="${this.Scope.user.main.model.user.profileImage.imageSrc}"`
+              : ``}
+          />
+        </div>`,
+      );
     }
-
-    htmls(
-      `.action-btn-profile-log-in-render`,
-      html`<div class="abs center top-box-profile-img-container">
-        <img
-          class="abs center top-box-profile-img"
-          ${this.Scope.user.main.model.user.profileImage
-            ? `src="${this.Scope.user.main.model.user.profileImage.imageSrc}"`
-            : ``}
-        />
-      </div>`,
-    );
   },
   Render: async function () {
     setTimeout(async () => {
@@ -103,13 +103,7 @@ const LogIn = {
           if ('model' in inputData) body[inputData.model] = s(`.${inputData.id}`).value;
         }
         const result = await UserService.post({ id: 'auth', body });
-        if (result.status === 'success') {
-          await Auth.sessionIn(result);
-          setTimeout(() => {
-            if (s(`.modal-log-in`)) s(`.btn-close-modal-log-in`).click();
-            if (s(`.modal-sign-up`)) s(`.btn-close-modal-sign-up`).click();
-          });
-        }
+
         if (result.status === 'error' && result.message.match('attempts')) {
           htmls(`.login-attempt-warn-value`, result.message.split(':')[1]);
           s(`.login-attempt-warn-container`).classList.remove('hide');
@@ -119,6 +113,8 @@ const LogIn = {
           htmls(`.login-attempt-warn-value0`, result.message.split(':')[1]);
           s(`.login-attempt-warn-container0`).classList.remove('hide');
         } else s(`.login-attempt-warn-container0`).classList.add('hide');
+
+        if (result.status === 'success') await Auth.sessionIn(result);
         NotificationManager.Push({
           html: result.status === 'success' ? Translate.Render(`${result.status}-user-log-in`) : result.message,
           status: result.status,
@@ -189,9 +185,6 @@ const LogIn = {
       </form>
     `;
   },
-  cleanMainUser: () => {
-    LogIn.Scope.user.main.model.user = {};
-  },
 };
 
 export { LogIn };

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

@@ -4,11 +4,11 @@ import { LogIn } from './LogIn.js';
 import { Translate } from './Translate.js';
 import { htmls, s } from './VanillaJs.js';
 import { Webhook } from './Webhook.js';
+import { NotificationManager } from './NotificationManager.js';
 
 const LogOut = {
   Event: {},
   Trigger: async function (options) {
-    LogIn.cleanMainUser();
     await Webhook.unregister();
     for (const eventKey of Object.keys(this.Event)) await this.Event[eventKey](options);
     if (s(`.session`))
@@ -41,6 +41,10 @@ const LogOut = {
       s('.btn-log-out').onclick = async (e) => {
         e.preventDefault();
         await Auth.sessionOut();
+        NotificationManager.Push({
+          html: Translate.Render(`success-logout`),
+          status: 'success',
+        });
       };
     });
     // Translate.Render('confirm-logout')

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

@@ -1,4 +1,6 @@
-const loggerFactory = (meta) => {
+import { getCurrentTrace } from './CommonJs.js';
+
+const loggerFactory = (meta, options = { trace: false }) => {
   meta = meta.url.split('/').pop();
   const types = ['error', 'warn', 'info', 'debug'];
   const logger = {
@@ -9,6 +11,7 @@ const loggerFactory = (meta) => {
         console.info = () => null;
         console.warn = () => null;
       }
+      if (options.trace === true) args.push(getCurrentTrace().split('Logger.js:23')[1]);
       return location.hostname === 'localhost'
         ? console[type](`[${meta}] ${new Date().toISOString()} ${type}:`, ...args)
         : null;

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

@@ -1,16 +1,6 @@
-import { cap, getId, newInstance } from './CommonJs.js';
+import { getId, newInstance } from './CommonJs.js';
 import { Draggable } from '@neodrag/vanilla';
-import {
-  append,
-  s,
-  prepend,
-  setPath,
-  getProxyPath,
-  htmls,
-  sa,
-  getAllChildNodes,
-  isActiveElement,
-} from './VanillaJs.js';
+import { append, s, prepend, htmls, sa, getAllChildNodes, isActiveElement } from './VanillaJs.js';
 import { BtnIcon } from './BtnIcon.js';
 import { Responsive } from './Responsive.js';
 import { loggerFactory } from './Logger.js';
@@ -24,12 +14,18 @@ import {
   renderStatus,
   renderCssAttr,
 } from './Css.js';
-import { setDocTitle, closeModalRouteChangeEvent, handleModalViewRoute } from './Router.js';
+import {
+  setDocTitle,
+  closeModalRouteChangeEvent,
+  handleModalViewRoute,
+  getProxyPath,
+  setPath,
+  coreUI,
+} from './Router.js';
 import { NotificationManager } from './NotificationManager.js';
 import { EventsUI } from './EventsUI.js';
 import { Translate } from './Translate.js';
 import { Input, isTextInputFocused } from './Input.js';
-import { Validator } from './Validator.js';
 import { DropDown } from './DropDown.js';
 import { Keyboard } from './Keyboard.js';
 import { Badge } from './Badge.js';
@@ -186,9 +182,7 @@ const Modal = {
                     htmls(
                       `.default-slide-menu-top-bar-fix-title-container`,
                       html`
-                        <div class="inl default-slide-menu-top-bar-fix-title-container-text">
-                          ${options.RouterInstance.BannerAppTemplate}
-                        </div>
+                        <div class="inl default-slide-menu-top-bar-fix-title-container-text">${options.title}</div>
                       `,
                     );
                   } else
@@ -274,6 +268,7 @@ const Modal = {
               s(`.btn-menu-${idModal}`).classList.remove('hide');
               s(`.${idModal}`).style.width = `${this.Data[idModal][options.mode].width}px`;
               s(`.html-${idModal}`).style.display = 'none';
+              // s(`.title-modal-${idModal}`).style.display = 'none';
               setTimeout(() => {
                 s(`.main-body-btn-ui-menu-close`).classList.add('hide');
                 s(`.main-body-btn-ui-menu-menu`).classList.remove('hide');
@@ -281,9 +276,6 @@ const Modal = {
                   s(`.btn-bar-center-icon-menu`).classList.remove('hide');
                   s(`.btn-bar-center-icon-close`).classList.add('hide');
                 }
-              });
-              // s(`.title-modal-${idModal}`).style.display = 'none';
-              setTimeout(() => {
                 s(`.main-body-btn-container`).style[
                   true || (options.mode && options.mode.match('right')) ? 'right' : 'left'
                 ] = `${0}px`;
@@ -787,8 +779,7 @@ const Modal = {
                     dragDisabled: true,
                     maximize: true,
                     heightBottomBar: 0,
-                    heightTopBar: originHeightTopBar,
-                    barMode: options.barMode,
+                    heightTopBar: options.heightTopBar,
                   });
 
                   // Bind hover/focus and click-outside to dismiss
@@ -1755,9 +1746,8 @@ const Modal = {
         if (!s(`.${idModal}`)) return;
         this.removeModal(idModal);
         // Handle modal route change
-        if (options.route || options.query) {
-          closeModalRouteChangeEvent({ closedId: idModal, homeCid: Modal.homeCid });
-        }
+        closeModalRouteChangeEvent({ closedId: idModal });
+        // history.back();
       }, 300);
     };
     s(`.btn-close-${idModal}`).onclick = btnCloseEvent;
@@ -1957,7 +1947,7 @@ const Modal = {
       const modal = Modal.Data[idModal];
       if (!modal) return false;
       // Don't close the core UI elements
-      const coreUI = ['modal-menu', 'main-body', 'main-body-top', 'bottom-bar', 'board-notification'];
+
       if (coreUI.find((id) => idModal.startsWith(id))) {
         return false;
       }
@@ -1970,7 +1960,7 @@ const Modal = {
     });
 
     // 2. Navigate to home first, creating a new history entry.
-    setPath(getProxyPath());
+    setPath(`${getProxyPath()}${location.search ?? ''}${location.hash ?? ''}`);
     setDocTitle();
 
     // 3. Close the modals without them affecting the URL.

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

@@ -4,7 +4,8 @@ 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 { s, append, hexToRgbA } from './VanillaJs.js';
+import { getProxyPath } from './Router.js';
 import { s4 } from './CommonJs.js';
 import { Input } from './Input.js';
 import { ToggleSwitch } from './ToggleSwitch.js';