@memberjunction/ng-dashboards 5.38.0 → 5.39.0

package/dist/Communication/communication-logs-resource.component.js

@@ -11,8 +11,8 @@ import { RunView } from '@memberjunction/core';
 import * as i0 from "@angular/core";
 import * as i1 from "@angular/common";
 import * as i2 from "@memberjunction/ng-ui-components";
-function CommunicationLogsResourceComponent_For_30_Conditional_19_Template(rf, ctx) { if (rf & 1) {
-    i0.ɵɵelementStart(0, "span", 16);
+function CommunicationLogsResourceComponent_For_28_Conditional_19_Template(rf, ctx) { if (rf & 1) {
+    i0.ɵɵelementStart(0, "span", 14);
     i0.ɵɵtext(1);
     i0.ɵɵelementEnd();
 } if (rf & 2) {
@@ -21,21 +21,21 @@ function CommunicationLogsResourceComponent_For_30_Conditional_19_Template(rf, c
     i0.ɵɵadvance();
     i0.ɵɵtextInterpolate1(" ", log_r1.ErrorMessage, " ");
 } }
-function CommunicationLogsResourceComponent_For_30_Conditional_20_Template(rf, ctx) { if (rf & 1) {
-    i0.ɵɵelementStart(0, "span", 17);
+function CommunicationLogsResourceComponent_For_28_Conditional_20_Template(rf, ctx) { if (rf & 1) {
+    i0.ɵɵelementStart(0, "span", 15);
     i0.ɵɵtext(1, "\u2014");
     i0.ɵɵelementEnd();
 } }
-function CommunicationLogsResourceComponent_For_30_Template(rf, ctx) { if (rf & 1) {
-    i0.ɵɵelementStart(0, "tr")(1, "td")(2, "span", 13);
+function CommunicationLogsResourceComponent_For_28_Template(rf, ctx) { if (rf & 1) {
+    i0.ɵɵelementStart(0, "tr")(1, "td")(2, "span", 11);
     i0.ɵɵelement(3, "i");
     i0.ɵɵtext(4);
     i0.ɵɵelementEnd()();
-    i0.ɵɵelementStart(5, "td")(6, "span", 14);
+    i0.ɵɵelementStart(5, "td")(6, "span", 12);
     i0.ɵɵelement(7, "i");
     i0.ɵɵtext(8);
     i0.ɵɵelementEnd()();
-    i0.ɵɵelementStart(9, "td")(10, "span", 15);
+    i0.ɵɵelementStart(9, "td")(10, "span", 13);
     i0.ɵɵelement(11, "i");
     i0.ɵɵtext(12);
     i0.ɵɵelementEnd()();
@@ -47,8 +47,8 @@ function CommunicationLogsResourceComponent_For_30_Template(rf, ctx) { if (rf &
     i0.ɵɵpipe(17, "date");
     i0.ɵɵelementEnd();
     i0.ɵɵelementStart(18, "td");
-    i0.ɵɵconditionalCreate(19, CommunicationLogsResourceComponent_For_30_Conditional_19_Template, 2, 2, "span", 16);
-    i0.ɵɵconditionalCreate(20, CommunicationLogsResourceComponent_For_30_Conditional_20_Template, 2, 0, "span", 17);
+    i0.ɵɵconditionalCreate(19, CommunicationLogsResourceComponent_For_28_Conditional_19_Template, 2, 2, "span", 14);
+    i0.ɵɵconditionalCreate(20, CommunicationLogsResourceComponent_For_28_Conditional_20_Template, 2, 0, "span", 15);
     i0.ɵɵelementEnd()();
 } if (rf & 2) {
     const log_r1 = ctx.$implicit;
@@ -79,9 +79,9 @@ function CommunicationLogsResourceComponent_For_30_Template(rf, ctx) { if (rf &
     i0.ɵɵadvance();
     i0.ɵɵconditional(!log_r1.ErrorMessage ? 20 : -1);
 } }
-function CommunicationLogsResourceComponent_Conditional_31_Template(rf, ctx) { if (rf & 1) {
-    i0.ɵɵelementStart(0, "tr")(1, "td", 18)(2, "div", 19);
-    i0.ɵɵelement(3, "i", 20);
+function CommunicationLogsResourceComponent_Conditional_29_Template(rf, ctx) { if (rf & 1) {
+    i0.ɵɵelementStart(0, "tr")(1, "td", 16)(2, "div", 17);
+    i0.ɵɵelement(3, "i", 18);
     i0.ɵɵelementStart(4, "p");
     i0.ɵɵtext(5, "No logs found matching your criteria");
     i0.ɵɵelementEnd()()()();
@@ -137,6 +137,32 @@ let CommunicationLogsResourceComponent = class CommunicationLogsResourceComponen
         this.statusFilter = status;
         this.applyFilter();
     }
+    // -- Concise chrome: Status lives behind the one Filter popover -----------
+    get filterFields() {
+        return [{
+                key: 'status',
+                type: 'chips',
+                label: 'Status',
+                chipOptions: [
+                    { text: 'All', value: '' },
+                    { text: 'Sent', value: 'Complete', icon: 'fa-solid fa-check-circle' },
+                    { text: 'Failed', value: 'Failed', icon: 'fa-solid fa-times-circle' },
+                    { text: 'Pending', value: 'Pending', icon: 'fa-solid fa-clock' },
+                ],
+            }];
+    }
+    get filterValues() {
+        return { status: this.statusFilter };
+    }
+    get ActiveFilterCount() {
+        return this.statusFilter ? 1 : 0;
+    }
+    onFilterValuesChange(values) {
+        this.onStatusFilter(values['status'] ?? '');
+    }
+    resetFilters() {
+        this.onStatusFilter('');
+    }
     getStatusClass(status) {
         const s = (status || '').toLowerCase();
         if (s === 'complete')
@@ -210,65 +236,54 @@ let CommunicationLogsResourceComponent = class CommunicationLogsResourceComponen
         return 'fa-solid fa-list-ul';
     }
     static ɵfac = function CommunicationLogsResourceComponent_Factory(__ngFactoryType__) { return new (__ngFactoryType__ || CommunicationLogsResourceComponent)(i0.ɵɵdirectiveInject(i0.ChangeDetectorRef)); };
-    static ɵcmp = /*@__PURE__*/ i0.ɵɵdefineComponent({ type: CommunicationLogsResourceComponent, selectors: [["mj-communication-logs-resource"]], standalone: false, features: [i0.ɵɵInheritDefinitionFeature], decls: 32, vars: 7, consts: [["Title", "Logs", "Icon", "fa-solid fa-list-ul"], ["actions", ""], [3, "Clicked", "Loading"], ["toolbar", ""], ["Placeholder", "Search messages, providers, recipients...", 3, "ValueChange"], ["Label", "All", "Icon", "fa-solid fa-filter", 3, "Clicked", "Active"], ["Label", "Sent", "Icon", "fa-solid fa-check-circle", 3, "Clicked", "Active"], ["Label", "Failed", "Icon", "fa-solid fa-times-circle", 3, "Clicked", "Active"], ["Label", "Pending", "Icon", "fa-solid fa-clock", 3, "Clicked", "Active"], [3, "Flex"], [1, "logs-card"], [1, "table-wrapper"], [1, "log-table"], [1, "log-status-badge", 3, "ngClass"], [1, "log-direction", 3, "ngClass"], [1, "log-provider-badge"], [1, "log-error-text", 3, "title"], [1, "no-error"], ["colspan", "6", 1, "no-data"], [1, "empty-state"], [1, "fa-solid", "fa-inbox"]], template: function CommunicationLogsResourceComponent_Template(rf, ctx) { if (rf & 1) {
+    static ɵcmp = /*@__PURE__*/ i0.ɵɵdefineComponent({ type: CommunicationLogsResourceComponent, selectors: [["mj-communication-logs-resource"]], standalone: false, features: [i0.ɵɵInheritDefinitionFeature], decls: 30, vars: 7, consts: [["Title", "Logs", "Icon", "fa-solid fa-list-ul"], ["actions", ""], [3, "Clicked", "Loading"], ["toolbar", ""], ["Placeholder", "Search messages, providers, recipients...", 3, "ValueChange"], [3, "ClearAllRequested", "ActiveCount", "ShowClearAll"], [3, "ValuesChange", "Reset", "Fields", "Values"], [3, "Flex"], [1, "logs-card"], [1, "table-wrapper"], [1, "log-table"], [1, "log-status-badge", 3, "ngClass"], [1, "log-direction", 3, "ngClass"], [1, "log-provider-badge"], [1, "log-error-text", 3, "title"], [1, "no-error"], ["colspan", "6", 1, "no-data"], [1, "empty-state"], [1, "fa-solid", "fa-inbox"]], template: function CommunicationLogsResourceComponent_Template(rf, ctx) { if (rf & 1) {
             i0.ɵɵelementStart(0, "mj-page-layout")(1, "mj-page-header", 0)(2, "div", 1)(3, "mj-refresh-button", 2);
             i0.ɵɵlistener("Clicked", function CommunicationLogsResourceComponent_Template_mj_refresh_button_Clicked_3_listener() { return ctx.loadData(); });
             i0.ɵɵelementEnd()();
             i0.ɵɵelementStart(4, "div", 3)(5, "mj-page-search", 4);
             i0.ɵɵlistener("ValueChange", function CommunicationLogsResourceComponent_Template_mj_page_search_ValueChange_5_listener($event) { return ctx.onSearchValue($event); });
             i0.ɵɵelementEnd();
-            i0.ɵɵelementStart(6, "mj-filter-chip", 5);
-            i0.ɵɵlistener("Clicked", function CommunicationLogsResourceComponent_Template_mj_filter_chip_Clicked_6_listener() { return ctx.onStatusFilter(""); });
-            i0.ɵɵelementEnd();
-            i0.ɵɵelementStart(7, "mj-filter-chip", 6);
-            i0.ɵɵlistener("Clicked", function CommunicationLogsResourceComponent_Template_mj_filter_chip_Clicked_7_listener() { return ctx.onStatusFilter("Complete"); });
+            i0.ɵɵelementStart(6, "mj-filter-popover", 5);
+            i0.ɵɵlistener("ClearAllRequested", function CommunicationLogsResourceComponent_Template_mj_filter_popover_ClearAllRequested_6_listener() { return ctx.resetFilters(); });
+            i0.ɵɵelementStart(7, "mj-filter-panel", 6);
+            i0.ɵɵlistener("ValuesChange", function CommunicationLogsResourceComponent_Template_mj_filter_panel_ValuesChange_7_listener($event) { return ctx.onFilterValuesChange($event); })("Reset", function CommunicationLogsResourceComponent_Template_mj_filter_panel_Reset_7_listener() { return ctx.resetFilters(); });
+            i0.ɵɵelementEnd()()()();
+            i0.ɵɵelementStart(8, "mj-page-body", 7)(9, "div", 8)(10, "div", 9)(11, "table", 10)(12, "thead")(13, "tr")(14, "th");
+            i0.ɵɵtext(15, "Status");
             i0.ɵɵelementEnd();
-            i0.ɵɵelementStart(8, "mj-filter-chip", 7);
-            i0.ɵɵlistener("Clicked", function CommunicationLogsResourceComponent_Template_mj_filter_chip_Clicked_8_listener() { return ctx.onStatusFilter("Failed"); });
-            i0.ɵɵelementEnd();
-            i0.ɵɵelementStart(9, "mj-filter-chip", 8);
-            i0.ɵɵlistener("Clicked", function CommunicationLogsResourceComponent_Template_mj_filter_chip_Clicked_9_listener() { return ctx.onStatusFilter("Pending"); });
-            i0.ɵɵelementEnd()()();
-            i0.ɵɵelementStart(10, "mj-page-body", 9)(11, "div", 10)(12, "div", 11)(13, "table", 12)(14, "thead")(15, "tr")(16, "th");
-            i0.ɵɵtext(17, "Status");
+            i0.ɵɵelementStart(16, "th");
+            i0.ɵɵtext(17, "Direction");
             i0.ɵɵelementEnd();
             i0.ɵɵelementStart(18, "th");
-            i0.ɵɵtext(19, "Direction");
+            i0.ɵɵtext(19, "Provider");
             i0.ɵɵelementEnd();
             i0.ɵɵelementStart(20, "th");
-            i0.ɵɵtext(21, "Provider");
+            i0.ɵɵtext(21, "Type");
             i0.ɵɵelementEnd();
             i0.ɵɵelementStart(22, "th");
-            i0.ɵɵtext(23, "Type");
+            i0.ɵɵtext(23, "Date");
             i0.ɵɵelementEnd();
             i0.ɵɵelementStart(24, "th");
-            i0.ɵɵtext(25, "Date");
-            i0.ɵɵelementEnd();
-            i0.ɵɵelementStart(26, "th");
-            i0.ɵɵtext(27, "Error");
+            i0.ɵɵtext(25, "Error");
             i0.ɵɵelementEnd()()();
-            i0.ɵɵelementStart(28, "tbody");
-            i0.ɵɵrepeaterCreate(29, CommunicationLogsResourceComponent_For_30_Template, 21, 20, "tr", null, i0.ɵɵrepeaterTrackByIdentity);
-            i0.ɵɵconditionalCreate(31, CommunicationLogsResourceComponent_Conditional_31_Template, 6, 0, "tr");
+            i0.ɵɵelementStart(26, "tbody");
+            i0.ɵɵrepeaterCreate(27, CommunicationLogsResourceComponent_For_28_Template, 21, 20, "tr", null, i0.ɵɵrepeaterTrackByIdentity);
+            i0.ɵɵconditionalCreate(29, CommunicationLogsResourceComponent_Conditional_29_Template, 6, 0, "tr");
             i0.ɵɵelementEnd()()()()()();
         } if (rf & 2) {
             i0.ɵɵadvance(3);
             i0.ɵɵproperty("Loading", ctx.isLoading);
             i0.ɵɵadvance(3);
-            i0.ɵɵproperty("Active", ctx.statusFilter === "");
-            i0.ɵɵadvance();
-            i0.ɵɵproperty("Active", ctx.statusFilter === "Complete");
-            i0.ɵɵadvance();
-            i0.ɵɵproperty("Active", ctx.statusFilter === "Failed");
+            i0.ɵɵproperty("ActiveCount", ctx.ActiveFilterCount)("ShowClearAll", ctx.ActiveFilterCount > 0);
             i0.ɵɵadvance();
-            i0.ɵɵproperty("Active", ctx.statusFilter === "Pending");
+            i0.ɵɵproperty("Fields", ctx.filterFields)("Values", ctx.filterValues);
             i0.ɵɵadvance();
             i0.ɵɵproperty("Flex", true);
             i0.ɵɵadvance(19);
             i0.ɵɵrepeater(ctx.filteredLogs);
             i0.ɵɵadvance(2);
-            i0.ɵɵconditional(ctx.filteredLogs.length === 0 && !ctx.isLoading ? 31 : -1);
-        } }, dependencies: [i1.NgClass, i2.MJPageHeaderComponent, i2.MJPageLayoutComponent, i2.MJPageBodyComponent, i2.MJPageSearchComponent, i2.MJFilterChipComponent, i2.MJRefreshButtonComponent, i1.DatePipe], styles: ["\n\n    .logs-card[_ngcontent-%COMP%] {\n        flex: 1;\n        min-height: 0;\n        background: var(--mj-bg-surface-card);\n        border: 1px solid var(--mj-border-default);\n        border-radius: 12px;\n        overflow: hidden;\n        display: flex;\n        flex-direction: column;\n    }\n\n    \n\n    .table-wrapper[_ngcontent-%COMP%] { flex: 1; overflow-y: auto; }\n\n    .log-table[_ngcontent-%COMP%] {\n        width: 100%;\n        border-collapse: collapse;\n        font-size: 12px;\n    }\n    .log-table[_ngcontent-%COMP%]   thead[_ngcontent-%COMP%] {\n        background: var(--mj-bg-surface-sunken);\n        position: sticky; top: 0; z-index: 1;\n    }\n    .log-table[_ngcontent-%COMP%]   th[_ngcontent-%COMP%] {\n        padding: 10px 16px;\n        text-align: left;\n        font-weight: 700; font-size: 10px;\n        text-transform: uppercase; letter-spacing: 0.5px;\n        color: var(--mj-text-muted);\n        border-bottom: 1px solid var(--mj-border-default);\n        white-space: nowrap;\n    }\n    .log-table[_ngcontent-%COMP%]   td[_ngcontent-%COMP%] {\n        padding: 12px 16px;\n        border-bottom: 1px solid var(--mj-border-default);\n        color: var(--mj-text-primary);\n        vertical-align: middle;\n    }\n    .log-table[_ngcontent-%COMP%]   tbody[_ngcontent-%COMP%]   tr[_ngcontent-%COMP%] { transition: background 0.15s; }\n    .log-table[_ngcontent-%COMP%]   tbody[_ngcontent-%COMP%]   tr[_ngcontent-%COMP%]:hover { background: var(--mj-bg-surface-sunken); }\n\n    .log-status-badge[_ngcontent-%COMP%] {\n        display: inline-flex; align-items: center;\n        gap: 4px; font-size: 11px; font-weight: 600;\n        padding: 3px 10px;\n        border-radius: 4px;\n    }\n    .log-status-badge.complete[_ngcontent-%COMP%] {\n        background: color-mix(in srgb, var(--mj-status-success) 15%, var(--mj-bg-surface));\n        color: var(--mj-status-success);\n    }\n    .log-status-badge.failed[_ngcontent-%COMP%] {\n        background: color-mix(in srgb, var(--mj-status-error) 15%, var(--mj-bg-surface));\n        color: var(--mj-status-error);\n    }\n    .log-status-badge.pending[_ngcontent-%COMP%] {\n        background: color-mix(in srgb, var(--mj-status-warning) 15%, var(--mj-bg-surface));\n        color: var(--mj-status-warning);\n    }\n    .log-status-badge.in-progress[_ngcontent-%COMP%] {\n        background: color-mix(in srgb, var(--mj-brand-primary) 15%, var(--mj-bg-surface));\n        color: var(--mj-brand-primary);\n    }\n\n    .log-direction[_ngcontent-%COMP%] {\n        display: flex; align-items: center;\n        gap: 4px; font-size: 11px;\n        color: var(--mj-text-muted);\n    }\n    .log-direction[_ngcontent-%COMP%]   i[_ngcontent-%COMP%] { font-size: 10px; }\n    .log-direction.sending[_ngcontent-%COMP%]   i[_ngcontent-%COMP%] { color: var(--mj-brand-primary); }\n    .log-direction.receiving[_ngcontent-%COMP%]   i[_ngcontent-%COMP%] { color: var(--mj-status-success); }\n\n    .log-provider-badge[_ngcontent-%COMP%] {\n        display: inline-flex; align-items: center;\n        gap: 6px; padding: 3px 10px;\n        border-radius: 4px;\n        background: var(--mj-bg-surface-sunken);\n        font-weight: 500;\n    }\n\n    .log-error-text[_ngcontent-%COMP%] {\n        color: var(--mj-status-error);\n        max-width: 200px;\n        overflow: hidden; text-overflow: ellipsis;\n        white-space: nowrap; font-size: 11px;\n        display: block;\n    }\n    .no-error[_ngcontent-%COMP%] { color: var(--mj-text-muted); }\n\n    .no-data[_ngcontent-%COMP%] { padding: 0 !important; }\n    .empty-state[_ngcontent-%COMP%] {\n        display: flex; flex-direction: column;\n        align-items: center; justify-content: center;\n        padding: 48px 0; color: var(--mj-text-muted);\n    }\n    .empty-state[_ngcontent-%COMP%]   i[_ngcontent-%COMP%] { font-size: 2rem; margin-bottom: 12px; opacity: 0.5; }\n    .empty-state[_ngcontent-%COMP%]   p[_ngcontent-%COMP%] { margin: 0; font-size: 13px; }"] });
+            i0.ɵɵconditional(ctx.filteredLogs.length === 0 && !ctx.isLoading ? 29 : -1);
+        } }, dependencies: [i1.NgClass, i2.MJPageHeaderComponent, i2.MJPageLayoutComponent, i2.MJPageBodyComponent, i2.MJPageSearchComponent, i2.MJFilterPopoverComponent, i2.MJFilterPanelComponent, i2.MJRefreshButtonComponent, i1.DatePipe], styles: ["\n\n    .logs-card[_ngcontent-%COMP%] {\n        flex: 1;\n        min-height: 0;\n        background: var(--mj-bg-surface-card);\n        border: 1px solid var(--mj-border-default);\n        border-radius: 12px;\n        overflow: hidden;\n        display: flex;\n        flex-direction: column;\n    }\n\n    \n\n    .table-wrapper[_ngcontent-%COMP%] { flex: 1; overflow-y: auto; }\n\n    .log-table[_ngcontent-%COMP%] {\n        width: 100%;\n        border-collapse: collapse;\n        font-size: 12px;\n    }\n    .log-table[_ngcontent-%COMP%]   thead[_ngcontent-%COMP%] {\n        background: var(--mj-bg-surface-sunken);\n        position: sticky; top: 0; z-index: 1;\n    }\n    .log-table[_ngcontent-%COMP%]   th[_ngcontent-%COMP%] {\n        padding: 10px 16px;\n        text-align: left;\n        font-weight: 700; font-size: 10px;\n        text-transform: uppercase; letter-spacing: 0.5px;\n        color: var(--mj-text-muted);\n        border-bottom: 1px solid var(--mj-border-default);\n        white-space: nowrap;\n    }\n    .log-table[_ngcontent-%COMP%]   td[_ngcontent-%COMP%] {\n        padding: 12px 16px;\n        border-bottom: 1px solid var(--mj-border-default);\n        color: var(--mj-text-primary);\n        vertical-align: middle;\n    }\n    .log-table[_ngcontent-%COMP%]   tbody[_ngcontent-%COMP%]   tr[_ngcontent-%COMP%] { transition: background 0.15s; }\n    .log-table[_ngcontent-%COMP%]   tbody[_ngcontent-%COMP%]   tr[_ngcontent-%COMP%]:hover { background: var(--mj-bg-surface-sunken); }\n\n    .log-status-badge[_ngcontent-%COMP%] {\n        display: inline-flex; align-items: center;\n        gap: 4px; font-size: 11px; font-weight: 600;\n        padding: 3px 10px;\n        border-radius: 4px;\n    }\n    .log-status-badge.complete[_ngcontent-%COMP%] {\n        background: color-mix(in srgb, var(--mj-status-success) 15%, var(--mj-bg-surface));\n        color: var(--mj-status-success);\n    }\n    .log-status-badge.failed[_ngcontent-%COMP%] {\n        background: color-mix(in srgb, var(--mj-status-error) 15%, var(--mj-bg-surface));\n        color: var(--mj-status-error);\n    }\n    .log-status-badge.pending[_ngcontent-%COMP%] {\n        background: color-mix(in srgb, var(--mj-status-warning) 15%, var(--mj-bg-surface));\n        color: var(--mj-status-warning);\n    }\n    .log-status-badge.in-progress[_ngcontent-%COMP%] {\n        background: color-mix(in srgb, var(--mj-brand-primary) 15%, var(--mj-bg-surface));\n        color: var(--mj-brand-primary);\n    }\n\n    .log-direction[_ngcontent-%COMP%] {\n        display: flex; align-items: center;\n        gap: 4px; font-size: 11px;\n        color: var(--mj-text-muted);\n    }\n    .log-direction[_ngcontent-%COMP%]   i[_ngcontent-%COMP%] { font-size: 10px; }\n    .log-direction.sending[_ngcontent-%COMP%]   i[_ngcontent-%COMP%] { color: var(--mj-brand-primary); }\n    .log-direction.receiving[_ngcontent-%COMP%]   i[_ngcontent-%COMP%] { color: var(--mj-status-success); }\n\n    .log-provider-badge[_ngcontent-%COMP%] {\n        display: inline-flex; align-items: center;\n        gap: 6px; padding: 3px 10px;\n        border-radius: 4px;\n        background: var(--mj-bg-surface-sunken);\n        font-weight: 500;\n    }\n\n    .log-error-text[_ngcontent-%COMP%] {\n        color: var(--mj-status-error);\n        max-width: 200px;\n        overflow: hidden; text-overflow: ellipsis;\n        white-space: nowrap; font-size: 11px;\n        display: block;\n    }\n    .no-error[_ngcontent-%COMP%] { color: var(--mj-text-muted); }\n\n    .no-data[_ngcontent-%COMP%] { padding: 0 !important; }\n    .empty-state[_ngcontent-%COMP%] {\n        display: flex; flex-direction: column;\n        align-items: center; justify-content: center;\n        padding: 48px 0; color: var(--mj-text-muted);\n    }\n    .empty-state[_ngcontent-%COMP%]   i[_ngcontent-%COMP%] { font-size: 2rem; margin-bottom: 12px; opacity: 0.5; }\n    .empty-state[_ngcontent-%COMP%]   p[_ngcontent-%COMP%] { margin: 0; font-size: 13px; }"] });
 };
 CommunicationLogsResourceComponent = __decorate([
     RegisterClass(BaseResourceComponent, 'CommunicationLogsResource')
@@ -287,10 +302,17 @@ export { CommunicationLogsResourceComponent };
             Placeholder="Search messages, providers, recipients..."
             (ValueChange)="onSearchValue($event)">
           </mj-page-search>
-          <mj-filter-chip Label="All"     Icon="fa-solid fa-filter"        [Active]="statusFilter === ''"         (Clicked)="onStatusFilter('')"></mj-filter-chip>
-          <mj-filter-chip Label="Sent"    Icon="fa-solid fa-check-circle"  [Active]="statusFilter === 'Complete'" (Clicked)="onStatusFilter('Complete')"></mj-filter-chip>
-          <mj-filter-chip Label="Failed"  Icon="fa-solid fa-times-circle"  [Active]="statusFilter === 'Failed'"   (Clicked)="onStatusFilter('Failed')"></mj-filter-chip>
-          <mj-filter-chip Label="Pending" Icon="fa-solid fa-clock"         [Active]="statusFilter === 'Pending'"  (Clicked)="onStatusFilter('Pending')"></mj-filter-chip>
+          <mj-filter-popover
+            [ActiveCount]="ActiveFilterCount"
+            [ShowClearAll]="ActiveFilterCount > 0"
+            (ClearAllRequested)="resetFilters()">
+            <mj-filter-panel
+              [Fields]="filterFields"
+              [Values]="filterValues"
+              (ValuesChange)="onFilterValuesChange($event)"
+              (Reset)="resetFilters()">
+            </mj-filter-panel>
+          </mj-filter-popover>
         </div>
       </mj-page-header>
       <mj-page-body [Flex]="true">
@@ -360,5 +382,5 @@ export { CommunicationLogsResourceComponent };
     </mj-page-layout>
     `, styles: ["\n    /* Card wrapper inside <mj-page-body>: the table sits in a tinted card. */\n    .logs-card {\n        flex: 1;\n        min-height: 0;\n        background: var(--mj-bg-surface-card);\n        border: 1px solid var(--mj-border-default);\n        border-radius: 12px;\n        overflow: hidden;\n        display: flex;\n        flex-direction: column;\n    }\n\n    /* TABLE */\n    .table-wrapper { flex: 1; overflow-y: auto; }\n\n    .log-table {\n        width: 100%;\n        border-collapse: collapse;\n        font-size: 12px;\n    }\n    .log-table thead {\n        background: var(--mj-bg-surface-sunken);\n        position: sticky; top: 0; z-index: 1;\n    }\n    .log-table th {\n        padding: 10px 16px;\n        text-align: left;\n        font-weight: 700; font-size: 10px;\n        text-transform: uppercase; letter-spacing: 0.5px;\n        color: var(--mj-text-muted);\n        border-bottom: 1px solid var(--mj-border-default);\n        white-space: nowrap;\n    }\n    .log-table td {\n        padding: 12px 16px;\n        border-bottom: 1px solid var(--mj-border-default);\n        color: var(--mj-text-primary);\n        vertical-align: middle;\n    }\n    .log-table tbody tr { transition: background 0.15s; }\n    .log-table tbody tr:hover { background: var(--mj-bg-surface-sunken); }\n\n    .log-status-badge {\n        display: inline-flex; align-items: center;\n        gap: 4px; font-size: 11px; font-weight: 600;\n        padding: 3px 10px;\n        border-radius: 4px;\n    }\n    .log-status-badge.complete {\n        background: color-mix(in srgb, var(--mj-status-success) 15%, var(--mj-bg-surface));\n        color: var(--mj-status-success);\n    }\n    .log-status-badge.failed {\n        background: color-mix(in srgb, var(--mj-status-error) 15%, var(--mj-bg-surface));\n        color: var(--mj-status-error);\n    }\n    .log-status-badge.pending {\n        background: color-mix(in srgb, var(--mj-status-warning) 15%, var(--mj-bg-surface));\n        color: var(--mj-status-warning);\n    }\n    .log-status-badge.in-progress {\n        background: color-mix(in srgb, var(--mj-brand-primary) 15%, var(--mj-bg-surface));\n        color: var(--mj-brand-primary);\n    }\n\n    .log-direction {\n        display: flex; align-items: center;\n        gap: 4px; font-size: 11px;\n        color: var(--mj-text-muted);\n    }\n    .log-direction i { font-size: 10px; }\n    .log-direction.sending i { color: var(--mj-brand-primary); }\n    .log-direction.receiving i { color: var(--mj-status-success); }\n\n    .log-provider-badge {\n        display: inline-flex; align-items: center;\n        gap: 6px; padding: 3px 10px;\n        border-radius: 4px;\n        background: var(--mj-bg-surface-sunken);\n        font-weight: 500;\n    }\n\n    .log-error-text {\n        color: var(--mj-status-error);\n        max-width: 200px;\n        overflow: hidden; text-overflow: ellipsis;\n        white-space: nowrap; font-size: 11px;\n        display: block;\n    }\n    .no-error { color: var(--mj-text-muted); }\n\n    .no-data { padding: 0 !important; }\n    .empty-state {\n        display: flex; flex-direction: column;\n        align-items: center; justify-content: center;\n        padding: 48px 0; color: var(--mj-text-muted);\n    }\n    .empty-state i { font-size: 2rem; margin-bottom: 12px; opacity: 0.5; }\n    .empty-state p { margin: 0; font-size: 13px; }\n  "] }]
     }], () => [{ type: i0.ChangeDetectorRef }], null); })();
-(() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassDebugInfo(CommunicationLogsResourceComponent, { className: "CommunicationLogsResourceComponent", filePath: "src/Communication/communication-logs-resource.component.ts", lineNumber: 195 }); })();
+(() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassDebugInfo(CommunicationLogsResourceComponent, { className: "CommunicationLogsResourceComponent", filePath: "src/Communication/communication-logs-resource.component.ts", lineNumber: 203 }); })();
 //# sourceMappingURL=communication-logs-resource.component.js.map

package/dist/Communication/communication-logs-resource.component.js.map

@@ -1 +1 @@
-{"version":3,"file":"communication-logs-resource.component.js","sourceRoot":"","sources":["../../src/Communication/communication-logs-resource.component.ts"],"names":[],"mappings":";;;;;;AAAA,OAAO,EAAE,SAAS,EAAwC,MAAM,eAAe,CAAC;AAEhF,OAAO,EAAE,aAAa,EAAE,MAAM,wBAAwB,CAAC;AACvD,OAAO,EAAE,qBAAqB,EAAE,MAAM,2BAA2B,CAAC;AAClE,OAAO,EAAE,OAAO,EAAE,MAAM,sBAAsB,CAAC;;;;;IA6DzB,gCAAwD;IACtD,YACF;IAAA,iBAAO;;;IAFsB,2CAA0B;IACrD,cACF;IADE,oDACF;;;IAGA,gCAAuB;IAAA,sBAAO;IAAA,iBAAO;;;IA1BvC,AADF,AADF,0BAAI,SACE,eACoE;IACpE,oBAA2C;IAC3C,YACF;IACF,AADE,iBAAO,EACJ;IAEH,AADF,0BAAI,eACkE;IAClE,oBAA4G;IAC5G,YACF;IACF,AADE,iBAAO,EACJ;IAEH,AADF,0BAAI,gBAC+B;IAC/B,qBAAwH;IACxH,aACF;IACF,AADE,iBAAO,EACJ;IACL,2BAAI;IAAA,aAAwC;IAAA,iBAAK;IACjD,2BAAI;IAAA,aAAmC;;IAAA,iBAAK;IAC5C,2BAAI;IACF,+GAAwB;IAKxB,+GAAyB;IAI7B,AADE,iBAAK,EACF;;;;IA7B8B,eAAsC;IAAtC,8DAAsC;IAChE,cAAmC;IAAnC,kDAAmC;IACtC,cACF;IADE,8CACF;IAG4B,eAAuC;IAAvC,wDAAuC;IAC9D,cAAoG;IAApG,4GAAoG;IACvG,cACF;IADE,iDACF;IAIK,eAAoD;IAApD,mEAAoD;IAAC,8EAA2D;IACnH,cACF;IADE,6DACF;IAEE,eAAwC;IAAxC,6DAAwC;IACxC,eAAmC;IAAnC,0EAAmC;IAErC,eAIC;IAJD,+CAIC;IACD,cAEC;IAFD,gDAEC;;;IAOD,AADF,AADF,0BAAI,aAC8B,cACL;IACvB,wBAAiC;IACjC,yBAAG;IAAA,oDAAoC;IAG7C,AADE,AADE,AADyC,iBAAI,EACvC,EACH,EACF;;AA+Gd,IAAM,kCAAkC,GAAxC,MAAM,kCAAmC,SAAQ,qBAAqB;IAOrD;IANb,IAAI,GAA+B,EAAE,CAAC;IACtC,YAAY,GAA+B,EAAE,CAAC;IAC9C,SAAS,GAAG,KAAK,CAAC;IAClB,YAAY,GAAG,EAAE,CAAC;IACjB,UAAU,GAAG,EAAE,CAAC;IAExB,YAAoB,GAAsB;QACtC,KAAK,EAAE,CAAC;QADQ,QAAG,GAAH,GAAG,CAAmB;IAE1C,CAAC;IAED,KAAK,CAAC,QAAQ;QACV,KAAK,CAAC,QAAQ,EAAE,CAAC;QACjB,MAAM,IAAI,CAAC,QAAQ,EAAE,CAAC;QACtB,IAAI,CAAC,kBAAkB,EAAE,CAAC;IAC9B,CAAC;IAED,WAAW;QACP,KAAK,CAAC,WAAW,EAAE,CAAC;IACxB,CAAC;IAEM,KAAK,CAAC,QAAQ;QACjB,IAAI,CAAC;YACD,IAAI,CAAC,SAAS,GAAG,IAAI,CAAC;YACtB,IAAI,CAAC,GAAG,CAAC,aAAa,EAAE,CAAC;YAEzB,MAAM,EAAE,GAAG,OAAO,CAAC,oBAAoB,CAAC,IAAI,CAAC,aAAa,CAAC,CAAC;YAC5D,MAAM,MAAM,GAAG,MAAM,EAAE,CAAC,OAAO,CAA2B;gBACtD,UAAU,EAAE,wBAAwB;gBACpC,OAAO,EAAE,kBAAkB;gBAC3B,OAAO,EAAE,GAAG;gBACZ,UAAU,EAAE,eAAe;aAC9B,CAAC,CAAC;YAEH,IAAI,MAAM,CAAC,OAAO,EAAE,CAAC;gBACjB,IAAI,CAAC,IAAI,GAAG,MAAM,CAAC,OAAO,CAAC;gBAC3B,IAAI,CAAC,WAAW,EAAE,CAAC;YACvB,CAAC;QACL,CAAC;QAAC,OAAO,KAAK,EAAE,CAAC;YACb,OAAO,CAAC,KAAK,CAAC,qBAAqB,EAAE,KAAK,CAAC,CAAC;QAChD,CAAC;gBAAS,CAAC;YACP,IAAI,CAAC,SAAS,GAAG,KAAK,CAAC;YACvB,IAAI,CAAC,GAAG,CAAC,aAAa,EAAE,CAAC;QAC7B,CAAC;IACL,CAAC;IAEM,aAAa,CAAC,KAAa;QAC9B,IAAI,CAAC,UAAU,GAAG,CAAC,KAAK,IAAI,EAAE,CAAC,CAAC,WAAW,EAAE,CAAC;QAC9C,IAAI,CAAC,WAAW,EAAE,CAAC;IACvB,CAAC;IAEM,cAAc,CAAC,MAAc;QAChC,IAAI,CAAC,YAAY,GAAG,MAAM,CAAC;QAC3B,IAAI,CAAC,WAAW,EAAE,CAAC;IACvB,CAAC;IAEM,cAAc,CAAC,MAAc;QAChC,MAAM,CAAC,GAAG,CAAC,MAAM,IAAI,EAAE,CAAC,CAAC,WAAW,EAAE,CAAC;QACvC,IAAI,CAAC,KAAK,UAAU;YAAE,OAAO,UAAU,CAAC;QACxC,IAAI,CAAC,KAAK,QAAQ;YAAE,OAAO,QAAQ,CAAC;QACpC,IAAI,CAAC,KAAK,SAAS;YAAE,OAAO,SAAS,CAAC;QACtC,IAAI,CAAC,KAAK,aAAa;YAAE,OAAO,aAAa,CAAC;QAC9C,OAAO,EAAE,CAAC;IACd,CAAC;IAEM,aAAa,CAAC,MAAc;QAC/B,MAAM,CAAC,GAAG,CAAC,MAAM,IAAI,EAAE,CAAC,CAAC,WAAW,EAAE,CAAC;QACvC,IAAI,CAAC,KAAK,UAAU;YAAE,OAAO,mBAAmB,CAAC;QACjD,IAAI,CAAC,KAAK,QAAQ;YAAE,OAAO,mBAAmB,CAAC;QAC/C,IAAI,CAAC,KAAK,SAAS;YAAE,OAAO,mBAAmB,CAAC;QAChD,IAAI,CAAC,KAAK,aAAa;YAAE,OAAO,qBAAqB,CAAC;QACtD,OAAO,oBAAoB,CAAC;IAChC,CAAC;IAEM,eAAe,CAAC,IAAY;QAC/B,IAAI,CAAC,IAAI;YAAE,OAAO,oBAAoB,CAAC;QACvC,MAAM,CAAC,GAAG,IAAI,CAAC,WAAW,EAAE,CAAC;QAC7B,IAAI,CAAC,CAAC,QAAQ,CAAC,UAAU,CAAC;YAAE,OAAO,sBAAsB,CAAC;QAC1D,IAAI,CAAC,CAAC,QAAQ,CAAC,QAAQ,CAAC;YAAE,OAAO,yBAAyB,CAAC;QAC3D,IAAI,CAAC,CAAC,QAAQ,CAAC,OAAO,CAAC,IAAI,CAAC,CAAC,QAAQ,CAAC,QAAQ,CAAC;YAAE,OAAO,qBAAqB,CAAC;QAC9E,IAAI,CAAC,CAAC,QAAQ,CAAC,WAAW,CAAC,IAAI,CAAC,CAAC,QAAQ,CAAC,OAAO,CAAC;YAAE,OAAO,wBAAwB,CAAC;QACpF,OAAO,oBAAoB,CAAC;IAChC,CAAC;IAEM,gBAAgB,CAAC,IAAY;QAChC,IAAI,CAAC,IAAI;YAAE,OAAO,SAAS,CAAC;QAC5B,MAAM,CAAC,GAAG,IAAI,CAAC,WAAW,EAAE,CAAC;QAC7B,IAAI,CAAC,CAAC,QAAQ,CAAC,UAAU,CAAC;YAAE,OAAO,SAAS,CAAC;QAC7C,IAAI,CAAC,CAAC,QAAQ,CAAC,QAAQ,CAAC;YAAE,OAAO,SAAS,CAAC;QAC3C,IAAI,CAAC,CAAC,QAAQ,CAAC,OAAO,CAAC,IAAI,CAAC,CAAC,QAAQ,CAAC,QAAQ,CAAC;YAAE,OAAO,SAAS,CAAC;QAClE,IAAI,CAAC,CAAC,QAAQ,CAAC,WAAW,CAAC,IAAI,CAAC,CAAC,QAAQ,CAAC,OAAO,CAAC;YAAE,OAAO,SAAS,CAAC;QACrE,OAAO,SAAS,CAAC;IACrB,CAAC;IAEO,WAAW;QACf,IAAI,QAAQ,GAAG,IAAI,CAAC,IAAI,CAAC;QAEzB,IAAI,IAAI,CAAC,YAAY,EAAE,CAAC;YACpB,QAAQ,GAAG,QAAQ,CAAC,MAAM,CAAC,CAAC,CAAC,EAAE,CAAC,CAAC,CAAC,MAAM,KAAK,IAAI,CAAC,YAAY,CAAC,CAAC;QACpE,CAAC;QAED,IAAI,IAAI,CAAC,UAAU,EAAE,CAAC;YAClB,QAAQ,GAAG,QAAQ,CAAC,MAAM,CAAC,CAAC,CAAC,EAAE,CAC3B,CAAC,CAAC,qBAAqB,EAAE,WAAW,EAAE,CAAC,QAAQ,CAAC,IAAI,CAAC,UAAU,CAAC;gBAChE,CAAC,CAAC,gCAAgC,EAAE,WAAW,EAAE,CAAC,QAAQ,CAAC,IAAI,CAAC,UAAU,CAAC;gBAC3E,CAAC,CAAC,MAAM,EAAE,WAAW,EAAE,CAAC,QAAQ,CAAC,IAAI,CAAC,UAAU,CAAC;gBACjD,CAAC,CAAC,YAAY,EAAE,WAAW,EAAE,CAAC,QAAQ,CAAC,IAAI,CAAC,UAAU,CAAC,CAC1D,CAAC;QACN,CAAC;QAED,IAAI,CAAC,YAAY,GAAG,QAAQ,CAAC;QAC7B,IAAI,CAAC,GAAG,CAAC,aAAa,EAAE,CAAC;IAC7B,CAAC;IAED,KAAK,CAAC,sBAAsB,CAAC,IAAkB;QAC3C,OAAO,cAAc,CAAC;IAC1B,CAAC;IAED,KAAK,CAAC,oBAAoB,CAAC,IAAkB;QACzC,OAAO,qBAAqB,CAAC;IACjC,CAAC;4HAxHQ,kCAAkC;6DAAlC,kCAAkC;YArLrC,AADF,AADF,AADF,sCAAgB,wBAC0C,aACzC,2BACqD;YAAvB,8HAAW,cAAU,IAAC;YACjE,AADkE,iBAAoB,EAChF;YAEJ,AADF,8BAAa,wBAG6B;YAAtC,yIAAe,yBAAqB,IAAC;YACvC,iBAAiB;YACjB,yCAAuI;YAA/B,2HAAW,mBAAe,EAAE,CAAC,IAAC;YAAC,iBAAiB;YACxJ,yCAA+I;YAAvC,2HAAW,mBAAe,UAAU,CAAC,IAAC;YAAC,iBAAiB;YAChK,yCAA6I;YAArC,2HAAW,mBAAe,QAAQ,CAAC,IAAC;YAAC,iBAAiB;YAC9J,yCAA8I;YAAtC,2HAAW,mBAAe,SAAS,CAAC,IAAC;YAEjJ,AADE,AADgJ,iBAAiB,EAC3J,EACS;YAOP,AADF,AADF,AADF,AADF,AADA,AADF,wCAA4B,eACH,eACI,iBACA,aAChB,UACD,UACE;YAAA,uBAAM;YAAA,iBAAK;YACf,2BAAI;YAAA,0BAAS;YAAA,iBAAK;YAClB,2BAAI;YAAA,yBAAQ;YAAA,iBAAK;YACjB,2BAAI;YAAA,qBAAI;YAAA,iBAAK;YACb,2BAAI;YAAA,qBAAI;YAAA,iBAAK;YACb,2BAAI;YAAA,sBAAK;YAEb,AADE,AADW,iBAAK,EACX,EACC;YACR,8BAAO;YACL,6HAiCC;YACD,kGAA+C;YAezD,AADE,AADE,AADA,AADE,AADE,iBAAQ,EACF,EACJ,EACA,EACO,EACA;;YA7EQ,eAAqB;YAArB,uCAAqB;YAOyB,eAA8B;YAA9B,gDAA8B;YAC9B,cAAsC;YAAtC,wDAAsC;YACtC,cAAoC;YAApC,sDAAoC;YACpC,cAAqC;YAArC,uDAAqC;YAG5F,cAAa;YAAb,2BAAa;YAenB,gBAiCC;YAjCD,+BAiCC;YACD,eASC;YATD,2EASC;;;AA8GF,kCAAkC;IA7L9C,aAAa,CAAC,qBAAqB,EAAE,2BAA2B,CAAC;GA6LrD,kCAAkC,CAyH9C;;iFAzHY,kCAAkC;cA5L9C,SAAS;6BACI,KAAK,YACL,gCAAgC,YAChC;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;KAkFT;;kFAuGQ,kCAAkC","sourcesContent":["import { Component, OnInit, OnDestroy, ChangeDetectorRef } from '@angular/core';\nimport { ResourceData, MJCommunicationLogEntity } from '@memberjunction/core-entities';\nimport { RegisterClass } from '@memberjunction/global';\nimport { BaseResourceComponent } from '@memberjunction/ng-shared';\nimport { RunView } from '@memberjunction/core';\n@RegisterClass(BaseResourceComponent, 'CommunicationLogsResource')\n@Component({\n  standalone: false,\n    selector: 'mj-communication-logs-resource',\n    template: `\n    <mj-page-layout>\n      <mj-page-header Title=\"Logs\" Icon=\"fa-solid fa-list-ul\">\n        <div actions>\n          <mj-refresh-button [Loading]=\"isLoading\" (Clicked)=\"loadData()\"></mj-refresh-button>\n        </div>\n        <div toolbar>\n          <mj-page-search\n            Placeholder=\"Search messages, providers, recipients...\"\n            (ValueChange)=\"onSearchValue($event)\">\n          </mj-page-search>\n          <mj-filter-chip Label=\"All\"     Icon=\"fa-solid fa-filter\"        [Active]=\"statusFilter === ''\"         (Clicked)=\"onStatusFilter('')\"></mj-filter-chip>\n          <mj-filter-chip Label=\"Sent\"    Icon=\"fa-solid fa-check-circle\"  [Active]=\"statusFilter === 'Complete'\" (Clicked)=\"onStatusFilter('Complete')\"></mj-filter-chip>\n          <mj-filter-chip Label=\"Failed\"  Icon=\"fa-solid fa-times-circle\"  [Active]=\"statusFilter === 'Failed'\"   (Clicked)=\"onStatusFilter('Failed')\"></mj-filter-chip>\n          <mj-filter-chip Label=\"Pending\" Icon=\"fa-solid fa-clock\"         [Active]=\"statusFilter === 'Pending'\"  (Clicked)=\"onStatusFilter('Pending')\"></mj-filter-chip>\n        </div>\n      </mj-page-header>\n      <mj-page-body [Flex]=\"true\">\n        <div class=\"logs-card\">\n        <div class=\"table-wrapper\">\n          <table class=\"log-table\">\n            <thead>\n              <tr>\n                <th>Status</th>\n                <th>Direction</th>\n                <th>Provider</th>\n                <th>Type</th>\n                <th>Date</th>\n                <th>Error</th>\n              </tr>\n            </thead>\n            <tbody>\n              @for (log of filteredLogs; track log) {\n                <tr>\n                  <td>\n                    <span class=\"log-status-badge\" [ngClass]=\"getStatusClass(log.Status)\">\n                      <i [class]=\"getStatusIcon(log.Status)\"></i>\n                      {{log.Status}}\n                    </span>\n                  </td>\n                  <td>\n                    <span class=\"log-direction\" [ngClass]=\"log.Direction.toLowerCase()\">\n                      <i [class]=\"log.Direction === 'Sending' ? 'fa-solid fa-arrow-up-right' : 'fa-solid fa-arrow-down-left'\"></i>\n                      {{log.Direction}}\n                    </span>\n                  </td>\n                  <td>\n                    <span class=\"log-provider-badge\">\n                      <i [class]=\"getProviderIcon(log.CommunicationProvider)\" [style.color]=\"getProviderColor(log.CommunicationProvider)\"></i>\n                      {{log.CommunicationProvider}}\n                    </span>\n                  </td>\n                  <td>{{log.CommunicationProviderMessageType}}</td>\n                  <td>{{log.MessageDate | date:'medium'}}</td>\n                  <td>\n                    @if (log.ErrorMessage) {\n                      <span class=\"log-error-text\" [title]=\"log.ErrorMessage\">\n                        {{log.ErrorMessage}}\n                      </span>\n                    }\n                    @if (!log.ErrorMessage) {\n                      <span class=\"no-error\">&mdash;</span>\n                    }\n                  </td>\n                </tr>\n              }\n              @if (filteredLogs.length === 0 && !isLoading) {\n                <tr>\n                  <td colspan=\"6\" class=\"no-data\">\n                    <div class=\"empty-state\">\n                      <i class=\"fa-solid fa-inbox\"></i>\n                      <p>No logs found matching your criteria</p>\n                    </div>\n                  </td>\n                </tr>\n              }\n            </tbody>\n          </table>\n        </div>\n        </div>\n      </mj-page-body>\n    </mj-page-layout>\n    `,\n    styles: [`\n    /* Card wrapper inside <mj-page-body>: the table sits in a tinted card. */\n    .logs-card {\n        flex: 1;\n        min-height: 0;\n        background: var(--mj-bg-surface-card);\n        border: 1px solid var(--mj-border-default);\n        border-radius: 12px;\n        overflow: hidden;\n        display: flex;\n        flex-direction: column;\n    }\n\n    /* TABLE */\n    .table-wrapper { flex: 1; overflow-y: auto; }\n\n    .log-table {\n        width: 100%;\n        border-collapse: collapse;\n        font-size: 12px;\n    }\n    .log-table thead {\n        background: var(--mj-bg-surface-sunken);\n        position: sticky; top: 0; z-index: 1;\n    }\n    .log-table th {\n        padding: 10px 16px;\n        text-align: left;\n        font-weight: 700; font-size: 10px;\n        text-transform: uppercase; letter-spacing: 0.5px;\n        color: var(--mj-text-muted);\n        border-bottom: 1px solid var(--mj-border-default);\n        white-space: nowrap;\n    }\n    .log-table td {\n        padding: 12px 16px;\n        border-bottom: 1px solid var(--mj-border-default);\n        color: var(--mj-text-primary);\n        vertical-align: middle;\n    }\n    .log-table tbody tr { transition: background 0.15s; }\n    .log-table tbody tr:hover { background: var(--mj-bg-surface-sunken); }\n\n    .log-status-badge {\n        display: inline-flex; align-items: center;\n        gap: 4px; font-size: 11px; font-weight: 600;\n        padding: 3px 10px;\n        border-radius: 4px;\n    }\n    .log-status-badge.complete {\n        background: color-mix(in srgb, var(--mj-status-success) 15%, var(--mj-bg-surface));\n        color: var(--mj-status-success);\n    }\n    .log-status-badge.failed {\n        background: color-mix(in srgb, var(--mj-status-error) 15%, var(--mj-bg-surface));\n        color: var(--mj-status-error);\n    }\n    .log-status-badge.pending {\n        background: color-mix(in srgb, var(--mj-status-warning) 15%, var(--mj-bg-surface));\n        color: var(--mj-status-warning);\n    }\n    .log-status-badge.in-progress {\n        background: color-mix(in srgb, var(--mj-brand-primary) 15%, var(--mj-bg-surface));\n        color: var(--mj-brand-primary);\n    }\n\n    .log-direction {\n        display: flex; align-items: center;\n        gap: 4px; font-size: 11px;\n        color: var(--mj-text-muted);\n    }\n    .log-direction i { font-size: 10px; }\n    .log-direction.sending i { color: var(--mj-brand-primary); }\n    .log-direction.receiving i { color: var(--mj-status-success); }\n\n    .log-provider-badge {\n        display: inline-flex; align-items: center;\n        gap: 6px; padding: 3px 10px;\n        border-radius: 4px;\n        background: var(--mj-bg-surface-sunken);\n        font-weight: 500;\n    }\n\n    .log-error-text {\n        color: var(--mj-status-error);\n        max-width: 200px;\n        overflow: hidden; text-overflow: ellipsis;\n        white-space: nowrap; font-size: 11px;\n        display: block;\n    }\n    .no-error { color: var(--mj-text-muted); }\n\n    .no-data { padding: 0 !important; }\n    .empty-state {\n        display: flex; flex-direction: column;\n        align-items: center; justify-content: center;\n        padding: 48px 0; color: var(--mj-text-muted);\n    }\n    .empty-state i { font-size: 2rem; margin-bottom: 12px; opacity: 0.5; }\n    .empty-state p { margin: 0; font-size: 13px; }\n  `]\n})\nexport class CommunicationLogsResourceComponent extends BaseResourceComponent implements OnInit, OnDestroy {\n    public logs: MJCommunicationLogEntity[] = [];\n    public filteredLogs: MJCommunicationLogEntity[] = [];\n    public isLoading = false;\n    public statusFilter = '';\n    private searchTerm = '';\n\n    constructor(private cdr: ChangeDetectorRef) {\n        super();\n    }\n\n    async ngOnInit(): Promise<void> {\n        super.ngOnInit();\n        await this.loadData();\n        this.NotifyLoadComplete();\n    }\n\n    ngOnDestroy(): void {\n        super.ngOnDestroy();\n    }\n\n    public async loadData(): Promise<void> {\n        try {\n            this.isLoading = true;\n            this.cdr.detectChanges();\n\n            const rv = RunView.FromMetadataProvider(this.ProviderToUse);\n            const result = await rv.RunView<MJCommunicationLogEntity>({\n                EntityName: 'MJ: Communication Logs',\n                OrderBy: 'MessageDate DESC',\n                MaxRows: 200,\n                ResultType: 'entity_object'\n            });\n\n            if (result.Success) {\n                this.logs = result.Results;\n                this.applyFilter();\n            }\n        } catch (error) {\n            console.error('Error loading logs:', error);\n        } finally {\n            this.isLoading = false;\n            this.cdr.detectChanges();\n        }\n    }\n\n    public onSearchValue(value: string): void {\n        this.searchTerm = (value ?? '').toLowerCase();\n        this.applyFilter();\n    }\n\n    public onStatusFilter(status: string): void {\n        this.statusFilter = status;\n        this.applyFilter();\n    }\n\n    public getStatusClass(status: string): string {\n        const s = (status || '').toLowerCase();\n        if (s === 'complete') return 'complete';\n        if (s === 'failed') return 'failed';\n        if (s === 'pending') return 'pending';\n        if (s === 'in-progress') return 'in-progress';\n        return '';\n    }\n\n    public getStatusIcon(status: string): string {\n        const s = (status || '').toLowerCase();\n        if (s === 'complete') return 'fa-solid fa-check';\n        if (s === 'failed') return 'fa-solid fa-xmark';\n        if (s === 'pending') return 'fa-solid fa-clock';\n        if (s === 'in-progress') return 'fa-solid fa-spinner';\n        return 'fa-solid fa-circle';\n    }\n\n    public getProviderIcon(name: string): string {\n        if (!name) return 'fa-solid fa-server';\n        const n = name.toLowerCase();\n        if (n.includes('sendgrid')) return 'fa-solid fa-envelope';\n        if (n.includes('twilio')) return 'fa-solid fa-comment-sms';\n        if (n.includes('gmail') || n.includes('google')) return 'fa-brands fa-google';\n        if (n.includes('microsoft') || n.includes('graph')) return 'fa-brands fa-microsoft';\n        return 'fa-solid fa-server';\n    }\n\n    public getProviderColor(name: string): string {\n        if (!name) return 'inherit';\n        const n = name.toLowerCase();\n        if (n.includes('sendgrid')) return '#1A82E2';\n        if (n.includes('twilio')) return '#F22F46';\n        if (n.includes('gmail') || n.includes('google')) return '#EA4335';\n        if (n.includes('microsoft') || n.includes('graph')) return '#0078D4';\n        return 'inherit';\n    }\n\n    private applyFilter(): void {\n        let filtered = this.logs;\n\n        if (this.statusFilter) {\n            filtered = filtered.filter(l => l.Status === this.statusFilter);\n        }\n\n        if (this.searchTerm) {\n            filtered = filtered.filter(l =>\n                l.CommunicationProvider?.toLowerCase().includes(this.searchTerm) ||\n                l.CommunicationProviderMessageType?.toLowerCase().includes(this.searchTerm) ||\n                l.Status?.toLowerCase().includes(this.searchTerm) ||\n                l.ErrorMessage?.toLowerCase().includes(this.searchTerm)\n            );\n        }\n\n        this.filteredLogs = filtered;\n        this.cdr.detectChanges();\n    }\n\n    async GetResourceDisplayName(data: ResourceData): Promise<string> {\n        return 'Message Logs';\n    }\n\n    async GetResourceIconClass(data: ResourceData): Promise<string> {\n        return 'fa-solid fa-list-ul';\n    }\n}\n"]}
+{"version":3,"file":"communication-logs-resource.component.js","sourceRoot":"","sources":["../../src/Communication/communication-logs-resource.component.ts"],"names":[],"mappings":"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","sourcesContent":["import { Component, OnInit, OnDestroy, ChangeDetectorRef } from '@angular/core';\nimport { ResourceData, MJCommunicationLogEntity } from '@memberjunction/core-entities';\nimport { RegisterClass } from '@memberjunction/global';\nimport { BaseResourceComponent } from '@memberjunction/ng-shared';\nimport { RunView } from '@memberjunction/core';\nimport { FilterFieldConfig } from '@memberjunction/ng-ui-components';\n@RegisterClass(BaseResourceComponent, 'CommunicationLogsResource')\n@Component({\n  standalone: false,\n    selector: 'mj-communication-logs-resource',\n    template: `\n    <mj-page-layout>\n      <mj-page-header Title=\"Logs\" Icon=\"fa-solid fa-list-ul\">\n        <div actions>\n          <mj-refresh-button [Loading]=\"isLoading\" (Clicked)=\"loadData()\"></mj-refresh-button>\n        </div>\n        <div toolbar>\n          <mj-page-search\n            Placeholder=\"Search messages, providers, recipients...\"\n            (ValueChange)=\"onSearchValue($event)\">\n          </mj-page-search>\n          <mj-filter-popover\n            [ActiveCount]=\"ActiveFilterCount\"\n            [ShowClearAll]=\"ActiveFilterCount > 0\"\n            (ClearAllRequested)=\"resetFilters()\">\n            <mj-filter-panel\n              [Fields]=\"filterFields\"\n              [Values]=\"filterValues\"\n              (ValuesChange)=\"onFilterValuesChange($event)\"\n              (Reset)=\"resetFilters()\">\n            </mj-filter-panel>\n          </mj-filter-popover>\n        </div>\n      </mj-page-header>\n      <mj-page-body [Flex]=\"true\">\n        <div class=\"logs-card\">\n        <div class=\"table-wrapper\">\n          <table class=\"log-table\">\n            <thead>\n              <tr>\n                <th>Status</th>\n                <th>Direction</th>\n                <th>Provider</th>\n                <th>Type</th>\n                <th>Date</th>\n                <th>Error</th>\n              </tr>\n            </thead>\n            <tbody>\n              @for (log of filteredLogs; track log) {\n                <tr>\n                  <td>\n                    <span class=\"log-status-badge\" [ngClass]=\"getStatusClass(log.Status)\">\n                      <i [class]=\"getStatusIcon(log.Status)\"></i>\n                      {{log.Status}}\n                    </span>\n                  </td>\n                  <td>\n                    <span class=\"log-direction\" [ngClass]=\"log.Direction.toLowerCase()\">\n                      <i [class]=\"log.Direction === 'Sending' ? 'fa-solid fa-arrow-up-right' : 'fa-solid fa-arrow-down-left'\"></i>\n                      {{log.Direction}}\n                    </span>\n                  </td>\n                  <td>\n                    <span class=\"log-provider-badge\">\n                      <i [class]=\"getProviderIcon(log.CommunicationProvider)\" [style.color]=\"getProviderColor(log.CommunicationProvider)\"></i>\n                      {{log.CommunicationProvider}}\n                    </span>\n                  </td>\n                  <td>{{log.CommunicationProviderMessageType}}</td>\n                  <td>{{log.MessageDate | date:'medium'}}</td>\n                  <td>\n                    @if (log.ErrorMessage) {\n                      <span class=\"log-error-text\" [title]=\"log.ErrorMessage\">\n                        {{log.ErrorMessage}}\n                      </span>\n                    }\n                    @if (!log.ErrorMessage) {\n                      <span class=\"no-error\">&mdash;</span>\n                    }\n                  </td>\n                </tr>\n              }\n              @if (filteredLogs.length === 0 && !isLoading) {\n                <tr>\n                  <td colspan=\"6\" class=\"no-data\">\n                    <div class=\"empty-state\">\n                      <i class=\"fa-solid fa-inbox\"></i>\n                      <p>No logs found matching your criteria</p>\n                    </div>\n                  </td>\n                </tr>\n              }\n            </tbody>\n          </table>\n        </div>\n        </div>\n      </mj-page-body>\n    </mj-page-layout>\n    `,\n    styles: [`\n    /* Card wrapper inside <mj-page-body>: the table sits in a tinted card. */\n    .logs-card {\n        flex: 1;\n        min-height: 0;\n        background: var(--mj-bg-surface-card);\n        border: 1px solid var(--mj-border-default);\n        border-radius: 12px;\n        overflow: hidden;\n        display: flex;\n        flex-direction: column;\n    }\n\n    /* TABLE */\n    .table-wrapper { flex: 1; overflow-y: auto; }\n\n    .log-table {\n        width: 100%;\n        border-collapse: collapse;\n        font-size: 12px;\n    }\n    .log-table thead {\n        background: var(--mj-bg-surface-sunken);\n        position: sticky; top: 0; z-index: 1;\n    }\n    .log-table th {\n        padding: 10px 16px;\n        text-align: left;\n        font-weight: 700; font-size: 10px;\n        text-transform: uppercase; letter-spacing: 0.5px;\n        color: var(--mj-text-muted);\n        border-bottom: 1px solid var(--mj-border-default);\n        white-space: nowrap;\n    }\n    .log-table td {\n        padding: 12px 16px;\n        border-bottom: 1px solid var(--mj-border-default);\n        color: var(--mj-text-primary);\n        vertical-align: middle;\n    }\n    .log-table tbody tr { transition: background 0.15s; }\n    .log-table tbody tr:hover { background: var(--mj-bg-surface-sunken); }\n\n    .log-status-badge {\n        display: inline-flex; align-items: center;\n        gap: 4px; font-size: 11px; font-weight: 600;\n        padding: 3px 10px;\n        border-radius: 4px;\n    }\n    .log-status-badge.complete {\n        background: color-mix(in srgb, var(--mj-status-success) 15%, var(--mj-bg-surface));\n        color: var(--mj-status-success);\n    }\n    .log-status-badge.failed {\n        background: color-mix(in srgb, var(--mj-status-error) 15%, var(--mj-bg-surface));\n        color: var(--mj-status-error);\n    }\n    .log-status-badge.pending {\n        background: color-mix(in srgb, var(--mj-status-warning) 15%, var(--mj-bg-surface));\n        color: var(--mj-status-warning);\n    }\n    .log-status-badge.in-progress {\n        background: color-mix(in srgb, var(--mj-brand-primary) 15%, var(--mj-bg-surface));\n        color: var(--mj-brand-primary);\n    }\n\n    .log-direction {\n        display: flex; align-items: center;\n        gap: 4px; font-size: 11px;\n        color: var(--mj-text-muted);\n    }\n    .log-direction i { font-size: 10px; }\n    .log-direction.sending i { color: var(--mj-brand-primary); }\n    .log-direction.receiving i { color: var(--mj-status-success); }\n\n    .log-provider-badge {\n        display: inline-flex; align-items: center;\n        gap: 6px; padding: 3px 10px;\n        border-radius: 4px;\n        background: var(--mj-bg-surface-sunken);\n        font-weight: 500;\n    }\n\n    .log-error-text {\n        color: var(--mj-status-error);\n        max-width: 200px;\n        overflow: hidden; text-overflow: ellipsis;\n        white-space: nowrap; font-size: 11px;\n        display: block;\n    }\n    .no-error { color: var(--mj-text-muted); }\n\n    .no-data { padding: 0 !important; }\n    .empty-state {\n        display: flex; flex-direction: column;\n        align-items: center; justify-content: center;\n        padding: 48px 0; color: var(--mj-text-muted);\n    }\n    .empty-state i { font-size: 2rem; margin-bottom: 12px; opacity: 0.5; }\n    .empty-state p { margin: 0; font-size: 13px; }\n  `]\n})\nexport class CommunicationLogsResourceComponent extends BaseResourceComponent implements OnInit, OnDestroy {\n    public logs: MJCommunicationLogEntity[] = [];\n    public filteredLogs: MJCommunicationLogEntity[] = [];\n    public isLoading = false;\n    public statusFilter = '';\n    private searchTerm = '';\n\n    constructor(private cdr: ChangeDetectorRef) {\n        super();\n    }\n\n    async ngOnInit(): Promise<void> {\n        super.ngOnInit();\n        await this.loadData();\n        this.NotifyLoadComplete();\n    }\n\n    ngOnDestroy(): void {\n        super.ngOnDestroy();\n    }\n\n    public async loadData(): Promise<void> {\n        try {\n            this.isLoading = true;\n            this.cdr.detectChanges();\n\n            const rv = RunView.FromMetadataProvider(this.ProviderToUse);\n            const result = await rv.RunView<MJCommunicationLogEntity>({\n                EntityName: 'MJ: Communication Logs',\n                OrderBy: 'MessageDate DESC',\n                MaxRows: 200,\n                ResultType: 'entity_object'\n            });\n\n            if (result.Success) {\n                this.logs = result.Results;\n                this.applyFilter();\n            }\n        } catch (error) {\n            console.error('Error loading logs:', error);\n        } finally {\n            this.isLoading = false;\n            this.cdr.detectChanges();\n        }\n    }\n\n    public onSearchValue(value: string): void {\n        this.searchTerm = (value ?? '').toLowerCase();\n        this.applyFilter();\n    }\n\n    public onStatusFilter(status: string): void {\n        this.statusFilter = status;\n        this.applyFilter();\n    }\n\n    // -- Concise chrome: Status lives behind the one Filter popover -----------\n\n    public get filterFields(): FilterFieldConfig[] {\n        return [{\n            key: 'status',\n            type: 'chips',\n            label: 'Status',\n            chipOptions: [\n                { text: 'All', value: '' },\n                { text: 'Sent', value: 'Complete', icon: 'fa-solid fa-check-circle' },\n                { text: 'Failed', value: 'Failed', icon: 'fa-solid fa-times-circle' },\n                { text: 'Pending', value: 'Pending', icon: 'fa-solid fa-clock' },\n            ],\n        }];\n    }\n\n    public get filterValues(): Record<string, unknown> {\n        return { status: this.statusFilter };\n    }\n\n    public get ActiveFilterCount(): number {\n        return this.statusFilter ? 1 : 0;\n    }\n\n    public onFilterValuesChange(values: Record<string, unknown>): void {\n        this.onStatusFilter((values['status'] as string) ?? '');\n    }\n\n    public resetFilters(): void {\n        this.onStatusFilter('');\n    }\n\n    public getStatusClass(status: string): string {\n        const s = (status || '').toLowerCase();\n        if (s === 'complete') return 'complete';\n        if (s === 'failed') return 'failed';\n        if (s === 'pending') return 'pending';\n        if (s === 'in-progress') return 'in-progress';\n        return '';\n    }\n\n    public getStatusIcon(status: string): string {\n        const s = (status || '').toLowerCase();\n        if (s === 'complete') return 'fa-solid fa-check';\n        if (s === 'failed') return 'fa-solid fa-xmark';\n        if (s === 'pending') return 'fa-solid fa-clock';\n        if (s === 'in-progress') return 'fa-solid fa-spinner';\n        return 'fa-solid fa-circle';\n    }\n\n    public getProviderIcon(name: string): string {\n        if (!name) return 'fa-solid fa-server';\n        const n = name.toLowerCase();\n        if (n.includes('sendgrid')) return 'fa-solid fa-envelope';\n        if (n.includes('twilio')) return 'fa-solid fa-comment-sms';\n        if (n.includes('gmail') || n.includes('google')) return 'fa-brands fa-google';\n        if (n.includes('microsoft') || n.includes('graph')) return 'fa-brands fa-microsoft';\n        return 'fa-solid fa-server';\n    }\n\n    public getProviderColor(name: string): string {\n        if (!name) return 'inherit';\n        const n = name.toLowerCase();\n        if (n.includes('sendgrid')) return '#1A82E2';\n        if (n.includes('twilio')) return '#F22F46';\n        if (n.includes('gmail') || n.includes('google')) return '#EA4335';\n        if (n.includes('microsoft') || n.includes('graph')) return '#0078D4';\n        return 'inherit';\n    }\n\n    private applyFilter(): void {\n        let filtered = this.logs;\n\n        if (this.statusFilter) {\n            filtered = filtered.filter(l => l.Status === this.statusFilter);\n        }\n\n        if (this.searchTerm) {\n            filtered = filtered.filter(l =>\n                l.CommunicationProvider?.toLowerCase().includes(this.searchTerm) ||\n                l.CommunicationProviderMessageType?.toLowerCase().includes(this.searchTerm) ||\n                l.Status?.toLowerCase().includes(this.searchTerm) ||\n                l.ErrorMessage?.toLowerCase().includes(this.searchTerm)\n            );\n        }\n\n        this.filteredLogs = filtered;\n        this.cdr.detectChanges();\n    }\n\n    async GetResourceDisplayName(data: ResourceData): Promise<string> {\n        return 'Message Logs';\n    }\n\n    async GetResourceIconClass(data: ResourceData): Promise<string> {\n        return 'fa-solid fa-list-ul';\n    }\n}\n"]}