@mj-biz-apps/orders-ng 5.1.0 → 5.2.0

package/dist/lib/pages/payments/payments-dashboard.page.js

@@ -2,45 +2,28 @@ import { ChangeDetectorRef, Component, EventEmitter, Output, inject } from '@ang
 import { CommonModule } from '@angular/common';
 import { MJOStatTileComponent, MJOBarListComponent } from '../../panels/stat-tile.component.js';
 import { MJODayBarsComponent } from '../../panels/day-bars.component.js';
-import { FormatMoney, MJOMoneyPipe } from '../../panels/money-format.js';
+import { FormatMoney } from '../../panels/money-format.js';
 import { MJAlertComponent } from '@memberjunction/ng-ui-components';
+import { EntityViewerModule } from '@memberjunction/ng-entity-viewer';
+import { Metadata } from '@memberjunction/core';
 import { GetPayments } from '../../data/orders-queries.js';
 import { LocalDay, ToISODate } from '@mj-biz-apps/orders-entities';
+import { MJO_ENTITIES } from '../../data/entity-names.js';
 import * as i0 from "@angular/core";
-const _forTrack0 = ($index, $item) => $item.ID;
-function MJOPaymentsDashboardPageComponent_For_57_Template(rf, ctx) { if (rf & 1) {
+import * as i1 from "@memberjunction/ng-entity-viewer";
+function MJOPaymentsDashboardPageComponent_Conditional_44_Template(rf, ctx) { if (rf & 1) {
     const _r1 = i0.ɵɵgetCurrentView();
-    i0.ɵɵelementStart(0, "tr", 26);
-    i0.ɵɵlistener("click", function MJOPaymentsDashboardPageComponent_For_57_Template_tr_click_0_listener() { const payment_r2 = i0.ɵɵrestoreView(_r1).$implicit; const ctx_r2 = i0.ɵɵnextContext(); return i0.ɵɵresetView(ctx_r2.PaymentOpened.emit(payment_r2)); });
-    i0.ɵɵelementStart(1, "td")(2, "span", 27);
-    i0.ɵɵtext(3);
-    i0.ɵɵelementEnd()();
-    i0.ɵɵelementStart(4, "td");
-    i0.ɵɵtext(5);
+    i0.ɵɵelementStart(0, "mj-entity-viewer", 26);
+    i0.ɵɵlistener("RecordOpened", function MJOPaymentsDashboardPageComponent_Conditional_44_Template_mj_entity_viewer_RecordOpened_0_listener($event) { i0.ɵɵrestoreView(_r1); const ctx_r1 = i0.ɵɵnextContext(); return i0.ɵɵresetView(ctx_r1.OnRecordOpened($event)); });
     i0.ɵɵelementEnd();
-    i0.ɵɵelementStart(6, "td");
-    i0.ɵɵtext(7);
-    i0.ɵɵelementEnd();
-    i0.ɵɵelementStart(8, "td", 20);
-    i0.ɵɵtext(9);
-    i0.ɵɵpipe(10, "mjoMoney");
-    i0.ɵɵelementEnd()();
 } if (rf & 2) {
-    const payment_r2 = ctx.$implicit;
-    const ctx_r2 = i0.ɵɵnextContext();
-    i0.ɵɵadvance(3);
-    i0.ɵɵtextInterpolate(payment_r2.PaymentNumber);
-    i0.ɵɵadvance(2);
-    i0.ɵɵtextInterpolate(ctx_r2.payerOf(payment_r2));
-    i0.ɵɵadvance(2);
-    i0.ɵɵtextInterpolate(payment_r2.PaymentType ?? "\u2014");
-    i0.ɵɵadvance(2);
-    i0.ɵɵtextInterpolate(i0.ɵɵpipeBind1(10, 4, payment_r2.Amount ?? 0));
+    const ctx_r1 = i0.ɵɵnextContext();
+    i0.ɵɵproperty("Entity", ctx_r1.PaymentEntityInfo);
 } }
-function MJOPaymentsDashboardPageComponent_ForEmpty_58_Template(rf, ctx) { if (rf & 1) {
-    i0.ɵɵelementStart(0, "tr")(1, "td", 28);
-    i0.ɵɵtext(2, "No payments yet.");
-    i0.ɵɵelementEnd()();
+function MJOPaymentsDashboardPageComponent_Conditional_45_Template(rf, ctx) { if (rf & 1) {
+    i0.ɵɵelementStart(0, "div", 21);
+    i0.ɵɵtext(1, "Loading payments...");
+    i0.ɵɵelementEnd();
 } }
 /**
  * `mjo-payments-dashboard-page` — what came in, and does it tie?
@@ -57,28 +40,24 @@ function MJOPaymentsDashboardPageComponent_ForEmpty_58_Template(rf, ctx) { if (r
  * ```
  */
 export class MJOPaymentsDashboardPageComponent {
-    /**
-     * Render what was just loaded.
-     *
-     * These pages are created imperatively by the section shell through
-     * `ViewContainerRef.createComponent`. When an async load assigns across
-     * Angular's check/verify boundary, dev mode raises NG0100 and ABORTS the DOM
-     * write. Nothing re-renders afterwards, so the recorded "previous" value stays
-     * pre-load while the getter returns the loaded one — the mismatch then repeats
-     * on every tick and the view is frozen for good. It is not a flicker: the
-     * Orders dashboard sat at "0 open orders / $0.00" against 73 real orders, and
-     * read as a quiet day rather than a broken screen.
-     *
-     * Writing the DOM here ends it: the rendered value matches the getter from the
-     * first pass on, so later verify passes agree.
-     */
     cdr = inject(ChangeDetectorRef);
     PaymentOpened = new EventEmitter();
+    PaymentEntityInfo = null;
     payments = [];
     async ngOnInit() {
+        const md = new Metadata();
+        this.PaymentEntityInfo = md.Entities.find((e) => e.Name === MJO_ENTITIES.PaymentHeader) || null;
+        this.cdr.detectChanges();
         this.payments = await GetPayments({ Preset: 'all' });
         this.cdr.detectChanges();
     }
+    OnRecordOpened(event) {
+        const id = (event.compositeKey?.GetValueByFieldName('ID') ?? event.record?.['ID']);
+        if (id) {
+            const surrogate = { ID: id };
+            this.PaymentOpened.emit(surrogate);
+        }
+    }
     get captured() {
         return this.payments.filter((p) => p.Status === 'Captured');
     }
@@ -165,7 +144,7 @@ export class MJOPaymentsDashboardPageComponent {
             .map(([Label, Value]) => ({ Label, Value, Display: FormatMoney(Value, { Round: true }) }));
     }
     static ɵfac = function MJOPaymentsDashboardPageComponent_Factory(__ngFactoryType__) { return new (__ngFactoryType__ || MJOPaymentsDashboardPageComponent)(); };
-    static ɵcmp = /*@__PURE__*/ i0.ɵɵdefineComponent({ type: MJOPaymentsDashboardPageComponent, selectors: [["mjo-payments-dashboard-page"]], outputs: { PaymentOpened: "PaymentOpened" }, decls: 77, vars: 10, consts: [[1, "mj-stat-grid"], ["Label", "Cash received", "Icon", "fa-solid fa-hand-holding-dollar", 3, "Value", "Detail"], ["Label", "Unallocated", "Icon", "fa-solid fa-equals", "Value", "$0.00", "Detail", "Always \u2014 a payment cannot capture unless it balances"], ["Label", "Awaiting capture", "Icon", "fa-solid fa-clock", 3, "Value", "Detail"], ["Label", "Processor fees", "Icon", "fa-solid fa-receipt", "Detail", "Our cost, never netted against a customer's balance", 3, "Value"], [1, "mjo-pd__split", "mjo-pd__split--three"], [1, "mj-card"], [1, "mj-card-head"], ["aria-hidden", "true", 1, "fa-solid", "fa-credit-card"], [1, "mj-card-pad"], ["Unit", "received", 3, "Bars"], [1, "small", "muted", "mjo-pd__note"], ["EmptyText", "No payments yet.", 3, "Rows"], ["aria-hidden", "true", 1, "fa-solid", "fa-shield-halved"], ["Variant", "success", "Icon", "fa-solid fa-circle-check"], ["Variant", "info", "Icon", "fa-solid fa-circle-info", 1, "mjo-pd__note"], [1, "mjo-pd__split"], ["aria-hidden", "true", 1, "fa-solid", "fa-clock-rotate-left"], [1, "mj-table-wrap"], [1, "mj-table", "mj-table--compact"], [1, "num"], [2, "cursor", "pointer"], ["aria-hidden", "true", 1, "fa-solid", "fa-receipt"], [1, "mjo-pd__row"], [1, "small", "muted"], [1, "mj-num"], [2, "cursor", "pointer", 3, "click"], [1, "mono"], ["colspan", "4", 1, "small", "muted"]], template: function MJOPaymentsDashboardPageComponent_Template(rf, ctx) { if (rf & 1) {
+    static ɵcmp = /*@__PURE__*/ i0.ɵɵdefineComponent({ type: MJOPaymentsDashboardPageComponent, selectors: [["mjo-payments-dashboard-page"]], outputs: { PaymentOpened: "PaymentOpened" }, decls: 64, vars: 10, consts: [[1, "mj-stat-grid"], ["Label", "Cash received", "Icon", "fa-solid fa-hand-holding-dollar", 3, "Value", "Detail"], ["Label", "Unallocated", "Icon", "fa-solid fa-equals", "Value", "$0.00", "Detail", "Always \u2014 a payment cannot capture unless it balances"], ["Label", "Awaiting capture", "Icon", "fa-solid fa-clock", 3, "Value", "Detail"], ["Label", "Processor fees", "Icon", "fa-solid fa-receipt", "Detail", "Our cost, never netted against a customer's balance", 3, "Value"], [1, "mjo-pd__split", "mjo-pd__split--three"], [1, "mj-card"], [1, "mj-card-head"], ["aria-hidden", "true", 1, "fa-solid", "fa-credit-card"], [1, "mj-card-pad"], ["Unit", "received", 3, "Bars"], [1, "small", "muted", "mjo-pd__note"], ["EmptyText", "No payments yet.", 3, "Rows"], ["aria-hidden", "true", 1, "fa-solid", "fa-shield-halved"], ["Variant", "success", "Icon", "fa-solid fa-circle-check"], ["Variant", "info", "Icon", "fa-solid fa-circle-info", 1, "mjo-pd__note"], [1, "mjo-pd__split"], [1, "mj-card", "mjo-pd__viewer-card"], ["aria-hidden", "true", 1, "fa-solid", "fa-clock-rotate-left"], [1, "mjo-pd__viewer-host"], [3, "Entity"], [1, "small", "muted", 2, "padding", "24px"], ["aria-hidden", "true", 1, "fa-solid", "fa-receipt"], [1, "mjo-pd__row"], [1, "small", "muted"], [1, "mj-num"], [3, "RecordOpened", "Entity"]], template: function MJOPaymentsDashboardPageComponent_Template(rf, ctx) { if (rf & 1) {
             i0.ɵɵelementStart(0, "div", 0);
             i0.ɵɵelement(1, "mjo-stat-tile", 1)(2, "mjo-stat-tile", 2)(3, "mjo-stat-tile", 3)(4, "mjo-stat-tile", 4);
             i0.ɵɵelementEnd();
@@ -204,45 +183,33 @@ export class MJOPaymentsDashboardPageComponent {
             i0.ɵɵelementEnd();
             i0.ɵɵtext(36, ", never an edit of the capture \u2014 so chargebacks and reversals show in the refunds list rather than as a mutated original. ");
             i0.ɵɵelementEnd()()()();
-            i0.ɵɵelementStart(37, "div", 16)(38, "div", 6)(39, "div", 7);
-            i0.ɵɵelement(40, "i", 17);
+            i0.ɵɵelementStart(37, "div", 16)(38, "div", 17)(39, "div", 7);
+            i0.ɵɵelement(40, "i", 18);
             i0.ɵɵelementStart(41, "h3");
-            i0.ɵɵtext(42, "Latest payments");
+            i0.ɵɵtext(42, "Payments List");
             i0.ɵɵelementEnd()();
-            i0.ɵɵelementStart(43, "div", 18)(44, "table", 19)(45, "thead")(46, "tr")(47, "th");
-            i0.ɵɵtext(48, "Payment");
-            i0.ɵɵelementEnd();
-            i0.ɵɵelementStart(49, "th");
-            i0.ɵɵtext(50, "Payer");
-            i0.ɵɵelementEnd();
-            i0.ɵɵelementStart(51, "th");
-            i0.ɵɵtext(52, "Tender");
-            i0.ɵɵelementEnd();
-            i0.ɵɵelementStart(53, "th", 20);
-            i0.ɵɵtext(54, "Amount");
-            i0.ɵɵelementEnd()()();
-            i0.ɵɵelementStart(55, "tbody");
-            i0.ɵɵrepeaterCreate(56, MJOPaymentsDashboardPageComponent_For_57_Template, 11, 6, "tr", 21, _forTrack0, false, MJOPaymentsDashboardPageComponent_ForEmpty_58_Template, 3, 0, "tr");
-            i0.ɵɵelementEnd()()()();
-            i0.ɵɵelementStart(59, "div", 6)(60, "div", 7);
-            i0.ɵɵelement(61, "i", 22);
-            i0.ɵɵelementStart(62, "h3");
-            i0.ɵɵtext(63, "Cost of taking money");
+            i0.ɵɵelementStart(43, "div", 19);
+            i0.ɵɵconditionalCreate(44, MJOPaymentsDashboardPageComponent_Conditional_44_Template, 1, 1, "mj-entity-viewer", 20)(45, MJOPaymentsDashboardPageComponent_Conditional_45_Template, 2, 0, "div", 21);
             i0.ɵɵelementEnd()();
-            i0.ɵɵelementStart(64, "div", 9)(65, "div", 23)(66, "span", 24);
-            i0.ɵɵtext(67, "Processor fees, captured payments");
+            i0.ɵɵelementStart(46, "div", 6)(47, "div", 7);
+            i0.ɵɵelement(48, "i", 22);
+            i0.ɵɵelementStart(49, "h3");
+            i0.ɵɵtext(50, "Cost of taking money");
+            i0.ɵɵelementEnd()();
+            i0.ɵɵelementStart(51, "div", 9)(52, "div", 23)(53, "span", 24);
+            i0.ɵɵtext(54, "Processor fees, captured payments");
             i0.ɵɵelementEnd();
-            i0.ɵɵelementStart(68, "b", 25);
-            i0.ɵɵtext(69);
+            i0.ɵɵelementStart(55, "b", 25);
+            i0.ɵɵtext(56);
             i0.ɵɵelementEnd()();
-            i0.ɵɵelementStart(70, "div", 23)(71, "span", 24);
-            i0.ɵɵtext(72, "Effective rate on what we took");
+            i0.ɵɵelementStart(57, "div", 23)(58, "span", 24);
+            i0.ɵɵtext(59, "Effective rate on what we took");
             i0.ɵɵelementEnd();
-            i0.ɵɵelementStart(73, "b", 25);
-            i0.ɵɵtext(74);
+            i0.ɵɵelementStart(60, "b", 25);
+            i0.ɵɵtext(61);
             i0.ɵɵelementEnd()();
-            i0.ɵɵelementStart(75, "div", 11);
-            i0.ɵɵtext(76, " Booked as OUR expense against gross A/R, never netted into the customer's balance \u2014 netting would leave a residue no payment could ever clear. ");
+            i0.ɵɵelementStart(62, "div", 11);
+            i0.ɵɵtext(63, " Booked as OUR expense against gross A/R, never netted into the customer's balance \u2014 netting would leave a residue no payment could ever clear. ");
             i0.ɵɵelementEnd()()()();
         } if (rf & 2) {
             i0.ɵɵadvance();
@@ -255,17 +222,29 @@ export class MJOPaymentsDashboardPageComponent {
             i0.ɵɵproperty("Bars", ctx.CashPerDay);
             i0.ɵɵadvance(9);
             i0.ɵɵproperty("Rows", ctx.TenderMix);
-            i0.ɵɵadvance(35);
-            i0.ɵɵrepeater(ctx.LatestPayments);
-            i0.ɵɵadvance(13);
+            i0.ɵɵadvance(23);
+            i0.ɵɵconditional(ctx.PaymentEntityInfo ? 44 : 45);
+            i0.ɵɵadvance(12);
             i0.ɵɵtextInterpolate(ctx.FeeTotal);
             i0.ɵɵadvance(5);
             i0.ɵɵtextInterpolate(ctx.EffectiveRate);
-        } }, dependencies: [CommonModule, MJOStatTileComponent, MJOBarListComponent, MJODayBarsComponent, MJAlertComponent, MJOMoneyPipe], styles: ["\n\n\n\n\n\n            .mjo-pd__split[_ngcontent-%COMP%] {\n                display: grid;\n                grid-template-columns: minmax(0, 1.6fr) minmax(0, 1fr);\n                gap: var(--mj-space-4);\n                margin-top: var(--mj-space-4);\n            }\n            .mjo-pd__row[_ngcontent-%COMP%] {\n                display: flex;\n                justify-content: space-between;\n                align-items: baseline;\n                gap: var(--mj-space-3);\n                padding: 3px 0;\n            }\n            .mjo-pd__note[_ngcontent-%COMP%] { margin-top: var(--mj-space-3); }\n            @media (max-width: 1000px) {\n                .mjo-pd__split[_ngcontent-%COMP%] { grid-template-columns: 1fr; }\n            }\n\n            [_nghost-%COMP%] {\n                display: block;\n                height: 100%;\n                overflow: auto;\n                padding: var(--mj-space-6);\n            }\n            \n\n\n\n            .mjo-pd__split--three[_ngcontent-%COMP%] {\n                grid-template-columns: repeat(auto-fit, minmax(260px, 1fr));\n                margin-top: var(--mj-space-6);\n            }\n            .mjo-pd__note[_ngcontent-%COMP%] { margin-top: var(--mj-space-3); }\n            @media (max-width: 1000px) {\n                .mjo-pd__split[_ngcontent-%COMP%] { grid-template-columns: 1fr; }\n            }\n            @media (max-width: 760px) {\n                [_nghost-%COMP%] { padding: var(--mj-space-4); }\n            }"] });
+        } }, dependencies: [CommonModule,
+            MJOStatTileComponent,
+            MJOBarListComponent,
+            MJODayBarsComponent,
+            MJAlertComponent,
+            EntityViewerModule, i1.EntityViewerComponent], styles: ["\n\n\n\n\n\n            .mjo-pd__split[_ngcontent-%COMP%] {\n                display: grid;\n                grid-template-columns: minmax(0, 1.6fr) minmax(0, 1fr);\n                gap: var(--mj-space-4);\n                margin-top: var(--mj-space-4);\n            }\n            .mjo-pd__viewer-card[_ngcontent-%COMP%] {\n                background: var(--mj-bg-surface);\n                border: 1px solid var(--mj-border-default);\n                border-radius: var(--mj-radius-md);\n                overflow: hidden;\n                display: flex;\n                flex-direction: column;\n                height: 560px;\n                min-height: 480px;\n            }\n            .mjo-pd__viewer-host[_ngcontent-%COMP%] {\n                flex: 1 1 auto;\n                height: 100%;\n                min-height: 400px;\n                display: flex;\n                flex-direction: column;\n            }\n            mj-entity-viewer[_ngcontent-%COMP%] {\n                display: flex;\n                flex-direction: column;\n                flex: 1 1 auto;\n                height: 100%;\n                width: 100%;\n            }\n            .mjo-pd__row[_ngcontent-%COMP%] {\n                display: flex;\n                justify-content: space-between;\n                align-items: baseline;\n                gap: var(--mj-space-3);\n                padding: 3px 0;\n            }\n            .mjo-pd__note[_ngcontent-%COMP%] { margin-top: var(--mj-space-3); }\n            @media (max-width: 1000px) {\n                .mjo-pd__split[_ngcontent-%COMP%] { grid-template-columns: 1fr; }\n            }\n\n            [_nghost-%COMP%] {\n                display: block;\n                height: 100%;\n                overflow: auto;\n                padding: var(--mj-space-6);\n                box-sizing: border-box;\n            }\n            .mjo-pd__split--three[_ngcontent-%COMP%] {\n                grid-template-columns: repeat(auto-fit, minmax(260px, 1fr));\n                margin-top: var(--mj-space-6);\n            }\n            .mjo-pd__note[_ngcontent-%COMP%] { margin-top: var(--mj-space-3); }\n            @media (max-width: 1000px) {\n                .mjo-pd__split[_ngcontent-%COMP%] { grid-template-columns: 1fr; }\n            }\n            @media (max-width: 760px) {\n                [_nghost-%COMP%] { padding: var(--mj-space-4); }\n            }"] });
 }
 (() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassMetadata(MJOPaymentsDashboardPageComponent, [{
         type: Component,
-        args: [{ selector: 'mjo-payments-dashboard-page', standalone: true, imports: [CommonModule, MJOStatTileComponent, MJOBarListComponent, MJODayBarsComponent, MJOMoneyPipe, MJAlertComponent], template: `
+        args: [{ selector: 'mjo-payments-dashboard-page', standalone: true, imports: [
+                    CommonModule,
+                    MJOStatTileComponent,
+                    MJOBarListComponent,
+                    MJODayBarsComponent,
+                    MJAlertComponent,
+                    EntityViewerModule
+                ], template: `
         <div class="mj-stat-grid">
             <mjo-stat-tile
                 Label="Cash received"
@@ -334,34 +313,20 @@ export class MJOPaymentsDashboardPageComponent {
         </div>
 
         <div class="mjo-pd__split">
-            <div class="mj-card">
+            <div class="mj-card mjo-pd__viewer-card">
                 <div class="mj-card-head">
                     <i class="fa-solid fa-clock-rotate-left" aria-hidden="true"></i>
-                    <h3>Latest payments</h3>
+                    <h3>Payments List</h3>
                 </div>
-                <div class="mj-table-wrap">
-                    <table class="mj-table mj-table--compact">
-                        <thead>
-                            <tr>
-                                <th>Payment</th>
-                                <th>Payer</th>
-                                <th>Tender</th>
-                                <th class="num">Amount</th>
-                            </tr>
-                        </thead>
-                        <tbody>
-                            @for (payment of LatestPayments; track payment.ID) {
-                                <tr (click)="PaymentOpened.emit(payment)" style="cursor: pointer;">
-                                    <td><span class="mono">{{ payment.PaymentNumber }}</span></td>
-                                    <td>{{ payerOf(payment) }}</td>
-                                    <td>{{ payment.PaymentType ?? '—' }}</td>
-                                    <td class="num">{{ (payment.Amount ?? 0) | mjoMoney }}</td>
-                                </tr>
-                            } @empty {
-                                <tr><td colspan="4" class="small muted">No payments yet.</td></tr>
-                            }
-                        </tbody>
-                    </table>
+                <div class="mjo-pd__viewer-host">
+                    @if (PaymentEntityInfo) {
+                        <mj-entity-viewer
+                            [Entity]="PaymentEntityInfo"
+                            (RecordOpened)="OnRecordOpened($event)">
+                        </mj-entity-viewer>
+                    } @else {
+                        <div class="small muted" style="padding: 24px;">Loading payments...</div>
+                    }
                 </div>
             </div>
 
@@ -386,9 +351,9 @@ export class MJOPaymentsDashboardPageComponent {
                 </div>
             </div>
         </div>
-    `, styles: ["\n            /* NOTE: .mjo-pd__split was declared TWICE in this block with different column\n               templates, so the later one silently won and BOTH rows rendered as two equal\n               columns. The top row has three cards, so the third landed alone and left an empty\n               half-width slot beside it \u2014 a hole that read as a card that had failed to load.\n               Two layouts need two names. */\n            .mjo-pd__split {\n                display: grid;\n                grid-template-columns: minmax(0, 1.6fr) minmax(0, 1fr);\n                gap: var(--mj-space-4);\n                margin-top: var(--mj-space-4);\n            }\n            .mjo-pd__row {\n                display: flex;\n                justify-content: space-between;\n                align-items: baseline;\n                gap: var(--mj-space-3);\n                padding: 3px 0;\n            }\n            .mjo-pd__note { margin-top: var(--mj-space-3); }\n            @media (max-width: 1000px) {\n                .mjo-pd__split { grid-template-columns: 1fr; }\n            }\n\n            :host {\n                display: block;\n                height: 100%;\n                overflow: auto;\n                padding: var(--mj-space-6);\n            }\n            /* The three-card row: all three abreast, so nothing is left orphaned on a second\n               line. auto-fit rather than a fixed 3 so it reflows to 2 then 1 as the pane\n               narrows instead of squeezing three unreadable columns. */\n            .mjo-pd__split--three {\n                grid-template-columns: repeat(auto-fit, minmax(260px, 1fr));\n                margin-top: var(--mj-space-6);\n            }\n            .mjo-pd__note { margin-top: var(--mj-space-3); }\n            @media (max-width: 1000px) {\n                .mjo-pd__split { grid-template-columns: 1fr; }\n            }\n            @media (max-width: 760px) {\n                :host { padding: var(--mj-space-4); }\n            }\n        "] }]
+    `, styles: ["\n            /* NOTE: .mjo-pd__split was declared TWICE in this block with different column\n               templates, so the later one silently won and BOTH rows rendered as two equal\n               columns. The top row has three cards, so the third landed alone and left an empty\n               half-width slot beside it \u2014 a hole that read as a card that had failed to load.\n               Two layouts need two names. */\n            .mjo-pd__split {\n                display: grid;\n                grid-template-columns: minmax(0, 1.6fr) minmax(0, 1fr);\n                gap: var(--mj-space-4);\n                margin-top: var(--mj-space-4);\n            }\n            .mjo-pd__viewer-card {\n                background: var(--mj-bg-surface);\n                border: 1px solid var(--mj-border-default);\n                border-radius: var(--mj-radius-md);\n                overflow: hidden;\n                display: flex;\n                flex-direction: column;\n                height: 560px;\n                min-height: 480px;\n            }\n            .mjo-pd__viewer-host {\n                flex: 1 1 auto;\n                height: 100%;\n                min-height: 400px;\n                display: flex;\n                flex-direction: column;\n            }\n            mj-entity-viewer {\n                display: flex;\n                flex-direction: column;\n                flex: 1 1 auto;\n                height: 100%;\n                width: 100%;\n            }\n            .mjo-pd__row {\n                display: flex;\n                justify-content: space-between;\n                align-items: baseline;\n                gap: var(--mj-space-3);\n                padding: 3px 0;\n            }\n            .mjo-pd__note { margin-top: var(--mj-space-3); }\n            @media (max-width: 1000px) {\n                .mjo-pd__split { grid-template-columns: 1fr; }\n            }\n\n            :host {\n                display: block;\n                height: 100%;\n                overflow: auto;\n                padding: var(--mj-space-6);\n                box-sizing: border-box;\n            }\n            .mjo-pd__split--three {\n                grid-template-columns: repeat(auto-fit, minmax(260px, 1fr));\n                margin-top: var(--mj-space-6);\n            }\n            .mjo-pd__note { margin-top: var(--mj-space-3); }\n            @media (max-width: 1000px) {\n                .mjo-pd__split { grid-template-columns: 1fr; }\n            }\n            @media (max-width: 760px) {\n                :host { padding: var(--mj-space-4); }\n            }\n        "] }]
     }], null, { PaymentOpened: [{
             type: Output
         }] }); })();
-(() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassDebugInfo(MJOPaymentsDashboardPageComponent, { className: "MJOPaymentsDashboardPageComponent", filePath: "lib/pages/payments/payments-dashboard.page.ts", lineNumber: 199 }); })();
+(() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassDebugInfo(MJOPaymentsDashboardPageComponent, { className: "MJOPaymentsDashboardPageComponent", filePath: "lib/pages/payments/payments-dashboard.page.ts", lineNumber: 217 }); })();
 //# sourceMappingURL=payments-dashboard.page.js.map

package/dist/lib/pages/payments/payments-dashboard.page.js.map

@@ -1 +1 @@
-{"version":3,"file":"payments-dashboard.page.js","sourceRoot":"","sources":["../../../../src/lib/pages/payments/payments-dashboard.page.ts"],"names":[],"mappings":"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"}
+{"version":3,"file":"payments-dashboard.page.js","sourceRoot":"","sources":["../../../../src/lib/pages/payments/payments-dashboard.page.ts"],"names":[],"mappings":"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"}

package/dist/lib/pages/payments/payments-list.page.d.ts

@@ -1,51 +1,17 @@
 import { EventEmitter, OnInit } from '@angular/core';
-import { type MJOColumn, type MJOPreset } from '../../panels/worklist-table.component.js';
-import type { mjBizAppsOrdersPaymentHeaderEntity } from '@mj-biz-apps/orders-entities';
+import { type RecordOpenedEvent } from '@memberjunction/ng-entity-viewer';
+import { type EntityInfo } from '@memberjunction/core';
+import { type mjBizAppsOrdersPaymentHeaderEntity } from '@mj-biz-apps/orders-entities';
 import * as i0 from "@angular/core";
 /**
- * `mjo-payments-list-page` — find any payment, and see exactly what it settled.
- *
- * THERE IS NO "UNAPPLIED" COLUMN because there is no unapplied cash. A payment's
- * amount always equals the sum of its allocations, so every row reconciles by
- * construction. A column for something that cannot happen would imply it can.
- *
- * A refund is a NEW payment rather than an edit of the capture, which is why
- * reversals appear as their own rows in their own preset rather than as a state
- * on the original.
- *
- * ## Example
- *
- * ```html
- * <mjo-payments-list-page (PaymentOpened)="openPreview($event)" />
- * ```
+ * `mjo-payments-list-page` — All Payments view powered by MemberJunction's native `<mj-entity-viewer>`.
  */
 export declare class MJOPaymentsListPageComponent implements OnInit {
-    /**
-     * Render what was just loaded.
-     *
-     * These pages are created imperatively by the section shell through
-     * `ViewContainerRef.createComponent`. When an async load assigns across
-     * Angular's check/verify boundary, dev mode raises NG0100 and ABORTS the DOM
-     * write. Nothing re-renders afterwards, so the recorded "previous" value stays
-     * pre-load while the getter returns the loaded one — the mismatch then repeats
-     * on every tick and the view is frozen for good. It is not a flicker: the
-     * Orders dashboard sat at "0 open orders / $0.00" against 73 real orders, and
-     * read as a quiet day rather than a broken screen.
-     *
-     * Writing the DOM here ends it: the rendered value matches the getter from the
-     * first pass on, so later verify passes agree.
-     */
     private readonly cdr;
     PaymentOpened: EventEmitter<mjBizAppsOrdersPaymentHeaderEntity>;
-    Rows: mjBizAppsOrdersPaymentHeaderEntity[];
-    Preset: string;
-    Search: string;
-    readonly Presets: MJOPreset[];
-    readonly Columns: MJOColumn<mjBizAppsOrdersPaymentHeaderEntity>[];
-    ngOnInit(): Promise<void>;
-    OnPreset(preset: string): Promise<void>;
-    OnSearch(text: string): Promise<void>;
-    private load;
+    PaymentEntityInfo: EntityInfo | null;
+    ngOnInit(): void;
+    OnRecordOpened(event: RecordOpenedEvent): void;
     static ɵfac: i0.ɵɵFactoryDeclaration<MJOPaymentsListPageComponent, never>;
     static ɵcmp: i0.ɵɵComponentDeclaration<MJOPaymentsListPageComponent, "mjo-payments-list-page", never, {}, { "PaymentOpened": "PaymentOpened"; }, never, never, true, never>;
 }

package/dist/lib/pages/payments/payments-list.page.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"payments-list.page.d.ts","sourceRoot":"","sources":["../../../../src/lib/pages/payments/payments-list.page.ts"],"names":[],"mappings":"AAAA,OAAO,EAAgC,YAAY,EAAE,MAAM,EAAkB,MAAM,eAAe,CAAC;AAEnG,OAAO,EAA6B,KAAK,SAAS,EAAE,KAAK,SAAS,EAAE,MAAM,uCAAuC,CAAC;AAIlH,OAAO,KAAK,EAAE,kCAAkC,EAAE,MAAM,8BAA8B,CAAC;;AAEvF;;;;;;;;;;;;;;;;GAgBG;AACH,qBAmCa,4BAA6B,YAAW,MAAM;IACvD;;;;;;;;;;;;;;OAcG;IACH,OAAO,CAAC,QAAQ,CAAC,GAAG,CAA6B;IAEvC,aAAa,mDAA0D;IAE1E,IAAI,EAAE,kCAAkC,EAAE,CAAM;IAChD,MAAM,SAAS;IACf,MAAM,SAAM;IAEnB,SAAgB,OAAO,EAAE,SAAS,EAAE,CAKlC;IAEF,SAAgB,OAAO,EAAE,SAAS,CAAC,kCAAkC,CAAC,EAAE,CAkDtE;IAEW,QAAQ,IAAI,OAAO,CAAC,IAAI,CAAC;IAIzB,QAAQ,CAAC,MAAM,EAAE,MAAM,GAAG,OAAO,CAAC,IAAI,CAAC;IAMvC,QAAQ,CAAC,IAAI,EAAE,MAAM,GAAG,OAAO,CAAC,IAAI,CAAC;YAMpC,IAAI;yCAnGT,4BAA4B;2CAA5B,4BAA4B;CAuGxC"}
+{"version":3,"file":"payments-list.page.d.ts","sourceRoot":"","sources":["../../../../src/lib/pages/payments/payments-list.page.ts"],"names":[],"mappings":"AAAA,OAAO,EAAgC,YAAY,EAAE,MAAM,EAAkB,MAAM,eAAe,CAAC;AAEnG,OAAO,EAAsB,KAAK,iBAAiB,EAAE,MAAM,kCAAkC,CAAC;AAC9F,OAAO,EAAY,KAAK,UAAU,EAAE,MAAM,sBAAsB,CAAC;AACjE,OAAO,EAAE,KAAK,kCAAkC,EAAE,MAAM,8BAA8B,CAAC;;AAGvF;;GAEG;AACH,qBA6Da,4BAA6B,YAAW,MAAM;IACvD,OAAO,CAAC,QAAQ,CAAC,GAAG,CAA6B;IAEvC,aAAa,mDAA0D;IAE1E,iBAAiB,EAAE,UAAU,GAAG,IAAI,CAAQ;IAE5C,QAAQ,IAAI,IAAI;IAMhB,cAAc,CAAC,KAAK,EAAE,iBAAiB,GAAG,IAAI;yCAb5C,4BAA4B;2CAA5B,4BAA4B;CAoBxC"}

package/dist/lib/pages/payments/payments-list.page.js

@@ -1,150 +1,71 @@
 import { ChangeDetectorRef, Component, EventEmitter, Output, inject } from '@angular/core';
 import { CommonModule } from '@angular/common';
-import { MJOWorklistTableComponent } from '../../panels/worklist-table.component.js';
-import { FormatDate, FormatMoney } from '../../panels/money-format.js';
-import { GetPayments } from '../../data/orders-queries.js';
+import { EntityViewerModule } from '@memberjunction/ng-entity-viewer';
+import { Metadata } from '@memberjunction/core';
+import { MJO_ENTITIES } from '../../data/entity-names.js';
 import * as i0 from "@angular/core";
+import * as i1 from "@memberjunction/ng-entity-viewer";
+function MJOPaymentsListPageComponent_Conditional_2_Template(rf, ctx) { if (rf & 1) {
+    const _r1 = i0.ɵɵgetCurrentView();
+    i0.ɵɵelementStart(0, "mj-entity-viewer", 4);
+    i0.ɵɵlistener("RecordOpened", function MJOPaymentsListPageComponent_Conditional_2_Template_mj_entity_viewer_RecordOpened_0_listener($event) { i0.ɵɵrestoreView(_r1); const ctx_r1 = i0.ɵɵnextContext(); return i0.ɵɵresetView(ctx_r1.OnRecordOpened($event)); });
+    i0.ɵɵelementEnd();
+} if (rf & 2) {
+    const ctx_r1 = i0.ɵɵnextContext();
+    i0.ɵɵproperty("Entity", ctx_r1.PaymentEntityInfo);
+} }
+function MJOPaymentsListPageComponent_Conditional_3_Template(rf, ctx) { if (rf & 1) {
+    i0.ɵɵelementStart(0, "div", 3);
+    i0.ɵɵtext(1, "Loading payment metadata...");
+    i0.ɵɵelementEnd();
+} }
 /**
- * `mjo-payments-list-page` — find any payment, and see exactly what it settled.
- *
- * THERE IS NO "UNAPPLIED" COLUMN because there is no unapplied cash. A payment's
- * amount always equals the sum of its allocations, so every row reconciles by
- * construction. A column for something that cannot happen would imply it can.
- *
- * A refund is a NEW payment rather than an edit of the capture, which is why
- * reversals appear as their own rows in their own preset rather than as a state
- * on the original.
- *
- * ## Example
- *
- * ```html
- * <mjo-payments-list-page (PaymentOpened)="openPreview($event)" />
- * ```
+ * `mjo-payments-list-page` — All Payments view powered by MemberJunction's native `<mj-entity-viewer>`.
  */
 export class MJOPaymentsListPageComponent {
-    /**
-     * Render what was just loaded.
-     *
-     * These pages are created imperatively by the section shell through
-     * `ViewContainerRef.createComponent`. When an async load assigns across
-     * Angular's check/verify boundary, dev mode raises NG0100 and ABORTS the DOM
-     * write. Nothing re-renders afterwards, so the recorded "previous" value stays
-     * pre-load while the getter returns the loaded one — the mismatch then repeats
-     * on every tick and the view is frozen for good. It is not a flicker: the
-     * Orders dashboard sat at "0 open orders / $0.00" against 73 real orders, and
-     * read as a quiet day rather than a broken screen.
-     *
-     * Writing the DOM here ends it: the rendered value matches the getter from the
-     * first pass on, so later verify passes agree.
-     */
     cdr = inject(ChangeDetectorRef);
     PaymentOpened = new EventEmitter();
-    Rows = [];
-    Preset = 'all';
-    Search = '';
-    Presets = [
-        { Key: 'all', Label: 'All' },
-        { Key: 'captured', Label: 'Captured' },
-        { Key: 'pending', Label: 'Awaiting capture', Icon: 'fa-solid fa-clock' },
-        { Key: 'refunds', Label: 'Refunds', Icon: 'fa-solid fa-arrow-rotate-left' },
-    ];
-    Columns = [
-        { Key: 'PaymentNumber', Label: 'Payment', Kind: 'mono', Width: '118px', Sortable: true },
-        {
-            Key: 'PaymentDate',
-            Label: 'Date',
-            Width: '96px',
-            Sortable: true,
-            Format: (r) => FormatDate(r.PaymentDate, { Short: true }),
-        },
-        {
-            Key: 'From',
-            Label: 'From',
-            Format: (r) => (r.BillToOrganization ?? r.BillToPerson ?? '—'),
-        },
-        { Key: 'PaymentType', Label: 'Tender', Width: '130px', HideBelow: 760 },
-        { Key: 'Company', Label: 'Into', Width: '96px', HideBelow: 1000 },
-        {
-            Key: 'Status',
-            Label: 'Status',
-            Kind: 'chip',
-            Width: '110px',
-            ChipClass: (r) => r.Status === 'Captured'
-                ? 'mj-chip--success'
-                : r.Status === 'Pending'
-                    ? 'mj-chip--warning'
-                    : r.Status === 'Refunded'
-                        ? 'mj-chip--violet'
-                        : r.Status === 'Failed' || r.Status === 'Disputed'
-                            ? 'mj-chip--error'
-                            : '',
-        },
-        {
-            Key: 'Amount',
-            Label: 'Amount',
-            Kind: 'money',
-            Width: '116px',
-            Sortable: true,
-            // A refund stores a positive magnitude with negative lines, so the sign
-            // here comes from the STATUS rather than from the stored number.
-            Format: (r) => (r.Status === 'Refunded' ? '−' : '') + FormatMoney(r.Amount, { Sign: 'absolute' }),
-        },
-        {
-            Key: 'ProcessingFeeAmount',
-            Label: 'Fee',
-            Kind: 'money',
-            Width: '92px',
-            HideBelow: 560,
-            Format: (r) => FormatMoney(r.ProcessingFeeAmount, { Zero: '—' }),
-        },
-    ];
-    async ngOnInit() {
-        await this.load();
-    }
-    async OnPreset(preset) {
-        this.Preset = preset;
-        await this.load();
-        this.cdr.detectChanges();
-    }
-    async OnSearch(text) {
-        this.Search = text;
-        await this.load();
+    PaymentEntityInfo = null;
+    ngOnInit() {
+        const md = new Metadata();
+        this.PaymentEntityInfo = md.Entities.find((e) => e.Name === MJO_ENTITIES.PaymentHeader) || null;
         this.cdr.detectChanges();
     }
-    async load() {
-        this.Rows = await GetPayments({ Preset: this.Preset, Search: this.Search });
-        this.cdr.detectChanges();
+    OnRecordOpened(event) {
+        const id = (event.compositeKey?.GetValueByFieldName('ID') ?? event.record?.['ID']);
+        if (id) {
+            const surrogate = { ID: id };
+            this.PaymentOpened.emit(surrogate);
+        }
     }
     static ɵfac = function MJOPaymentsListPageComponent_Factory(__ngFactoryType__) { return new (__ngFactoryType__ || MJOPaymentsListPageComponent)(); };
-    static ɵcmp = /*@__PURE__*/ i0.ɵɵdefineComponent({ type: MJOPaymentsListPageComponent, selectors: [["mjo-payments-list-page"]], outputs: { PaymentOpened: "PaymentOpened" }, decls: 1, vars: 5, consts: [["SearchPlaceholder", "Payment \u2116, customer, or reference\u2026", "RowKey", "ID", "EmptyIcon", "fa-solid fa-money-check-dollar", "EmptyTitle", "No payments match", "EmptyHint", "Try a different preset, or clear the search.", "FootNote", "Every row reconciles: a payment's amount always equals the sum of its allocations, so there is no unapplied-cash column because there is no unapplied cash.", 3, "PresetChanged", "SearchChanged", "RowClicked", "Columns", "Rows", "Presets", "ActivePreset", "Search"]], template: function MJOPaymentsListPageComponent_Template(rf, ctx) { if (rf & 1) {
-            i0.ɵɵelementStart(0, "mjo-worklist-table", 0);
-            i0.ɵɵlistener("PresetChanged", function MJOPaymentsListPageComponent_Template_mjo_worklist_table_PresetChanged_0_listener($event) { return ctx.OnPreset($event); })("SearchChanged", function MJOPaymentsListPageComponent_Template_mjo_worklist_table_SearchChanged_0_listener($event) { return ctx.OnSearch($event); })("RowClicked", function MJOPaymentsListPageComponent_Template_mjo_worklist_table_RowClicked_0_listener($event) { return ctx.PaymentOpened.emit($event); });
-            i0.ɵɵelementEnd();
+    static ɵcmp = /*@__PURE__*/ i0.ɵɵdefineComponent({ type: MJOPaymentsListPageComponent, selectors: [["mjo-payments-list-page"]], outputs: { PaymentOpened: "PaymentOpened" }, decls: 4, vars: 1, consts: [[1, "mjo-list-page-container"], [1, "mjo-viewer-wrapper"], [3, "Entity"], [1, "small", "muted", 2, "padding", "24px"], [3, "RecordOpened", "Entity"]], template: function MJOPaymentsListPageComponent_Template(rf, ctx) { if (rf & 1) {
+            i0.ɵɵelementStart(0, "div", 0)(1, "div", 1);
+            i0.ɵɵconditionalCreate(2, MJOPaymentsListPageComponent_Conditional_2_Template, 1, 1, "mj-entity-viewer", 2)(3, MJOPaymentsListPageComponent_Conditional_3_Template, 2, 0, "div", 3);
+            i0.ɵɵelementEnd()();
         } if (rf & 2) {
-            i0.ɵɵproperty("Columns", ctx.Columns)("Rows", ctx.Rows)("Presets", ctx.Presets)("ActivePreset", ctx.Preset)("Search", ctx.Search);
-        } }, dependencies: [CommonModule, MJOWorklistTableComponent], styles: ["[_nghost-%COMP%] {\n                display: block;\n                height: 100%;\n                overflow: auto;\n                padding: var(--mj-space-6);\n            }\n            @media (max-width: 760px) {\n                [_nghost-%COMP%] { padding: var(--mj-space-4); }\n            }"] });
+            i0.ɵɵadvance(2);
+            i0.ɵɵconditional(ctx.PaymentEntityInfo ? 2 : 3);
+        } }, dependencies: [CommonModule, EntityViewerModule, i1.EntityViewerComponent], styles: ["[_nghost-%COMP%] {\n                display: flex;\n                flex-direction: column;\n                height: 100%;\n                width: 100%;\n                min-height: 0;\n                overflow: hidden;\n            }\n            .mjo-list-page-container[_ngcontent-%COMP%] {\n                height: 100%;\n                width: 100%;\n                min-height: 0;\n                display: flex;\n                flex-direction: column;\n                padding: var(--mj-space-6);\n                box-sizing: border-box;\n            }\n            .mjo-viewer-wrapper[_ngcontent-%COMP%] {\n                flex: 1 1 auto;\n                height: 100%;\n                min-height: 500px;\n                background: var(--mj-bg-surface);\n                border: 1px solid var(--mj-border-default);\n                border-radius: var(--mj-radius-md);\n                overflow: hidden;\n                display: flex;\n                flex-direction: column;\n            }\n            mj-entity-viewer[_ngcontent-%COMP%] {\n                display: flex;\n                flex-direction: column;\n                flex: 1 1 auto;\n                height: 100%;\n                width: 100%;\n            }\n            @media (max-width: 760px) {\n                .mjo-list-page-container[_ngcontent-%COMP%] { padding: var(--mj-space-4); }\n            }"] });
 }
 (() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassMetadata(MJOPaymentsListPageComponent, [{
         type: Component,
-        args: [{ selector: 'mjo-payments-list-page', standalone: true, imports: [CommonModule, MJOWorklistTableComponent], template: `
-        <mjo-worklist-table
-            [Columns]="Columns"
-            [Rows]="Rows"
-            [Presets]="Presets"
-            [ActivePreset]="Preset"
-            [Search]="Search"
-            SearchPlaceholder="Payment №, customer, or reference…"
-            RowKey="ID"
-            EmptyIcon="fa-solid fa-money-check-dollar"
-            EmptyTitle="No payments match"
-            EmptyHint="Try a different preset, or clear the search."
-            FootNote="Every row reconciles: a payment's amount always equals the sum of its allocations, so there is no unapplied-cash column because there is no unapplied cash."
-            (PresetChanged)="OnPreset($event)"
-            (SearchChanged)="OnSearch($event)"
-            (RowClicked)="PaymentOpened.emit($any($event))" />
-    `, styles: ["\n            :host {\n                display: block;\n                height: 100%;\n                overflow: auto;\n                padding: var(--mj-space-6);\n            }\n            @media (max-width: 760px) {\n                :host { padding: var(--mj-space-4); }\n            }\n        "] }]
+        args: [{ selector: 'mjo-payments-list-page', standalone: true, imports: [CommonModule, EntityViewerModule], template: `
+        <div class="mjo-list-page-container">
+            <div class="mjo-viewer-wrapper">
+                @if (PaymentEntityInfo) {
+                    <mj-entity-viewer
+                        [Entity]="PaymentEntityInfo"
+                        (RecordOpened)="OnRecordOpened($event)">
+                    </mj-entity-viewer>
+                } @else {
+                    <div class="small muted" style="padding: 24px;">Loading payment metadata...</div>
+                }
+            </div>
+        </div>
+    `, styles: ["\n            :host {\n                display: flex;\n                flex-direction: column;\n                height: 100%;\n                width: 100%;\n                min-height: 0;\n                overflow: hidden;\n            }\n            .mjo-list-page-container {\n                height: 100%;\n                width: 100%;\n                min-height: 0;\n                display: flex;\n                flex-direction: column;\n                padding: var(--mj-space-6);\n                box-sizing: border-box;\n            }\n            .mjo-viewer-wrapper {\n                flex: 1 1 auto;\n                height: 100%;\n                min-height: 500px;\n                background: var(--mj-bg-surface);\n                border: 1px solid var(--mj-border-default);\n                border-radius: var(--mj-radius-md);\n                overflow: hidden;\n                display: flex;\n                flex-direction: column;\n            }\n            mj-entity-viewer {\n                display: flex;\n                flex-direction: column;\n                flex: 1 1 auto;\n                height: 100%;\n                width: 100%;\n            }\n            @media (max-width: 760px) {\n                .mjo-list-page-container { padding: var(--mj-space-4); }\n            }\n        "] }]
     }], null, { PaymentOpened: [{
             type: Output
         }] }); })();
-(() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassDebugInfo(MJOPaymentsListPageComponent, { className: "MJOPaymentsListPageComponent", filePath: "lib/pages/payments/payments-list.page.ts", lineNumber: 61 }); })();
+(() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassDebugInfo(MJOPaymentsListPageComponent, { className: "MJOPaymentsListPageComponent", filePath: "lib/pages/payments/payments-list.page.ts", lineNumber: 72 }); })();
 //# sourceMappingURL=payments-list.page.js.map