@underpostnet/underpost 2.97.0 → 2.97.5

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

@@ -7,7 +7,7 @@ import { loggerFactory } from '../../components/core/Logger.js';
 import { Modal } from '../../components/core/Modal.js';
 import { NotificationManager } from '../../components/core/NotificationManager.js';
 import { Translate } from '../../components/core/Translate.js';
-import { getQueryParams, RouterEvents, setQueryParams } from '../../components/core/Router.js';
+import { getQueryParams, listenQueryParamsChange, RouterEvents, setQueryParams } from '../../components/core/Router.js';
 import { s } from '../../components/core/VanillaJs.js';
 import { DefaultService } from './default.service.js';
 
@@ -52,49 +52,136 @@ const columnDefFormatter = (obj, columnDefs, customFormat) => {
 
 const DefaultManagement = {
   Tokens: {},
-  loadTable: async function (id, options = { reload: true, force: true }) {
-    const { serviceId, columnDefs, customFormat } = this.Tokens[id];
-
-    let _page = this.Tokens[id].page;
-    let _limit = this.Tokens[id].limit;
-    let _id = this.Tokens[id].serviceOptions?.get?.id ?? undefined;
-    if (!options.force && this.Tokens[id].lastOptions) {
-      if (
-        _page === this.Tokens[id].lastOptions.page &&
-        _limit === this.Tokens[id].lastOptions.limit &&
-        _id === this.Tokens[id].lastOptions.id
-      ) {
-        logger.warn(`DefaultManagement loadTable ${serviceId} - Skipping load, options unchanged`);
-        return;
+  loadTable: async function (id, options = { reload: true, force: true, createHistory: false, skipUrlUpdate: false }) {
+    try {
+      const { serviceId, columnDefs, customFormat, gridId } = this.Tokens[id];
+
+      let _page = this.Tokens[id].page;
+      let _limit = this.Tokens[id].limit;
+      let _id = this.Tokens[id].serviceOptions?.get?.id ?? undefined;
+
+      let filterModel = this.Tokens[id].filterModel || {};
+      let sortModel = this.Tokens[id].sortModel || [];
+
+      const gridApi = this.Tokens[id].gridApi || AgGrid.grids[gridId];
+
+      if (gridApi) {
+        filterModel = gridApi.getFilterModel() || {};
+        const columnState = gridApi.getColumnState();
+        if (columnState) {
+          sortModel = columnState
+            .filter((col) => col.sort)
+            .map((col) => ({ colId: col.colId, sort: col.sort, sortIndex: col.sortIndex }))
+            .sort((a, b) => (a.sortIndex || 0) - (b.sortIndex || 0));
+        }
       }
-    }
-    this.Tokens[id].lastOptions = {
-      page: _page,
-      limit: _limit,
-      id: _id,
-    };
 
-    const result = await this.Tokens[id].ServiceProvider.get({
-      page: _page,
-      limit: _limit,
-      id: _id,
-    });
-    if (result.status === 'success') {
-      const { data, total, page, totalPages } = result.data;
-      this.Tokens[id].total = total;
-      this.Tokens[id].page = page;
-      this.Tokens[id].totalPages = totalPages;
-      const rowDataScope = data.map((row) => columnDefFormatter(row, columnDefs, customFormat));
-      if (options.reload) AgGrid.grids[this.Tokens[id].gridId].setGridOption('rowData', rowDataScope);
-      const paginationComp = s(`#ag-pagination-${this.Tokens[id].gridId}`);
-      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);
+      // Clean up filterModel and sortModel for URL params
+      const filterModelStr = Object.keys(filterModel).length > 0 ? JSON.stringify(filterModel) : null;
+      const sortModelStr = sortModel.length > 0 ? JSON.stringify(sortModel) : null;
+
+      // Update URL parameters to reflect current grid state
+      // Use pushState (createHistory) for filter/sort changes to enable browser back/forward
+      // Skip URL update when handling browser navigation to avoid interfering with history
+      if (!options.skipUrlUpdate) {
+        setQueryParams(
+          {
+            page: _page,
+            limit: _limit,
+            filterModel: filterModelStr,
+            sortModel: sortModelStr,
+          },
+          { replace: !options.createHistory },
+        );
+      }
+
+      if (!options.force && this.Tokens[id].lastOptions) {
+        const last = this.Tokens[id].lastOptions;
+        if (
+          _page === last.page &&
+          _limit === last.limit &&
+          _id === last.id &&
+          JSON.stringify(filterModel) === JSON.stringify(last.filterModel) &&
+          JSON.stringify(sortModel) === JSON.stringify(last.sortModel)
+        ) {
+          logger.warn(`DefaultManagement loadTable ${serviceId} - Skipping load, options unchanged`);
+          return;
+        }
+      }
+      this.Tokens[id].lastOptions = {
+        page: _page,
+        limit: _limit,
+        id: _id,
+        filterModel,
+        sortModel,
+      };
+
+      // Update tokens with current state
+      this.Tokens[id].filterModel = filterModel;
+      this.Tokens[id].sortModel = sortModel;
+
+      const queryOptions = {
+        page: _page,
+        limit: _limit,
+      };
+
+      if (_id) {
+        queryOptions.id = _id;
+      }
+
+      if (filterModel && Object.keys(filterModel).length > 0) {
+        queryOptions.filterModel = filterModel;
+      }
+
+      if (sortModel && sortModel.length > 0) {
+        queryOptions.sortModel = sortModel;
+        // Legacy simple sort support
+        if (sortModel.length === 1) {
+          queryOptions.sort = sortModel[0].colId;
+          queryOptions.asc = sortModel[0].sort === 'asc' ? '1' : '0';
+        }
+      }
+
+      logger.info(`Loading table ${serviceId}`, {
+        page: _page,
+        limit: _limit,
+        hasFilters: Object.keys(filterModel).length > 0,
+      });
+
+      const result = await this.Tokens[id].ServiceProvider.get(queryOptions);
+      if (result.status === 'success') {
+        const { data, total, page, totalPages } = result.data;
+        this.Tokens[id].total = total;
+        this.Tokens[id].page = page;
+        this.Tokens[id].totalPages = totalPages;
+        const rowDataScope = data.map((row) => columnDefFormatter(row, columnDefs, customFormat));
+        if (options.reload) {
+          const grid = AgGrid.grids[this.Tokens[id].gridId];
+          if (grid && grid.setGridOption) {
+            grid.setGridOption('rowData', rowDataScope);
+          } else {
+            logger.warn(`Grid ${gridId} not found or not ready for setGridOption`);
+          }
+        }
+        const paginationComp = s(`#ag-pagination-${this.Tokens[id].gridId}`);
+        if (paginationComp) {
+          paginationComp.setAttribute('current-page', this.Tokens[id].page);
+          paginationComp.setAttribute('total-pages', this.Tokens[id].totalPages);
+          paginationComp.setAttribute('total-items', this.Tokens[id].total);
+        } else {
+          logger.warn(`Pagination component not found for grid ${gridId}`);
+        }
+        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);
+      } else {
+        logger.error(`Failed to load table ${serviceId}:`, result);
+      }
+    } catch (error) {
+      logger.error(`Error in loadTable for ${id}:`, error);
+      throw error;
     }
   },
   refreshTable: async function (id) {
@@ -115,13 +202,100 @@ const DefaultManagement = {
     logger.info('DefaultManagement RenderTable', options);
     const id = options?.idModal ? options.idModal : getId(this.Tokens, `${serviceId}-`);
     const gridId = `${serviceId}-grid-${id}`;
+    const queryParamsListenerId = `default-management-${id}`;
     const queryParams = getQueryParams();
     const page = parseInt(queryParams.page) || 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 });
+    let filterModel = {};
+    let sortModel = [];
+    try {
+      if (queryParams.filterModel) filterModel = JSON.parse(queryParams.filterModel);
+      if (queryParams.sortModel) sortModel = JSON.parse(queryParams.sortModel);
+    } catch (e) {
+      logger.warn('Error parsing filter/sort model from URL', e);
+    }
+
+    // Enhance column definitions for Date filtering and ensure colId
+    const enhancedColumnDefs = columnDefs.map((col) => {
+      const enhancedCol = {
+        ...col,
+        colId: col.field, // Ensure colId matches field
+      };
+
+      if (enhancedCol.cellDataType === 'date' || enhancedCol.filter === 'agDateColumnFilter') {
+        enhancedCol.filter = 'agDateColumnFilter';
+
+        // Value getter to ensure date is properly parsed
+        if (!enhancedCol.valueGetter) {
+          enhancedCol.valueGetter = (params) => {
+            const value = params.data?.[enhancedCol.field];
+            if (!value) return null;
+            const date = new Date(value);
+            return isNaN(date.getTime()) ? null : date;
+          };
+        }
+
+        // Value formatter for display
+        if (!enhancedCol.valueFormatter) {
+          enhancedCol.valueFormatter = (params) => {
+            if (!params.value) return '';
+            const date = new Date(params.value);
+            if (isNaN(date.getTime())) return '';
+            return date.toLocaleDateString('en-US', {
+              year: 'numeric',
+              month: '2-digit',
+              day: '2-digit',
+            });
+          };
+        }
+
+        enhancedCol.filterParams = {
+          comparator: (filterLocalDateAtMidnight, cellValue) => {
+            if (cellValue == null) return -1;
+            const cellDate = new Date(cellValue);
+            if (isNaN(cellDate.getTime())) return -1;
+            // Compare dates (ignoring time)
+            const cellTime = new Date(cellDate).setHours(0, 0, 0, 0);
+            const filterTime = filterLocalDateAtMidnight.getTime();
+            if (filterTime === cellTime) return 0;
+            if (cellTime < filterTime) return -1;
+            if (cellTime > filterTime) return 1;
+            return 0;
+          },
+          browserDatePicker: true,
+          minValidYear: 2000,
+          maxValidYear: 2100,
+          inRangeInclusive: true,
+          debounceMs: 500,
+          ...enhancedCol.filterParams,
+        };
+      }
+      return enhancedCol;
+    });
+
+    this.Tokens[id] = {
+      ...this.Tokens[id],
+      ...options,
+      columnDefs: enhancedColumnDefs, // Use enhanced definitions
+      gridId,
+      page,
+      limit,
+      total: 0,
+      totalPages: 1,
+      filterModel,
+      sortModel,
+      isInitializing: true, // Flag to prevent double loading during grid ready
+      isProcessingQueryChange: false, // Flag to prevent listener recursion
+    };
+
+    setQueryParams({
+      page,
+      limit,
+      filterModel: Object.keys(filterModel).length > 0 ? JSON.stringify(filterModel) : null,
+      sortModel: sortModel.length > 0 ? JSON.stringify(sortModel) : null,
+    });
     setTimeout(async () => {
       // https://www.ag-grid.com/javascript-data-grid/data-update-transactions/
 
@@ -203,7 +377,7 @@ const DefaultManagement = {
 
       AgGrid.grids[gridId].setGridOption(
         'columnDefs',
-        columnDefs.concat(
+        enhancedColumnDefs.concat(
           permissions.remove
             ? [
                 {
@@ -217,7 +391,7 @@ const DefaultManagement = {
             : [],
         ),
       );
-      DefaultManagement.loadTable(id);
+      // Initial loadTable is now called in onGridReady after grid is fully initialized
       // {
       //   const result = await ServiceProvider.get();
       //   if (result.status === 'success') {
@@ -348,6 +522,110 @@ const DefaultManagement = {
           DefaultManagement.loadTable(id);
         }
       });
+
+      // Listen to query parameter changes for browser back/forward navigation
+      listenQueryParamsChange({
+        id: queryParamsListenerId,
+        event: (queryParams) => {
+          // Prevent recursion - if we're already processing a query change, skip
+          if (this.Tokens[id].isProcessingQueryChange) {
+            return;
+          }
+
+          const newPage = parseInt(queryParams.page, 10) || 1;
+          const newLimit = parseInt(queryParams.limit, 10) || this.Tokens[id].limit || 10;
+          const newFilterModel = queryParams.filterModel;
+          const newSortModel = queryParams.sortModel;
+
+          let shouldReload = false;
+
+          // Check if page or limit changed
+          if (newPage !== this.Tokens[id].page || newLimit !== this.Tokens[id].limit) {
+            this.Tokens[id].page = newPage;
+            this.Tokens[id].limit = newLimit;
+            shouldReload = true;
+          }
+
+          // Check if filter or sort changed by comparing with actual grid state
+          const gridApi = AgGrid.grids[gridId];
+          let filterChanged = false;
+          let sortChanged = false;
+
+          if (gridApi) {
+            // Get current grid filter state
+            const currentGridFilterModel = gridApi.getFilterModel() || {};
+            const currentGridFilterStr = JSON.stringify(currentGridFilterModel);
+            const newFilterStr = newFilterModel || '{}';
+
+            // Get current grid sort state
+            const currentColumnState = gridApi.getColumnState() || [];
+            const currentGridSortModel = currentColumnState
+              .filter((col) => col.sort)
+              .map((col) => ({ colId: col.colId, sort: col.sort, sortIndex: col.sortIndex }))
+              .sort((a, b) => (a.sortIndex || 0) - (b.sortIndex || 0));
+            const currentGridSortStr = JSON.stringify(currentGridSortModel);
+            const newSortStr = newSortModel || '[]';
+
+            filterChanged = currentGridFilterStr !== newFilterStr;
+            sortChanged = currentGridSortStr !== newSortStr;
+          }
+
+          if (filterChanged || sortChanged) {
+            // Parse and apply the new filter/sort models
+            try {
+              this.Tokens[id].filterModel = newFilterModel ? JSON.parse(newFilterModel) : {};
+            } catch (e) {
+              this.Tokens[id].filterModel = {};
+            }
+            try {
+              this.Tokens[id].sortModel = newSortModel ? JSON.parse(newSortModel) : [];
+            } catch (e) {
+              this.Tokens[id].sortModel = [];
+            }
+
+            // Apply filters and sorts to the grid
+            if (gridApi) {
+              // Temporarily disable filter/sort change handlers to prevent recursion
+              this.Tokens[id].isProcessingQueryChange = true;
+
+              if (filterChanged) {
+                gridApi.setFilterModel(this.Tokens[id].filterModel);
+              }
+
+              if (sortChanged) {
+                // Apply sort model
+                const columnState = this.Tokens[id].sortModel.map((sortItem) => ({
+                  colId: sortItem.colId,
+                  sort: sortItem.sort,
+                  sortIndex: sortItem.sortIndex,
+                }));
+                if (columnState.length > 0) {
+                  gridApi.applyColumnState({
+                    state: columnState,
+                    defaultState: { sort: null },
+                  });
+                } else {
+                  gridApi.applyColumnState({
+                    defaultState: { sort: null },
+                  });
+                }
+              }
+
+              // Re-enable handlers after a short delay
+              setTimeout(() => {
+                this.Tokens[id].isProcessingQueryChange = false;
+              }, 100);
+            }
+            shouldReload = true;
+          }
+
+          if (shouldReload) {
+            // Skip URL update since browser already changed it (back/forward navigation)
+            DefaultManagement.loadTable(id, { reload: true, force: true, createHistory: false, skipUrlUpdate: true });
+          }
+        },
+      });
+
       EventsUI.onClick(`.management-table-btn-reload-${id}`, async () => {
         try {
           // Reload data from server
@@ -371,26 +649,75 @@ const DefaultManagement = {
       s(`#ag-pagination-${gridId}`).addEventListener('page-change', async (event) => {
         const token = DefaultManagement.Tokens[id];
         token.page = event.detail.page;
-        await DefaultManagement.loadTable(id);
+        // Skip URL update since Pagination component already updated it
+        await DefaultManagement.loadTable(id, { skipUrlUpdate: true });
       });
       s(`#ag-pagination-${gridId}`).addEventListener('limit-change', async (event) => {
         const token = DefaultManagement.Tokens[id];
         token.limit = event.detail.limit;
         token.page = 1; // Reset to first page
-        await DefaultManagement.loadTable(id);
+        // Skip URL update since Pagination component already updated it
+        await DefaultManagement.loadTable(id, { skipUrlUpdate: true });
       });
       RouterEvents[id] = async (...args) => {
         const queryParams = getQueryParams();
         const page = parseInt(queryParams.page) || 1;
         const limit = parseInt(queryParams.limit) || 10;
+        let filterModel = {};
+        let sortModel = [];
+        try {
+          if (queryParams.filterModel) filterModel = JSON.parse(queryParams.filterModel);
+          if (queryParams.sortModel) sortModel = JSON.parse(queryParams.sortModel);
+        } catch (e) {}
+
         const token = DefaultManagement.Tokens[id];
+        if (!token) {
+          // Token doesn't exist yet, table hasn't been initialized
+          return;
+        }
+
+        // Check if state in URL is different from current state
+        const isPaginationChanged = token.page !== page || token.limit !== limit;
+        const isFilterChanged = JSON.stringify(token.filterModel || {}) !== JSON.stringify(filterModel);
+        const isSortChanged = JSON.stringify(token.sortModel || []) !== JSON.stringify(sortModel);
 
-        // Check if the pagination state in the URL is different from the current state
-        if (token.page !== page || token.limit !== limit) {
+        if (isPaginationChanged || isFilterChanged || isSortChanged) {
           token.page = page;
           token.limit = limit;
-          // Reload the table with the new pagination state from the URL
-          await DefaultManagement.loadTable(id);
+          token.filterModel = filterModel;
+          token.sortModel = sortModel;
+
+          // If grid is active, we should update its state to match URL
+          const gridApi = AgGrid.grids[gridId];
+          if (gridApi && gridApi.setFilterModel && gridApi.applyColumnState) {
+            // Updating filter/sort on grid will trigger onFilterChanged/onSortChanged -> loadTable
+            // But we must ensure it happens.
+            if (isFilterChanged) {
+              try {
+                gridApi.setFilterModel(filterModel);
+              } catch (e) {
+                console.warn('Failed to set filter model:', e);
+              }
+            }
+            if (isSortChanged) {
+              try {
+                gridApi.applyColumnState({
+                  state: sortModel,
+                  defaultState: { sort: null },
+                });
+              } catch (e) {
+                console.warn('Failed to apply column state:', e);
+              }
+            }
+            // If only pagination changed, we must load manually because no grid event triggers
+            if (isPaginationChanged && !isFilterChanged && !isSortChanged) {
+              await DefaultManagement.loadTable(id);
+            }
+          } else if (!gridApi) {
+            // Grid doesn't exist yet, just load the table data when it's ready
+            // The onGridReady event will handle applying the initial state
+            logger.warn(`Grid not ready for ${gridId}, state will be applied on grid ready`);
+          }
         }
       };
     }, 1);
@@ -444,19 +771,69 @@ const DefaultManagement = {
               filter: true,
               autoHeight: true,
             },
-            editType: 'fullRow',
+            onGridReady: (params) => {
+              this.Tokens[id].gridApi = params.api;
+              // Apply initial state from URL
+              const { filterModel, sortModel } = this.Tokens[id];
+              if (filterModel && Object.keys(filterModel).length > 0) {
+                params.api.setFilterModel(filterModel);
+              }
+              if (sortModel && sortModel.length > 0) {
+                params.api.applyColumnState({
+                  state: sortModel,
+                  defaultState: { sort: null },
+                });
+              }
+              // Load initial data now that grid is ready
+              // Filter/sort state has been applied, this will fetch data from server
+              DefaultManagement.loadTable(id).finally(() => {
+                // Mark initialization complete to allow future filter/sort events
+                this.Tokens[id].isInitializing = false;
+              });
+            },
+            onFilterChanged: () => {
+              // Skip if still initializing (state being applied in onGridReady)
+              if (this.Tokens[id].isInitializing) return;
+              // Skip if we're processing a query change from browser navigation
+              if (this.Tokens[id].isProcessingQueryChange) return;
+              // Reset to page 1 on filter change
+              this.Tokens[id].page = 1;
+              // Create history entry for filter changes
+              DefaultManagement.loadTable(id, { reload: true, force: true, createHistory: true });
+            },
+            onSortChanged: () => {
+              // Skip if still initializing (state being applied in onGridReady)
+              if (this.Tokens[id].isInitializing) return;
+              // Skip if we're processing a query change from browser navigation
+              if (this.Tokens[id].isProcessingQueryChange) return;
+              // Create history entry for sort changes
+              DefaultManagement.loadTable(id, { reload: true, force: true, createHistory: true });
+            },
+            editType: 'fullRow', // Keep fullRow for add new row, but cells will auto-save
             // rowData: [],
             onCellValueChanged: async (...args) => {
-              console.log('onCellValueChanged', args);
-              // field: event.colDef.field,
-              // body[event.colDef.field] = event.newValue;
-              // NotificationManager.Push({
-              //   html:
-              //     result.status === 'error'
-              //       ? result.message
-              //       : `${Translate.Render('field')} ${event.colDef.headerName} ${Translate.Render('success-updated')}`,
-              //   status: result.status,
-              // });
+              const [event] = args;
+              // Only auto-save for existing rows (with _id), not new rows
+              if (event.data && event.data._id) {
+                logger.info('onCellValueChanged - auto-saving', args);
+                const body = event.data ? event.data : {};
+                const result = await ServiceProvider.put({ id: event.data._id, body });
+                NotificationManager.Push({
+                  html: result.status === 'error' ? result.message : `${Translate.Render('success-update-item')}`,
+                  status: result.status,
+                });
+                if (result.status === 'success') {
+                  AgGrid.grids[gridId].applyTransaction({
+                    update: [event.data],
+                  });
+                  // Restore default buttons after save
+                  s(`.management-table-btn-save-${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');
+                  DefaultManagement.loadTable(id, { reload: false });
+                }
+              }
             },
             rowSelection: 'single',
             onSelectionChanged: async (...args) => {
@@ -465,8 +842,18 @@ const DefaultManagement = {
               const selectedRows = AgGrid.grids[gridId].getSelectedRows();
               logger.info('selectedRows', selectedRows);
             },
+            onCellEditingStarted: async (...args) => {
+              const [event] = args;
+              // Only show save button for new rows (without _id)
+              if (event.data && !event.data._id) {
+                s(`.management-table-btn-save-${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');
+              }
+            },
             onRowEditingStarted: async (...args) => {
-              // Show only save button when editing starts
+              // Show only save button when editing starts (for new rows)
               s(`.management-table-btn-save-${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');

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

@@ -1,6 +1,6 @@
 import { Auth } from '../../components/core/Auth.js';
 import { loggerFactory } from '../../components/core/Logger.js';
-import { getApiBaseUrl, headersFactory, payloadFactory } from '../core/core.service.js';
+import { getApiBaseUrl, headersFactory, payloadFactory, buildQueryUrl } from '../core/core.service.js';
 
 const logger = loggerFactory(import.meta);
 
@@ -49,11 +49,18 @@ const DefaultService = {
           return reject(error);
         }),
     ),
-  get: (options = { id: '', body: {}, page: 1, limit: 10 }) => {
-    const { id, page, limit } = options;
-    const url = new URL(getApiBaseUrl({ id, endpoint }));
-    url.searchParams.append('page', page);
-    url.searchParams.append('limit', limit);
+  get: (options = {}) => {
+    const { id, page, limit, filterModel, sortModel, sort, asc, order } = options;
+    const url = buildQueryUrl(getApiBaseUrl({ id, endpoint }), {
+      page,
+      limit,
+      filterModel,
+      sortModel,
+      sort,
+      asc,
+      order,
+    });
+
     return new Promise((resolve, reject) =>
       fetch(url.toString(), {
         method: 'GET',

package/src/client/services/document/document.service.js

@@ -111,6 +111,29 @@ const DocumentService = {
           return reject(error);
         }),
     ),
+  high: (options = { params: {} }) =>
+    new Promise((resolve, reject) => {
+      const url = new URL(getApiBaseUrl({ id: 'public/high', endpoint }));
+      if (options.params) {
+        Object.keys(options.params).forEach((key) => url.searchParams.append(key, options.params[key]));
+      }
+      fetch(url, {
+        method: 'GET',
+        headers: headersFactory(),
+        credentials: 'include',
+      })
+        .then(async (res) => {
+          return await res.json();
+        })
+        .then((res) => {
+          logger.info(res);
+          return resolve(res);
+        })
+        .catch((error) => {
+          logger.error(error);
+          return reject(error);
+        });
+    }),
 };
 
 export { DocumentService };