refactor(js): migrate audit and addressbook list pages to list factory

2026-04-20 22:45:54 +02:00
parent 7c47e818f2
commit 5219bbaff2
5 changed files with 502 additions and 521 deletions
--- a/modules/addressbook/web/js/pages/address-book-index.js
+++ b/modules/addressbook/web/js/pages/address-book-index.js
@@ -1,17 +1,18 @@
 import { initMultiSelect } from '/js/components/app-multiselect-init.js';
 import { initMultiSelectCascade } from '/js/components/app-multiselect-cascade.js';
-import { initStandardListPage } from '/js/core/app-grid-factory.js';
-import { readPageConfig } from '/js/core/app-page-config.js';
-import { warnOnce } from '/js/core/app-dom.js';
-import { getAppBase, escapeHtml, buildBadgeList, gridFilterMultiCsv, gridFilterText, withCurrentListReturn } from '/js/pages/app-list-utils.js';
+import { createListPageModule } from '/js/core/app-list-page-module.js';
+import { escapeHtml, buildBadgeList, gridFilterMultiCsv, gridFilterText, withCurrentListReturn } from '/js/pages/app-list-utils.js';

-const config = readPageConfig('address-book-index');
-if (config) {
-  const appBase = getAppBase();
+createListPageModule({
+  configId: 'address-book-index',
+  moduleId: 'address-book-index',
+  missingGridMessage: 'Address book grid init failed: Grid.js missing',
+  initErrorMessage: 'Address book grid init failed',
+  setup: ({ config, gridjs, appBase, initListPage }) => {
+    const labels = config.labels ?? {};
    const gridSearch = config.gridSearch ?? null;
    const filterSchema = config.filterSchema ?? [];
    const filterChipMeta = config.filterChipMeta ?? [];
-  const labels = config.labels ?? {};

    const toolbar = document.querySelector('#address-book-drawer-toolbar');
    const customFilterInputs = Array.from(document.querySelectorAll('[data-address-book-custom-filter]'));
@@ -32,7 +33,7 @@ if (config) {

    const customFilters = customFilterInputs.map((input) => {
      const param = String(input?.dataset?.addressBookCustomFilterParam || '').trim();
-    if (!param) {return null;}
+      if (!param) { return null; }
      if (input.dataset.addressBookCustomFilterType === 'multiselect') {
        const targetSelector = input.dataset.addressBookCustomFilterInput || '';
        return gridFilterMultiCsv(targetSelector, param, { default: [] });
@@ -40,8 +41,9 @@ if (config) {
      return gridFilterText(input, param, { default: '' });
    }).filter(Boolean);

-  const gridOptions = {
-    gridjs: window.gridjs,
+    const { gridConfig } = initListPage({
+      grid: {
+        gridjs,
        container: '#address-book-grid',
        dataUrl: 'address-book/data',
        appBase,
@@ -111,20 +113,13 @@ if (config) {
            return uuid ? new URL(`address-book/view/${uuid}`, appBase).toString() : '';
          },
        },
-  };
-
-  const { gridConfig } = initStandardListPage({
-    grid: gridOptions,
+      },
      filters: {
        mode: 'drawer',
        chipMeta: filterChipMeta,
        watchInputs: ['#address-book-search'],
      },
-  });
-
-  if (!gridConfig || !gridConfig.grid) {
-    warnOnce('UI_INIT_FAIL', 'Address book grid init failed', { module: 'address-book-index', component: 'grid' });
-  }
+    }) || {};

    initMultiSelect().then(() => {
      initMultiSelectCascade({
@@ -136,4 +131,6 @@ if (config) {
      });
    });

-}
+    return gridConfig;
+  },
+});
--- a/modules/audit/web/js/pages/admin-api-audit-index.js
+++ b/modules/audit/web/js/pages/admin-api-audit-index.js
@@ -1,19 +1,20 @@
-import { initStandardListPage } from '/js/core/app-grid-factory.js';
-import { readPageConfig } from '/js/core/app-page-config.js';
-import { warnOnce } from '/js/core/app-dom.js';
-import { getAppBase, withCurrentListReturn } from '/js/pages/app-list-utils.js';
+import { createListPageModule } from '/js/core/app-list-page-module.js';
+import { withCurrentListReturn } from '/js/pages/app-list-utils.js';

-const config = readPageConfig('admin-api-audit-index');
-if (config) {
-  const appBase = getAppBase();
+createListPageModule({
+  configId: 'admin-api-audit-index',
+  moduleId: 'admin-api-audit-index',
+  missingGridMessage: 'API audit grid init failed: Grid.js missing',
+  initErrorMessage: 'API audit grid init failed',
+  setup: ({ config, gridjs, appBase, initListPage }) => {
+    const labels = config.labels ?? {};
    const gridSearch = config.gridSearch ?? null;
    const filterSchema = config.filterSchema ?? [];
    const filterChipMeta = config.filterChipMeta ?? [];
-  const labels = config.labels ?? {};

-  const initApiAuditGrid = () => {
-    const gridOptions = {
-      gridjs: window.gridjs,
+    const { gridConfig } = initListPage({
+      grid: {
+        gridjs,
        container: '#api-audit-grid',
        dataUrl: 'audit/api-audit/data',
        appBase,
@@ -127,21 +128,14 @@ if (config) {
            return id ? new URL(`audit/api-audit/view/${id}`, appBase).toString() : '';
          },
        },
-    };
-    const { gridConfig } = initStandardListPage({
-      grid: gridOptions,
+      },
      filters: {
        mode: 'drawer',
        chipMeta: filterChipMeta,
        watchInputs: ['#api-audit-search'],
      },
-    });
-    if (!gridConfig || !gridConfig.grid) {
-      warnOnce('UI_INIT_FAIL', 'API audit grid init failed', { module: 'admin-api-audit-index', component: 'grid' });
-      return null;
-    }
-    return gridConfig;
-  };
+    }) || {};

-  initApiAuditGrid();
-}
+    return gridConfig;
+  },
+});
--- a/modules/audit/web/js/pages/admin-import-audit-index.js
+++ b/modules/audit/web/js/pages/admin-import-audit-index.js
@@ -1,25 +1,27 @@
-import { initStandardListPage } from '/js/core/app-grid-factory.js';
-import { readPageConfig } from '/js/core/app-page-config.js';
-import { warnOnce } from '/js/core/app-dom.js';
-import { getAppBase, withCurrentListReturn } from '/js/pages/app-list-utils.js';
+import { createListPageModule } from '/js/core/app-list-page-module.js';
+import { withCurrentListReturn } from '/js/pages/app-list-utils.js';

-const config = readPageConfig('admin-import-audit-index');
-if (config) {
-  const appBase = getAppBase();
+createListPageModule({
+  configId: 'admin-import-audit-index',
+  moduleId: 'admin-import-audit-index',
+  missingGridMessage: 'Import audit grid init failed: Grid.js missing',
+  initErrorMessage: 'Import audit grid init failed',
+  setup: ({ config, gridjs, appBase, initListPage }) => {
+    const labels = config.labels ?? {};
    const gridSearch = config.gridSearch ?? null;
    const filterSchema = config.filterSchema ?? [];
    const filterChipMeta = config.filterChipMeta ?? [];
-  const labels = config.labels ?? {};

    const profileLabel = (value) => {
      const key = String(value || '').toLowerCase();
-    if (key === 'users') {return labels.users || 'Users';}
-    if (key === 'departments') {return labels.departments || 'Departments';}
+      if (key === 'users') { return labels.users || 'Users'; }
+      if (key === 'departments') { return labels.departments || 'Departments'; }
      return key || '-';
    };

-  const gridOptions = {
-    gridjs: window.gridjs,
+    const { gridConfig } = initListPage({
+      grid: {
+        gridjs,
        container: '#import-audit-grid',
        dataUrl: 'audit/import-audit/data',
        appBase,
@@ -87,18 +89,14 @@ if (config) {
            return id ? new URL(`audit/import-audit/view/${id}`, appBase).toString() : '';
          },
        },
-  };
-
-  const { gridConfig } = initStandardListPage({
-    grid: gridOptions,
+      },
      filters: {
        mode: 'drawer',
        chipMeta: filterChipMeta,
        watchInputs: ['#import-audit-search'],
      },
-  });
+    }) || {};

-  if (!gridConfig || !gridConfig.grid) {
-    warnOnce('UI_INIT_FAIL', 'Import audit grid init failed', { module: 'admin-import-audit-index', component: 'grid' });
-  }
-}
+    return gridConfig;
+  },
+});
--- a/modules/audit/web/js/pages/admin-system-audit-index.js
+++ b/modules/audit/web/js/pages/admin-system-audit-index.js
@@ -1,19 +1,20 @@
-import { initStandardListPage } from '/js/core/app-grid-factory.js';
-import { readPageConfig } from '/js/core/app-page-config.js';
-import { warnOnce } from '/js/core/app-dom.js';
-import { getAppBase, withCurrentListReturn } from '/js/pages/app-list-utils.js';
+import { createListPageModule } from '/js/core/app-list-page-module.js';
+import { withCurrentListReturn } from '/js/pages/app-list-utils.js';

-const config = readPageConfig('admin-system-audit-index');
-if (config) {
-  const appBase = getAppBase();
+createListPageModule({
+  configId: 'admin-system-audit-index',
+  moduleId: 'admin-system-audit-index',
+  missingGridMessage: 'System audit grid init failed: Grid.js missing',
+  initErrorMessage: 'System audit grid init failed',
+  setup: ({ config, gridjs, appBase, initListPage }) => {
+    const labels = config.labels ?? {};
    const gridSearch = config.gridSearch ?? null;
    const filterSchema = config.filterSchema ?? [];
    const filterChipMeta = config.filterChipMeta ?? [];
-  const labels = config.labels ?? {};

-  const initSystemAuditGrid = () => {
-    const gridOptions = {
-      gridjs: window.gridjs,
+    const { gridConfig } = initListPage({
+      grid: {
+        gridjs,
        container: '#system-audit-grid',
        dataUrl: 'audit/system-audit/data',
        appBase,
@@ -88,20 +89,14 @@ if (config) {
            return id ? new URL(`audit/system-audit/view/${id}`, appBase).toString() : '';
          },
        },
-    };
-    const { gridConfig } = initStandardListPage({
-      grid: gridOptions,
+      },
      filters: {
        mode: 'drawer',
        chipMeta: filterChipMeta,
        watchInputs: ['#system-audit-search'],
      },
-    });
-    return gridConfig;
-  };
+    }) || {};

-  const gridConfig = initSystemAuditGrid();
-  if (!gridConfig || !gridConfig.grid) {
-    warnOnce('UI_INIT_FAIL', 'System audit grid init failed', { module: 'admin-system-audit-index', component: 'grid' });
-  }
-}
+    return gridConfig;
+  },
+});
--- a/modules/audit/web/js/pages/admin-user-lifecycle-audit-index.js
+++ b/modules/audit/web/js/pages/admin-user-lifecycle-audit-index.js
@@ -1,18 +1,19 @@
-import { initStandardListPage } from '/js/core/app-grid-factory.js';
-import { readPageConfig } from '/js/core/app-page-config.js';
-import { warnOnce } from '/js/core/app-dom.js';
-import { getAppBase } from '/js/pages/app-list-utils.js';
+import { createListPageModule } from '/js/core/app-list-page-module.js';

-const config = readPageConfig('admin-user-lifecycle-audit-index');
-if (config) {
-  const appBase = getAppBase();
+createListPageModule({
+  configId: 'admin-user-lifecycle-audit-index',
+  moduleId: 'admin-user-lifecycle-audit-index',
+  missingGridMessage: 'User lifecycle audit grid init failed: Grid.js missing',
+  initErrorMessage: 'User lifecycle audit grid init failed',
+  setup: ({ config, gridjs, appBase, initListPage }) => {
+    const labels = config.labels ?? {};
    const gridSearch = config.gridSearch ?? null;
    const filterSchema = config.filterSchema ?? [];
    const filterChipMeta = config.filterChipMeta ?? [];
-  const labels = config.labels ?? {};

-  const gridOptions = {
-    gridjs: window.gridjs,
+    const { gridConfig } = initListPage({
+      grid: {
+        gridjs,
        container: '#user-lifecycle-audit-grid',
        dataUrl: 'audit/user-lifecycle-audit/data',
        appBase,
@@ -60,18 +61,14 @@ if (config) {
            return id ? new URL(`audit/user-lifecycle-audit/view/${id}`, appBase).toString() : '';
          },
        },
-  };
-
-  const { gridConfig } = initStandardListPage({
-    grid: gridOptions,
+      },
      filters: {
        mode: 'drawer',
        chipMeta: filterChipMeta,
        watchInputs: ['#user-lifecycle-audit-search'],
      },
-  });
+    }) || {};

-  if (!gridConfig || !gridConfig.grid) {
-    warnOnce('UI_INIT_FAIL', 'User lifecycle audit grid init failed', { module: 'admin-user-lifecycle-audit-index', component: 'grid' });
-  }
-}
+    return gridConfig;
+  },
+});