@posiwise/admin-module 0.0.218 → 0.0.219

package/fesm2022/posiwise-admin-module.mjs

@@ -71,8 +71,8 @@ import { __decorate, __metadata } from 'tslib';
 import * as i15 from '@angular/cdk/drag-drop';
 import { moveItemInArray } from '@angular/cdk/drag-drop';
 import groupBy from 'lodash/groupBy';
-import { forkJoin, map, Subject, takeUntil, of } from 'rxjs';
-import { finalize, debounceTime, switchMap, filter, take, concatMap, map as map$1, catchError } from 'rxjs/operators';
+import { forkJoin, of, map, Subject, takeUntil } from 'rxjs';
+import { finalize, switchMap, debounceTime, filter, take, concatMap, map as map$1, catchError } from 'rxjs/operators';
 import * as i3$2 from '@angular/platform-browser';
 import * as i4$3 from 'primeng/tabs';
 import uniqBy from 'lodash/uniqBy';
@@ -3361,7 +3361,7 @@ class GenericMiscComponent extends AppBaseComponent {
         super.ngOnDestroy();
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.6", ngImport: i0, type: GenericMiscComponent, deps: [{ token: i1.AdminService }, { token: i0.Injector }, { token: i0.ChangeDetectorRef }], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.6", type: GenericMiscComponent, isStandalone: false, selector: "pw-admin-generic-misc", viewQueries: [{ propertyName: "passwordValidationModalForInvalidSession", first: true, predicate: ["passwordValidationModalForInvalidSession"], descendants: true }], usesInheritance: true, ngImport: i0, template: "<!-- Per-microservice operations -->\n<h3>Microservice operations</h3>\n<p class=\"text-muted mb-3\">Cache, connection-pool, and Sidekiq tools, per microservice.</p>\n<div class=\"card\">\n  <div class=\"card-content\">\n    @if (microServices.length) {\n      <div class=\"table-responsive p-4\">\n        <table class=\"table align-middle mb-0\">\n          <thead>\n            <tr>\n              <th scope=\"col\">Service</th>\n              <th scope=\"col\">Redis cache</th>\n              <th scope=\"col\">Memcached cache</th>\n              <th scope=\"col\">Connection pools</th>\n              <th scope=\"col\">Sidekiq/Celery</th>\n            </tr>\n          </thead>\n          <tbody>\n            @for (svc of microServices; track svc.name) {\n              <tr>\n                <td class=\"fw-semibold\">{{ label(svc) }}</td>\n                <td>\n                  <button class=\"btn btn-sm btn-outline-danger\"\n                    [buttonBusy]=\"isBusy('redis', svc)\"\n                    (click)=\"flushRedis(svc)\">Flush</button>\n                </td>\n                <td>\n                  <button class=\"btn btn-sm btn-outline-danger\"\n                    [disabled]=\"!hasMemcached(svc)\"\n                    [attr.title]=\"hasMemcached(svc) ? null : 'Memcached not available for this service yet'\"\n                    [buttonBusy]=\"isBusy('memcached', svc)\"\n                    (click)=\"flushMemcached(svc)\">Flush</button>\n                </td>\n                <td>\n                  <button class=\"btn btn-sm btn-outline-primary\"\n                    [buttonBusy]=\"isBusy('inspect', svc)\"\n                    (click)=\"inspect(svc)\">Inspect</button>\n                </td>\n                <td>\n                  @if (queueDashboardUrl(svc)) {\n                    <a class=\"btn btn-sm btn-outline-secondary\"\n                      rel=\"noopener noreferrer\"\n                      target=\"_blank\"\n                      [href]=\"queueDashboardUrl(svc)\">Open</a>\n                  } @else {\n                    <button class=\"btn btn-sm btn-outline-secondary\"\n                      disabled\n                      title=\"No queue dashboard for this service yet\">Open</button>\n                  }\n                </td>\n              </tr>\n            }\n          </tbody>\n        </table>\n      </div>\n    } @else {\n      <p class=\"text-muted px-4 py-4 mb-0\">No microservices are configured for this environment.</p>\n    }\n  </div>\n</div>\n\n@for (entry of inspectedData | keyvalue; track entry.key) {\n  <div class=\"card mt-3\">\n    <div class=\"card-content\">\n      <div class=\"card-header d-flex justify-content-between align-items-center\">\n        <h4 class=\"mb-0\">Connection pools \u2014 {{ entry.key.replace('_', '-') }}</h4>\n        <button class=\"btn btn-sm btn-outline-secondary\"\n          (click)=\"clearInspection({ name: entry.key, value: '' })\">Clear</button>\n      </div>\n      <div class=\"px-4 pb-4\">\n        <ngx-json-viewer [json]=\"entry.value\" [expanded]=\"true\" [depth]=\"2\"></ngx-json-viewer>\n      </div>\n    </div>\n  </div>\n}\n\n<!-- Sessions \u2014 auth, subscription-scoped -->\n<h3 class=\"mt-4\">Sessions</h3>\n<p class=\"text-muted mb-3\">Authentication controls for the current subscription.</p>\n<div class=\"card\">\n  <div class=\"card-content\">\n    <div class=\"card-header\">\n      <h4 class=\"mb-2\">Invalidate all sessions</h4>\n      <p class=\"text-muted small mb-0\">Force-logs out every user in this subscription. Requires password confirmation.</p>\n    </div>\n    <div class=\"card-footer px-3\">\n      <button class=\"btn btn-outline-danger\"\n        [buttonBusy]=\"sessionButtonBusy\"\n        (click)=\"openInvalidateAllSessionsModal()\">Invalidate All Sessions</button>\n    </div>\n  </div>\n</div>\n\n<pw-password-validation #passwordValidationModalForInvalidSession\n  (successEvent)=\"invalidateAllSessions()\">\n</pw-password-validation>\n", dependencies: [{ kind: "component", type: i11$1.NgxJsonViewerComponent, selector: "ngx-json-viewer", inputs: ["json", "expanded", "depth", "_currentDepth"] }, { kind: "component", type: i10$1.PasswordValidationComponent, selector: "pw-password-validation", inputs: ["confirmMessage"], outputs: ["successEvent"] }, { kind: "directive", type: i11.ButtonBusyDirective, selector: "[buttonBusy]", inputs: ["buttonBusy", "busyText"] }, { kind: "pipe", type: i3.KeyValuePipe, name: "keyvalue" }] }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.6", type: GenericMiscComponent, isStandalone: false, selector: "pw-admin-generic-misc", viewQueries: [{ propertyName: "passwordValidationModalForInvalidSession", first: true, predicate: ["passwordValidationModalForInvalidSession"], descendants: true }], usesInheritance: true, ngImport: i0, template: "<!-- Per-microservice operations -->\n<h3>Microservice operations</h3>\n<p class=\"text-muted mb-3\">Cache, connection-pool, and Sidekiq tools, per microservice.</p>\n<div class=\"card\">\n  <div class=\"card-content\">\n    @if (microServices.length) {\n      <div class=\"table-responsive p-4\">\n        <table class=\"table align-middle mb-0\">\n          <thead>\n            <tr>\n              <th scope=\"col\">Service</th>\n              <th scope=\"col\">Redis cache</th>\n              <th scope=\"col\">Memcached cache</th>\n              <th scope=\"col\">Connection pools</th>\n              <th scope=\"col\">Sidekiq/Celery</th>\n            </tr>\n          </thead>\n          <tbody>\n            @for (svc of microServices; track svc.name) {\n              <tr>\n                <td class=\"fw-semibold\">{{ label(svc) }}</td>\n                <td>\n                  <button class=\"btn btn-sm btn-outline-danger\"\n                    [buttonBusy]=\"isBusy('redis', svc)\"\n                    (click)=\"flushRedis(svc)\">Flush</button>\n                </td>\n                <td>\n                  <button class=\"btn btn-sm btn-outline-danger\"\n                    [disabled]=\"!hasMemcached(svc)\"\n                    [attr.title]=\"hasMemcached(svc) ? null : 'Memcached not available for this service yet'\"\n                    [buttonBusy]=\"isBusy('memcached', svc)\"\n                    (click)=\"flushMemcached(svc)\">Flush</button>\n                </td>\n                <td>\n                  <button class=\"btn btn-sm btn-outline-primary\"\n                    [buttonBusy]=\"isBusy('inspect', svc)\"\n                    (click)=\"inspect(svc)\">Inspect</button>\n                </td>\n                <td>\n                  @if (queueDashboardUrl(svc)) {\n                    <a class=\"btn btn-sm btn-outline-secondary\"\n                      rel=\"noopener noreferrer\"\n                      target=\"_blank\"\n                      [href]=\"queueDashboardUrl(svc)\">Open</a>\n                  } @else {\n                    <button class=\"btn btn-sm btn-outline-secondary\"\n                      disabled\n                      title=\"No queue dashboard for this service yet\">Open</button>\n                  }\n                </td>\n              </tr>\n            }\n          </tbody>\n        </table>\n      </div>\n    } @else {\n      <p class=\"text-muted px-4 py-4 mb-0\">No microservices are configured for this environment.</p>\n    }\n  </div>\n</div>\n\n@for (entry of inspectedData | keyvalue; track entry.key) {\n  <div class=\"card mt-3\">\n    <div class=\"card-content\">\n      <div class=\"card-header d-flex justify-content-between align-items-center\">\n        <h4 class=\"mb-0\">Connection pools \u2014 {{ entry.key.replace('_', '-') }}</h4>\n        <button class=\"btn btn-sm btn-outline-secondary\"\n          (click)=\"clearInspection({ name: entry.key, value: '' })\">Clear</button>\n      </div>\n      <div class=\"px-4 pb-4\">\n        <ngx-json-viewer [json]=\"entry.value\" [expanded]=\"true\" [depth]=\"2\"></ngx-json-viewer>\n      </div>\n    </div>\n  </div>\n}\n\n<!-- Sessions \u2014 auth, subscription-scoped -->\n<h3 class=\"mt-4\">Sessions</h3>\n<p class=\"text-muted mb-3\">Authentication controls for the current subscription.</p>\n<div class=\"card\">\n  <div class=\"card-content\">\n    <div class=\"card-header\">\n      <h4 class=\"mb-2\">Invalidate all sessions</h4>\n      <p class=\"text-muted small mb-0\">Force-logs out every user in this subscription. Requires password confirmation.</p>\n    </div>\n    <div class=\"card-footer px-3\">\n      <button class=\"btn btn-outline-danger\"\n        [buttonBusy]=\"sessionButtonBusy\"\n        (click)=\"openInvalidateAllSessionsModal()\">Invalidate All Sessions</button>\n    </div>\n  </div>\n</div>\n\n<pw-password-validation #passwordValidationModalForInvalidSession\n  (successEvent)=\"invalidateAllSessions()\">\n</pw-password-validation>\n", dependencies: [{ kind: "component", type: i11$1.NgxJsonViewerComponent, selector: "ngx-json-viewer", inputs: ["json", "expanded", "depth", "_currentDepth"] }, { kind: "component", type: i10$1.PasswordValidationComponent, selector: "pw-password-validation", inputs: ["confirmMessage", "destructive"], outputs: ["successEvent"] }, { kind: "directive", type: i11.ButtonBusyDirective, selector: "[buttonBusy]", inputs: ["buttonBusy", "busyText"] }, { kind: "pipe", type: i3.KeyValuePipe, name: "keyvalue" }] }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.6", ngImport: i0, type: GenericMiscComponent, decorators: [{
             type: Component,
@@ -3887,11 +3887,11 @@ class LoginNotificationsListComponent extends AppBaseComponent {
         super.ngOnDestroy();
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.6", ngImport: i0, type: LoginNotificationsListComponent, deps: [{ token: i0.Injector }, { token: i1.AdminService }, { token: i0.ChangeDetectorRef }], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.6", type: LoginNotificationsListComponent, isStandalone: false, selector: "pw-login-notifications-list", usesInheritance: true, ngImport: i0, template: "<div class=\"row\">\n  <div class=\"col-12 d-flex justify-content-between align-items-center text-end\">\n    <h2 class=\"card-title p-0 float-start\">Dashboard Notifications</h2>\n    <button class=\"btn btn-outline-primary btn-sm float-end m-0\"\n      [routerLink]=\"[routers.loginNotifications + 'add']\">\n      <i class=\"fa fa-plus-circle\" aria-hidden=\"true\"></i> Add Dashboard Notification\n    </button>\n  </div>\n  <div class=\"col-12 mb-3\">\n    <p>The <strong>Dashboard Notification</strong> module lets you create banner messages that appear at the top of every page.<br/>\n    Use these banners to communicate important updates \u2014 like <strong>new feature announcements</strong> or <strong>known issues</strong> \u2014 directly to your active users. </p>\n  </div>\n</div>\n@if (!isLoaded) {\n  <div class=\"w-100 text-center mt-3\"\n    >\n    <p-progressSpinner strokeWidth=\"2\"> </p-progressSpinner>\n  </div>\n}\n<div class=\"primeng-datatable-container actions-collapsed table-responsive mt-0\"\n  [class.hideTable]=\"data.unfiltered_count === 0\">\n  <p-table #tt\n    [value]=\"data.notifications\"\n    [paginator]=\"data.object_count !== 0\"\n    [rows]=\"PAGE_SIZE\"\n    [totalRecords]=\"data.object_count\"\n    [loading]=\"loading\"\n    [lazy]=\"true\"\n    [filterDelay]=\"1000\"\n    (onLazyLoad)=\"onLazyLoad($event)\"\n    [customSort]=\"true\">\n    <!--sort order should be default empty when page load-->\n\n    <!-- Caption Header, Search Bar -->\n    <ng-template pTemplate=\"caption\">\n      <div class=\"text-end\">\n        <p-iconfield iconPosition=\"left\">\n          <p-inputicon><i class=\"fa fa-search\" aria-hidden=\"true\"></i></p-inputicon>\n          <input type=\"text\"\n            id=\"login-notifications-list-search\"\n            name=\"login-notifications-list-search\"\n            pInputText\n            placeholder=\"Search\"\n            [(ngModel)]=\"searchText\"\n            (input)=\"onSearchChange($any($event.target).value)\" />\n        </p-iconfield>\n      </div>\n    </ng-template>\n\n    <!-- Column Header -->\n    <ng-template pTemplate=\"header\">\n      <tr>\n        <th scope=\"true\"\n          pSortableColumn=\"notification_type\">\n          {{ 'Admin.LoginNotification.NotificationType' | transloco }}\n          <p-sortIcon field=\"notification_type\"></p-sortIcon>\n        </th>\n        <th scope=\"true\"\n          pSortableColumn=\"body\">\n          {{ 'Admin.LoginNotification.Body' | transloco }}\n          <p-sortIcon field=\"body\"></p-sortIcon>\n        </th>\n        <th scope=\"true\">\n          {{ 'Admin.LoginNotification.IsPermanent' | transloco }}\n        </th>\n        <th scope=\"true\"\n          class=\"w-25\">\n          {{ 'Admin.LoginNotification.FeatureKeys' | transloco }}\n        </th>\n        <th scope=\"true\"\n          pSortableColumn=\"visible_from\">\n          {{ 'Admin.LoginNotification.VisibleFrom' | transloco }}\n          <p-sortIcon field=\"visible_from\"></p-sortIcon>\n        </th>\n        <th scope=\"true\"\n          pSortableColumn=\"visible_until\">\n          {{ 'Admin.LoginNotification.VisibleUntil' | transloco }}\n          <p-sortIcon field=\"visible_until\"></p-sortIcon>\n        </th>\n        <th class=\"actions-list-two\"\n        scope=\"true\">{{ 'Label.Actions' | transloco }}</th>\n      </tr>\n    </ng-template>\n\n    <!-- Table Body -->\n    <ng-template pTemplate=\"body\"\n      let-item>\n      <tr>\n        <td data-head=\"notification_type\">\n          @if (item?.notification_type) {\n            <span\n              class=\"badge\"\n              [ngClass]=\"'bg-' + item.notification_type\">\n              {{ item.notification_type }}\n            </span>\n          }\n        </td>\n        <td\n          data-head=\"body\"\n          >\n          <span [ngbTooltip]=\"item?.body\"\n            tooltipClass=\"custom-tooltip\"\n          placement=\"top\"  container=\"body\"> {{ item?.body | textTruncate: 30 }}</span>\n\n        </td>\n        <td data-head=\"Is Permanent\">\n          <span [appDynamicBadge]=\"{\n                              itemsArray: [true, false],\n                              item: item?.is_permanent\n                          }\"\n            color=\"success-danger\"\n          class=\"badge\">{{ item?.is_permanent ? 'Yes' : 'No' }}</span>\n        </td>\n        <td data-head=\"feature_keys\">\n          @for (data of item?.feature_keys.slice(0, 3); track data) {\n            <span\n              class=\"badge m-1\"\n              [appDynamicBadge]=\"{ itemsArray: item?.feature_keys, item: data }\"\n              [colorByName]=\"true\"\n              [dataName]=\"data\"\n            color=\"cyan\">{{ data }}</span>\n          }\n\n          @if (item.expanded) {\n            <span>\n              @for (data of item?.feature_keys.slice(3); track data) {\n                <span\n                  class=\"badge m-1\"\n                  [appDynamicBadge]=\"{ itemsArray: item?.feature_keys, item: data }\"\n                  [colorByName]=\"true\"\n                  [dataName]=\"data\"\n                color=\"cyan\">{{ data }}</span>\n              }\n            </span>\n          }\n\n          @if (item?.feature_keys.length > 3) {\n            <span class=\"fw-bold\">\n              <a (click)=\"item.expanded = !item.expanded\">\n                <span>...</span>\n              </a>\n            </span>\n          }\n\n        </td>\n        <td\n          data-head=\"visible_from\"\n          [ngClass]=\"{ 'text-success fw-bold': isDateInPast(item?.visible_from) }\"\n          >\n          {{ item?.visible_from | dateFormat }}\n        </td>\n        <td\n          data-head=\"visible_until\"\n          [ngClass]=\"{ 'text-success fw-bold': isDateInFuture(item?.visible_until) }\"\n          >\n          {{ item?.visible_until | dateFormat }}\n        </td>\n        <td data-head=\"Action\">\n          <ul class=\"list-unstyled list-inline list-action\">\n            <li ngbTooltip=\"Edit\"\n              [routerLink]=\"[routers.loginNotifications + item?.id]\"\n              class=\"me-2 me-sm-3\">\n              <i class=\"fa fa-edit edit-icon\" aria-hidden=\"true\"></i>\n            </li>\n            <li ngbTooltip=\"Delete\"\n              class=\"me-2 me-sm-3\"\n              (keydown.enter)=\"onDelete(item?.id)\"\n              (click)=\"onDelete(item?.id)\">\n              <i class=\"fa fa-trash delete-icon\" aria-hidden=\"true\"></i>\n            </li>\n          </ul>\n        </td>\n      </tr>\n    </ng-template>\n  </p-table>\n  @if (data.object_count === 0 && data.unfiltered_count !== 0) {\n    <div>\n      <pw-no-data [withImage]=\"true\" [message]=\"'Search.NoDataMessage' | transloco\" [description]=\"'Search.NoDataDescription' | transloco\" >\n      </pw-no-data>\n    </div>\n  }\n  @if (data.object_count !== 0) {\n    <pw-records-summary [showing]=\"tt?.value?.length ?? 0\" [total]=\"data.object_count\" />\n  }\n</div>\n@if (data.unfiltered_count === 0 && isLoaded) {\n  <div>\n    <pw-no-data [withImage]=\"true\" [message]=\"'Admin.LoginNotification.NoDataMessage' | transloco\"> </pw-no-data>\n  </div>\n}\n", dependencies: [{ kind: "component", type: i2.Table, selector: "p-table", inputs: ["frozenColumns", "frozenValue", "styleClass", "tableStyle", "tableStyleClass", "paginator", "pageLinks", "rowsPerPageOptions", "alwaysShowPaginator", "paginatorPosition", "paginatorStyleClass", "paginatorDropdownAppendTo", "paginatorDropdownScrollHeight", "currentPageReportTemplate", "showCurrentPageReport", "showJumpToPageDropdown", "showJumpToPageInput", "showFirstLastIcon", "showPageLinks", "defaultSortOrder", "sortMode", "resetPageOnSort", "selectionMode", "selectionPageOnly", "contextMenuSelection", "contextMenuSelectionMode", "dataKey", "metaKeySelection", "rowSelectable", "rowTrackBy", "lazy", "lazyLoadOnInit", "compareSelectionBy", "csvSeparator", "exportFilename", "filters", "globalFilterFields", "filterDelay", "filterLocale", "expandedRowKeys", "editingRowKeys", "rowExpandMode", "scrollable", "rowGroupMode", "scrollHeight", "virtualScroll", "virtualScrollItemSize", "virtualScrollOptions", "virtualScrollDelay", "frozenWidth", "contextMenu", "resizableColumns", "columnResizeMode", "reorderableColumns", "loading", "loadingIcon", "showLoader", "rowHover", "customSort", "showInitialSortBadge", "exportFunction", "exportHeader", "stateKey", "stateStorage", "editMode", "groupRowsBy", "size", "showGridlines", "stripedRows", "groupRowsByOrder", "responsiveLayout", "breakpoint", "paginatorLocale", "value", "columns", "first", "rows", "totalRecords", "sortField", "sortOrder", "multiSortMeta", "selection", "selectAll"], outputs: ["contextMenuSelectionChange", "selectAllChange", "selectionChange", "onRowSelect", "onRowUnselect", "onPage", "onSort", "onFilter", "onLazyLoad", "onRowExpand", "onRowCollapse", "onContextMenuSelect", "onColResize", "onColReorder", "onRowReorder", "onEditInit", "onEditComplete", "onEditCancel", "onHeaderCheckboxToggle", "sortFunction", "firstChange", "rowsChange", "onStateSave", "onStateRestore"] }, { kind: "directive", type: i3$1.PrimeTemplate, selector: "[pTemplate]", inputs: ["type", "pTemplate"] }, { kind: "directive", type: i2.SortableColumn, selector: "[pSortableColumn]", inputs: ["pSortableColumn", "pSortableColumnDisabled"] }, { kind: "component", type: i2.SortIcon, selector: "p-sortIcon", inputs: ["field"] }, { kind: "directive", type: i4$1.InputText, selector: "[pInputText]", inputs: ["hostName", "ptInputText", "pInputTextPT", "pInputTextUnstyled", "pSize", "variant", "fluid", "invalid"] }, { kind: "component", type: i5$1.IconField, selector: "p-iconfield, p-iconField, p-icon-field", inputs: ["hostName", "iconPosition", "styleClass"] }, { kind: "component", type: i6.InputIcon, selector: "p-inputicon, p-inputIcon", inputs: ["hostName", "styleClass"] }, { kind: "directive", type: i2$1.NgbTooltip, selector: "[ngbTooltip]", inputs: ["animation", "autoClose", "placement", "popperOptions", "triggers", "positionTarget", "container", "disableTooltip", "tooltipClass", "tooltipContext", "openDelay", "closeDelay", "ngbTooltip"], outputs: ["shown", "hidden"], exportAs: ["ngbTooltip"] }, { kind: "directive", type: i3.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i9.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { kind: "directive", type: i9.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i9.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "component", type: i4.ProgressSpinner, selector: "p-progressSpinner, p-progress-spinner, p-progressspinner", inputs: ["styleClass", "strokeWidth", "fill", "animationDuration", "ariaLabel"] }, { kind: "component", type: i10$1.NoDataComponent, selector: "pw-no-data", inputs: ["message", "description", "withImage"] }, { kind: "component", type: i10$1.RecordsSummaryComponent, selector: "pw-records-summary", inputs: ["showing", "total"] }, { kind: "directive", type: i11.DynamicBadgeDirective, selector: "[appDynamicBadge]", inputs: ["appDynamicBadge", "color", "colorByName", "dataName"] }, { kind: "directive", type: i12.RouterLink, selector: "[routerLink]", inputs: ["target", "queryParams", "fragment", "queryParamsHandling", "state", "info", "relativeTo", "preserveFragment", "skipLocationChange", "replaceUrl", "routerLink"] }, { kind: "pipe", type: i13.TranslocoPipe, name: "transloco" }, { kind: "pipe", type: i17.DateFormatPipe, name: "dateFormat" }, { kind: "pipe", type: i17.TextTruncatePipe, name: "textTruncate" }] }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.6", type: LoginNotificationsListComponent, isStandalone: false, selector: "pw-login-notifications-list", usesInheritance: true, ngImport: i0, template: "<div class=\"row\">\n  <div class=\"col-12 d-flex justify-content-between align-items-center text-end\">\n    <h2 class=\"card-title p-0 float-start\">Dashboard Notifications</h2>\n    <button class=\"btn btn-outline-primary btn-sm float-end m-0\"\n      [routerLink]=\"[routers.loginNotifications + 'add']\">\n      <i class=\"fa fa-plus-circle\" aria-hidden=\"true\"></i> Add Dashboard Notification\n    </button>\n  </div>\n  <div class=\"col-12 mb-3\">\n    <p>The <strong>Dashboard Notification</strong> module lets you create banner messages that appear at the top of every page.<br/>\n    Use these banners to communicate important updates \u2014 like <strong>new feature announcements</strong> or <strong>known issues</strong> \u2014 directly to your active users. </p>\n  </div>\n</div>\n@if (!isLoaded) {\n  <div class=\"w-100 text-center mt-3\"\n    >\n    <p-progressSpinner strokeWidth=\"2\"> </p-progressSpinner>\n  </div>\n}\n<div class=\"primeng-datatable-container actions-collapsed table-responsive mt-0\"\n  [class.hideTable]=\"data.unfiltered_count === 0\">\n  <p-table #tt\n    [value]=\"data.notifications\"\n    [paginator]=\"data.object_count !== 0\"\n    [rows]=\"PAGE_SIZE\"\n    [totalRecords]=\"data.object_count\"\n    [loading]=\"loading\"\n    [lazy]=\"true\"\n    [filterDelay]=\"1000\"\n    (onLazyLoad)=\"onLazyLoad($event)\"\n    [customSort]=\"true\">\n    <!--sort order should be default empty when page load-->\n\n    <!-- Caption Header, Search Bar -->\n    <ng-template pTemplate=\"caption\">\n      <div class=\"text-end\">\n        <p-iconfield iconPosition=\"left\">\n          <p-inputicon><i class=\"fa fa-search\" aria-hidden=\"true\"></i></p-inputicon>\n          <input type=\"text\"\n            id=\"login-notifications-list-search\"\n            name=\"login-notifications-list-search\"\n            pInputText\n            placeholder=\"Search\"\n            [(ngModel)]=\"searchText\"\n            (input)=\"onSearchChange($any($event.target).value)\" />\n        </p-iconfield>\n      </div>\n    </ng-template>\n\n    <!-- Column Header -->\n    <ng-template pTemplate=\"header\">\n      <tr>\n        <th scope=\"true\"\n          pSortableColumn=\"notification_type\">\n          {{ 'Admin.LoginNotification.NotificationType' | transloco }}\n          <p-sortIcon field=\"notification_type\"></p-sortIcon>\n        </th>\n        <th scope=\"true\"\n          pSortableColumn=\"body\">\n          {{ 'Admin.LoginNotification.Body' | transloco }}\n          <p-sortIcon field=\"body\"></p-sortIcon>\n        </th>\n        <th scope=\"true\">\n          {{ 'Admin.LoginNotification.IsPermanent' | transloco }}\n        </th>\n        <th scope=\"true\"\n          class=\"w-25\">\n          {{ 'Admin.LoginNotification.FeatureKeys' | transloco }}\n        </th>\n        <th scope=\"true\"\n          pSortableColumn=\"visible_from\">\n          {{ 'Admin.LoginNotification.VisibleFrom' | transloco }}\n          <p-sortIcon field=\"visible_from\"></p-sortIcon>\n        </th>\n        <th scope=\"true\"\n          pSortableColumn=\"visible_until\">\n          {{ 'Admin.LoginNotification.VisibleUntil' | transloco }}\n          <p-sortIcon field=\"visible_until\"></p-sortIcon>\n        </th>\n        <th class=\"actions-list-two\"\n        scope=\"true\">{{ 'Label.Actions' | transloco }}</th>\n      </tr>\n    </ng-template>\n\n    <!-- Table Body -->\n    <ng-template pTemplate=\"body\"\n      let-item>\n      <tr>\n        <td data-head=\"notification_type\">\n          @if (item?.notification_type) {\n            <span\n              class=\"badge\"\n              [ngClass]=\"'bg-' + item.notification_type\">\n              {{ item.notification_type }}\n            </span>\n          }\n        </td>\n        <td\n          data-head=\"body\"\n          >\n          <span [ngbTooltip]=\"item?.body\"\n            tooltipClass=\"custom-tooltip\"\n          placement=\"top\"  container=\"body\"> {{ item?.body | textTruncate: 30 }}</span>\n\n        </td>\n        <td data-head=\"Is Permanent\">\n          <span [appDynamicBadge]=\"{\n                              itemsArray: [true, false],\n                              item: item?.is_permanent\n                          }\"\n            color=\"success-danger\"\n          class=\"badge\">{{ item?.is_permanent ? 'Yes' : 'No' }}</span>\n        </td>\n        <td data-head=\"feature_keys\">\n          @for (data of item?.feature_keys.slice(0, 3); track data) {\n            <span\n              class=\"badge m-1\"\n              [appDynamicBadge]=\"{ itemsArray: item?.feature_keys, item: data }\"\n              [colorByName]=\"true\"\n              [dataName]=\"data\"\n            color=\"cyan\">{{ data }}</span>\n          }\n\n          @if (item.expanded) {\n            <span>\n              @for (data of item?.feature_keys.slice(3); track data) {\n                <span\n                  class=\"badge m-1\"\n                  [appDynamicBadge]=\"{ itemsArray: item?.feature_keys, item: data }\"\n                  [colorByName]=\"true\"\n                  [dataName]=\"data\"\n                color=\"cyan\">{{ data }}</span>\n              }\n            </span>\n          }\n\n          @if (item?.feature_keys.length > 3) {\n            <span class=\"fw-bold\">\n              <a (click)=\"item.expanded = !item.expanded\">\n                <span>...</span>\n              </a>\n            </span>\n          }\n\n        </td>\n        <td\n          data-head=\"visible_from\"\n          [ngClass]=\"{ 'text-success-muted fw-bold': isDateInPast(item?.visible_from) }\"\n          >\n          {{ item?.visible_from | dateFormat }}\n        </td>\n        <td\n          data-head=\"visible_until\"\n          [ngClass]=\"{ 'text-success-muted fw-bold': isDateInFuture(item?.visible_until) }\"\n          >\n          {{ item?.visible_until | dateFormat }}\n        </td>\n        <td data-head=\"Action\">\n          <ul class=\"list-unstyled list-inline list-action\">\n            <li ngbTooltip=\"Edit\"\n              [routerLink]=\"[routers.loginNotifications + item?.id]\"\n              class=\"me-2 me-sm-3\">\n              <i class=\"fa fa-edit edit-icon\" aria-hidden=\"true\"></i>\n            </li>\n            <li ngbTooltip=\"Delete\"\n              class=\"me-2 me-sm-3\"\n              (keydown.enter)=\"onDelete(item?.id)\"\n              (click)=\"onDelete(item?.id)\">\n              <i class=\"fa fa-trash delete-icon\" aria-hidden=\"true\"></i>\n            </li>\n          </ul>\n        </td>\n      </tr>\n    </ng-template>\n  </p-table>\n  @if (data.object_count === 0 && data.unfiltered_count !== 0) {\n    <div>\n      <pw-no-data [withImage]=\"true\" [message]=\"'Search.NoDataMessage' | transloco\" [description]=\"'Search.NoDataDescription' | transloco\" >\n      </pw-no-data>\n    </div>\n  }\n  @if (data.object_count !== 0) {\n    <pw-records-summary [showing]=\"tt?.value?.length ?? 0\" [total]=\"data.object_count\" />\n  }\n</div>\n@if (data.unfiltered_count === 0 && isLoaded) {\n  <div>\n    <pw-no-data [withImage]=\"true\" [message]=\"'Admin.LoginNotification.NoDataMessage' | transloco\"> </pw-no-data>\n  </div>\n}\n", dependencies: [{ kind: "component", type: i2.Table, selector: "p-table", inputs: ["frozenColumns", "frozenValue", "styleClass", "tableStyle", "tableStyleClass", "paginator", "pageLinks", "rowsPerPageOptions", "alwaysShowPaginator", "paginatorPosition", "paginatorStyleClass", "paginatorDropdownAppendTo", "paginatorDropdownScrollHeight", "currentPageReportTemplate", "showCurrentPageReport", "showJumpToPageDropdown", "showJumpToPageInput", "showFirstLastIcon", "showPageLinks", "defaultSortOrder", "sortMode", "resetPageOnSort", "selectionMode", "selectionPageOnly", "contextMenuSelection", "contextMenuSelectionMode", "dataKey", "metaKeySelection", "rowSelectable", "rowTrackBy", "lazy", "lazyLoadOnInit", "compareSelectionBy", "csvSeparator", "exportFilename", "filters", "globalFilterFields", "filterDelay", "filterLocale", "expandedRowKeys", "editingRowKeys", "rowExpandMode", "scrollable", "rowGroupMode", "scrollHeight", "virtualScroll", "virtualScrollItemSize", "virtualScrollOptions", "virtualScrollDelay", "frozenWidth", "contextMenu", "resizableColumns", "columnResizeMode", "reorderableColumns", "loading", "loadingIcon", "showLoader", "rowHover", "customSort", "showInitialSortBadge", "exportFunction", "exportHeader", "stateKey", "stateStorage", "editMode", "groupRowsBy", "size", "showGridlines", "stripedRows", "groupRowsByOrder", "responsiveLayout", "breakpoint", "paginatorLocale", "value", "columns", "first", "rows", "totalRecords", "sortField", "sortOrder", "multiSortMeta", "selection", "selectAll"], outputs: ["contextMenuSelectionChange", "selectAllChange", "selectionChange", "onRowSelect", "onRowUnselect", "onPage", "onSort", "onFilter", "onLazyLoad", "onRowExpand", "onRowCollapse", "onContextMenuSelect", "onColResize", "onColReorder", "onRowReorder", "onEditInit", "onEditComplete", "onEditCancel", "onHeaderCheckboxToggle", "sortFunction", "firstChange", "rowsChange", "onStateSave", "onStateRestore"] }, { kind: "directive", type: i3$1.PrimeTemplate, selector: "[pTemplate]", inputs: ["type", "pTemplate"] }, { kind: "directive", type: i2.SortableColumn, selector: "[pSortableColumn]", inputs: ["pSortableColumn", "pSortableColumnDisabled"] }, { kind: "component", type: i2.SortIcon, selector: "p-sortIcon", inputs: ["field"] }, { kind: "directive", type: i4$1.InputText, selector: "[pInputText]", inputs: ["hostName", "ptInputText", "pInputTextPT", "pInputTextUnstyled", "pSize", "variant", "fluid", "invalid"] }, { kind: "component", type: i5$1.IconField, selector: "p-iconfield, p-iconField, p-icon-field", inputs: ["hostName", "iconPosition", "styleClass"] }, { kind: "component", type: i6.InputIcon, selector: "p-inputicon, p-inputIcon", inputs: ["hostName", "styleClass"] }, { kind: "directive", type: i2$1.NgbTooltip, selector: "[ngbTooltip]", inputs: ["animation", "autoClose", "placement", "popperOptions", "triggers", "positionTarget", "container", "disableTooltip", "tooltipClass", "tooltipContext", "openDelay", "closeDelay", "ngbTooltip"], outputs: ["shown", "hidden"], exportAs: ["ngbTooltip"] }, { kind: "directive", type: i3.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i9.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { kind: "directive", type: i9.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i9.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "component", type: i4.ProgressSpinner, selector: "p-progressSpinner, p-progress-spinner, p-progressspinner", inputs: ["styleClass", "strokeWidth", "fill", "animationDuration", "ariaLabel"] }, { kind: "component", type: i10$1.NoDataComponent, selector: "pw-no-data", inputs: ["message", "description", "withImage"] }, { kind: "component", type: i10$1.RecordsSummaryComponent, selector: "pw-records-summary", inputs: ["showing", "total"] }, { kind: "directive", type: i11.DynamicBadgeDirective, selector: "[appDynamicBadge]", inputs: ["appDynamicBadge", "color", "colorByName", "dataName"] }, { kind: "directive", type: i12.RouterLink, selector: "[routerLink]", inputs: ["target", "queryParams", "fragment", "queryParamsHandling", "state", "info", "relativeTo", "preserveFragment", "skipLocationChange", "replaceUrl", "routerLink"] }, { kind: "pipe", type: i13.TranslocoPipe, name: "transloco" }, { kind: "pipe", type: i17.DateFormatPipe, name: "dateFormat" }, { kind: "pipe", type: i17.TextTruncatePipe, name: "textTruncate" }] }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.6", ngImport: i0, type: LoginNotificationsListComponent, decorators: [{
             type: Component,
-            args: [{ selector: 'pw-login-notifications-list', standalone: false, template: "<div class=\"row\">\n  <div class=\"col-12 d-flex justify-content-between align-items-center text-end\">\n    <h2 class=\"card-title p-0 float-start\">Dashboard Notifications</h2>\n    <button class=\"btn btn-outline-primary btn-sm float-end m-0\"\n      [routerLink]=\"[routers.loginNotifications + 'add']\">\n      <i class=\"fa fa-plus-circle\" aria-hidden=\"true\"></i> Add Dashboard Notification\n    </button>\n  </div>\n  <div class=\"col-12 mb-3\">\n    <p>The <strong>Dashboard Notification</strong> module lets you create banner messages that appear at the top of every page.<br/>\n    Use these banners to communicate important updates \u2014 like <strong>new feature announcements</strong> or <strong>known issues</strong> \u2014 directly to your active users. </p>\n  </div>\n</div>\n@if (!isLoaded) {\n  <div class=\"w-100 text-center mt-3\"\n    >\n    <p-progressSpinner strokeWidth=\"2\"> </p-progressSpinner>\n  </div>\n}\n<div class=\"primeng-datatable-container actions-collapsed table-responsive mt-0\"\n  [class.hideTable]=\"data.unfiltered_count === 0\">\n  <p-table #tt\n    [value]=\"data.notifications\"\n    [paginator]=\"data.object_count !== 0\"\n    [rows]=\"PAGE_SIZE\"\n    [totalRecords]=\"data.object_count\"\n    [loading]=\"loading\"\n    [lazy]=\"true\"\n    [filterDelay]=\"1000\"\n    (onLazyLoad)=\"onLazyLoad($event)\"\n    [customSort]=\"true\">\n    <!--sort order should be default empty when page load-->\n\n    <!-- Caption Header, Search Bar -->\n    <ng-template pTemplate=\"caption\">\n      <div class=\"text-end\">\n        <p-iconfield iconPosition=\"left\">\n          <p-inputicon><i class=\"fa fa-search\" aria-hidden=\"true\"></i></p-inputicon>\n          <input type=\"text\"\n            id=\"login-notifications-list-search\"\n            name=\"login-notifications-list-search\"\n            pInputText\n            placeholder=\"Search\"\n            [(ngModel)]=\"searchText\"\n            (input)=\"onSearchChange($any($event.target).value)\" />\n        </p-iconfield>\n      </div>\n    </ng-template>\n\n    <!-- Column Header -->\n    <ng-template pTemplate=\"header\">\n      <tr>\n        <th scope=\"true\"\n          pSortableColumn=\"notification_type\">\n          {{ 'Admin.LoginNotification.NotificationType' | transloco }}\n          <p-sortIcon field=\"notification_type\"></p-sortIcon>\n        </th>\n        <th scope=\"true\"\n          pSortableColumn=\"body\">\n          {{ 'Admin.LoginNotification.Body' | transloco }}\n          <p-sortIcon field=\"body\"></p-sortIcon>\n        </th>\n        <th scope=\"true\">\n          {{ 'Admin.LoginNotification.IsPermanent' | transloco }}\n        </th>\n        <th scope=\"true\"\n          class=\"w-25\">\n          {{ 'Admin.LoginNotification.FeatureKeys' | transloco }}\n        </th>\n        <th scope=\"true\"\n          pSortableColumn=\"visible_from\">\n          {{ 'Admin.LoginNotification.VisibleFrom' | transloco }}\n          <p-sortIcon field=\"visible_from\"></p-sortIcon>\n        </th>\n        <th scope=\"true\"\n          pSortableColumn=\"visible_until\">\n          {{ 'Admin.LoginNotification.VisibleUntil' | transloco }}\n          <p-sortIcon field=\"visible_until\"></p-sortIcon>\n        </th>\n        <th class=\"actions-list-two\"\n        scope=\"true\">{{ 'Label.Actions' | transloco }}</th>\n      </tr>\n    </ng-template>\n\n    <!-- Table Body -->\n    <ng-template pTemplate=\"body\"\n      let-item>\n      <tr>\n        <td data-head=\"notification_type\">\n          @if (item?.notification_type) {\n            <span\n              class=\"badge\"\n              [ngClass]=\"'bg-' + item.notification_type\">\n              {{ item.notification_type }}\n            </span>\n          }\n        </td>\n        <td\n          data-head=\"body\"\n          >\n          <span [ngbTooltip]=\"item?.body\"\n            tooltipClass=\"custom-tooltip\"\n          placement=\"top\"  container=\"body\"> {{ item?.body | textTruncate: 30 }}</span>\n\n        </td>\n        <td data-head=\"Is Permanent\">\n          <span [appDynamicBadge]=\"{\n                              itemsArray: [true, false],\n                              item: item?.is_permanent\n                          }\"\n            color=\"success-danger\"\n          class=\"badge\">{{ item?.is_permanent ? 'Yes' : 'No' }}</span>\n        </td>\n        <td data-head=\"feature_keys\">\n          @for (data of item?.feature_keys.slice(0, 3); track data) {\n            <span\n              class=\"badge m-1\"\n              [appDynamicBadge]=\"{ itemsArray: item?.feature_keys, item: data }\"\n              [colorByName]=\"true\"\n              [dataName]=\"data\"\n            color=\"cyan\">{{ data }}</span>\n          }\n\n          @if (item.expanded) {\n            <span>\n              @for (data of item?.feature_keys.slice(3); track data) {\n                <span\n                  class=\"badge m-1\"\n                  [appDynamicBadge]=\"{ itemsArray: item?.feature_keys, item: data }\"\n                  [colorByName]=\"true\"\n                  [dataName]=\"data\"\n                color=\"cyan\">{{ data }}</span>\n              }\n            </span>\n          }\n\n          @if (item?.feature_keys.length > 3) {\n            <span class=\"fw-bold\">\n              <a (click)=\"item.expanded = !item.expanded\">\n                <span>...</span>\n              </a>\n            </span>\n          }\n\n        </td>\n        <td\n          data-head=\"visible_from\"\n          [ngClass]=\"{ 'text-success fw-bold': isDateInPast(item?.visible_from) }\"\n          >\n          {{ item?.visible_from | dateFormat }}\n        </td>\n        <td\n          data-head=\"visible_until\"\n          [ngClass]=\"{ 'text-success fw-bold': isDateInFuture(item?.visible_until) }\"\n          >\n          {{ item?.visible_until | dateFormat }}\n        </td>\n        <td data-head=\"Action\">\n          <ul class=\"list-unstyled list-inline list-action\">\n            <li ngbTooltip=\"Edit\"\n              [routerLink]=\"[routers.loginNotifications + item?.id]\"\n              class=\"me-2 me-sm-3\">\n              <i class=\"fa fa-edit edit-icon\" aria-hidden=\"true\"></i>\n            </li>\n            <li ngbTooltip=\"Delete\"\n              class=\"me-2 me-sm-3\"\n              (keydown.enter)=\"onDelete(item?.id)\"\n              (click)=\"onDelete(item?.id)\">\n              <i class=\"fa fa-trash delete-icon\" aria-hidden=\"true\"></i>\n            </li>\n          </ul>\n        </td>\n      </tr>\n    </ng-template>\n  </p-table>\n  @if (data.object_count === 0 && data.unfiltered_count !== 0) {\n    <div>\n      <pw-no-data [withImage]=\"true\" [message]=\"'Search.NoDataMessage' | transloco\" [description]=\"'Search.NoDataDescription' | transloco\" >\n      </pw-no-data>\n    </div>\n  }\n  @if (data.object_count !== 0) {\n    <pw-records-summary [showing]=\"tt?.value?.length ?? 0\" [total]=\"data.object_count\" />\n  }\n</div>\n@if (data.unfiltered_count === 0 && isLoaded) {\n  <div>\n    <pw-no-data [withImage]=\"true\" [message]=\"'Admin.LoginNotification.NoDataMessage' | transloco\"> </pw-no-data>\n  </div>\n}\n" }]
+            args: [{ selector: 'pw-login-notifications-list', standalone: false, template: "<div class=\"row\">\n  <div class=\"col-12 d-flex justify-content-between align-items-center text-end\">\n    <h2 class=\"card-title p-0 float-start\">Dashboard Notifications</h2>\n    <button class=\"btn btn-outline-primary btn-sm float-end m-0\"\n      [routerLink]=\"[routers.loginNotifications + 'add']\">\n      <i class=\"fa fa-plus-circle\" aria-hidden=\"true\"></i> Add Dashboard Notification\n    </button>\n  </div>\n  <div class=\"col-12 mb-3\">\n    <p>The <strong>Dashboard Notification</strong> module lets you create banner messages that appear at the top of every page.<br/>\n    Use these banners to communicate important updates \u2014 like <strong>new feature announcements</strong> or <strong>known issues</strong> \u2014 directly to your active users. </p>\n  </div>\n</div>\n@if (!isLoaded) {\n  <div class=\"w-100 text-center mt-3\"\n    >\n    <p-progressSpinner strokeWidth=\"2\"> </p-progressSpinner>\n  </div>\n}\n<div class=\"primeng-datatable-container actions-collapsed table-responsive mt-0\"\n  [class.hideTable]=\"data.unfiltered_count === 0\">\n  <p-table #tt\n    [value]=\"data.notifications\"\n    [paginator]=\"data.object_count !== 0\"\n    [rows]=\"PAGE_SIZE\"\n    [totalRecords]=\"data.object_count\"\n    [loading]=\"loading\"\n    [lazy]=\"true\"\n    [filterDelay]=\"1000\"\n    (onLazyLoad)=\"onLazyLoad($event)\"\n    [customSort]=\"true\">\n    <!--sort order should be default empty when page load-->\n\n    <!-- Caption Header, Search Bar -->\n    <ng-template pTemplate=\"caption\">\n      <div class=\"text-end\">\n        <p-iconfield iconPosition=\"left\">\n          <p-inputicon><i class=\"fa fa-search\" aria-hidden=\"true\"></i></p-inputicon>\n          <input type=\"text\"\n            id=\"login-notifications-list-search\"\n            name=\"login-notifications-list-search\"\n            pInputText\n            placeholder=\"Search\"\n            [(ngModel)]=\"searchText\"\n            (input)=\"onSearchChange($any($event.target).value)\" />\n        </p-iconfield>\n      </div>\n    </ng-template>\n\n    <!-- Column Header -->\n    <ng-template pTemplate=\"header\">\n      <tr>\n        <th scope=\"true\"\n          pSortableColumn=\"notification_type\">\n          {{ 'Admin.LoginNotification.NotificationType' | transloco }}\n          <p-sortIcon field=\"notification_type\"></p-sortIcon>\n        </th>\n        <th scope=\"true\"\n          pSortableColumn=\"body\">\n          {{ 'Admin.LoginNotification.Body' | transloco }}\n          <p-sortIcon field=\"body\"></p-sortIcon>\n        </th>\n        <th scope=\"true\">\n          {{ 'Admin.LoginNotification.IsPermanent' | transloco }}\n        </th>\n        <th scope=\"true\"\n          class=\"w-25\">\n          {{ 'Admin.LoginNotification.FeatureKeys' | transloco }}\n        </th>\n        <th scope=\"true\"\n          pSortableColumn=\"visible_from\">\n          {{ 'Admin.LoginNotification.VisibleFrom' | transloco }}\n          <p-sortIcon field=\"visible_from\"></p-sortIcon>\n        </th>\n        <th scope=\"true\"\n          pSortableColumn=\"visible_until\">\n          {{ 'Admin.LoginNotification.VisibleUntil' | transloco }}\n          <p-sortIcon field=\"visible_until\"></p-sortIcon>\n        </th>\n        <th class=\"actions-list-two\"\n        scope=\"true\">{{ 'Label.Actions' | transloco }}</th>\n      </tr>\n    </ng-template>\n\n    <!-- Table Body -->\n    <ng-template pTemplate=\"body\"\n      let-item>\n      <tr>\n        <td data-head=\"notification_type\">\n          @if (item?.notification_type) {\n            <span\n              class=\"badge\"\n              [ngClass]=\"'bg-' + item.notification_type\">\n              {{ item.notification_type }}\n            </span>\n          }\n        </td>\n        <td\n          data-head=\"body\"\n          >\n          <span [ngbTooltip]=\"item?.body\"\n            tooltipClass=\"custom-tooltip\"\n          placement=\"top\"  container=\"body\"> {{ item?.body | textTruncate: 30 }}</span>\n\n        </td>\n        <td data-head=\"Is Permanent\">\n          <span [appDynamicBadge]=\"{\n                              itemsArray: [true, false],\n                              item: item?.is_permanent\n                          }\"\n            color=\"success-danger\"\n          class=\"badge\">{{ item?.is_permanent ? 'Yes' : 'No' }}</span>\n        </td>\n        <td data-head=\"feature_keys\">\n          @for (data of item?.feature_keys.slice(0, 3); track data) {\n            <span\n              class=\"badge m-1\"\n              [appDynamicBadge]=\"{ itemsArray: item?.feature_keys, item: data }\"\n              [colorByName]=\"true\"\n              [dataName]=\"data\"\n            color=\"cyan\">{{ data }}</span>\n          }\n\n          @if (item.expanded) {\n            <span>\n              @for (data of item?.feature_keys.slice(3); track data) {\n                <span\n                  class=\"badge m-1\"\n                  [appDynamicBadge]=\"{ itemsArray: item?.feature_keys, item: data }\"\n                  [colorByName]=\"true\"\n                  [dataName]=\"data\"\n                color=\"cyan\">{{ data }}</span>\n              }\n            </span>\n          }\n\n          @if (item?.feature_keys.length > 3) {\n            <span class=\"fw-bold\">\n              <a (click)=\"item.expanded = !item.expanded\">\n                <span>...</span>\n              </a>\n            </span>\n          }\n\n        </td>\n        <td\n          data-head=\"visible_from\"\n          [ngClass]=\"{ 'text-success-muted fw-bold': isDateInPast(item?.visible_from) }\"\n          >\n          {{ item?.visible_from | dateFormat }}\n        </td>\n        <td\n          data-head=\"visible_until\"\n          [ngClass]=\"{ 'text-success-muted fw-bold': isDateInFuture(item?.visible_until) }\"\n          >\n          {{ item?.visible_until | dateFormat }}\n        </td>\n        <td data-head=\"Action\">\n          <ul class=\"list-unstyled list-inline list-action\">\n            <li ngbTooltip=\"Edit\"\n              [routerLink]=\"[routers.loginNotifications + item?.id]\"\n              class=\"me-2 me-sm-3\">\n              <i class=\"fa fa-edit edit-icon\" aria-hidden=\"true\"></i>\n            </li>\n            <li ngbTooltip=\"Delete\"\n              class=\"me-2 me-sm-3\"\n              (keydown.enter)=\"onDelete(item?.id)\"\n              (click)=\"onDelete(item?.id)\">\n              <i class=\"fa fa-trash delete-icon\" aria-hidden=\"true\"></i>\n            </li>\n          </ul>\n        </td>\n      </tr>\n    </ng-template>\n  </p-table>\n  @if (data.object_count === 0 && data.unfiltered_count !== 0) {\n    <div>\n      <pw-no-data [withImage]=\"true\" [message]=\"'Search.NoDataMessage' | transloco\" [description]=\"'Search.NoDataDescription' | transloco\" >\n      </pw-no-data>\n    </div>\n  }\n  @if (data.object_count !== 0) {\n    <pw-records-summary [showing]=\"tt?.value?.length ?? 0\" [total]=\"data.object_count\" />\n  }\n</div>\n@if (data.unfiltered_count === 0 && isLoaded) {\n  <div>\n    <pw-no-data [withImage]=\"true\" [message]=\"'Admin.LoginNotification.NoDataMessage' | transloco\"> </pw-no-data>\n  </div>\n}\n" }]
         }], ctorParameters: () => [{ type: i0.Injector }, { type: i1.AdminService }, { type: i0.ChangeDetectorRef }] });
 
 class MailerDetailsComponent extends AppBaseComponent {
@@ -4690,7 +4690,7 @@ class NewslettersItemsComponent extends AppBaseComponent {
         }
     }
     getSendUntilColor(val) {
-        return { 'text-success fw-bold': val && new Date(val) > new Date() };
+        return { 'text-success-muted fw-bold': val && new Date(val) > new Date() };
     }
     ngOnDestroy() {
         super.ngOnDestroy();
@@ -5796,11 +5796,11 @@ class ProductsListComponent extends AppBaseComponent {
         super.ngOnDestroy();
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.6", ngImport: i0, type: ProductsListComponent, deps: [{ token: i1$1.ProductService }, { token: i1$1.AuthService }, { token: i0.Injector }, { token: i0.ChangeDetectorRef }], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.6", type: ProductsListComponent, isStandalone: false, selector: "pw-admin-products-list", viewQueries: [{ propertyName: "passwordValidationModalForProductDelete", first: true, predicate: ["passwordValidationModalForProductDelete"], descendants: true }], usesInheritance: true, ngImport: i0, template: "<div class=\"col-xs-12 text-end d-flex justify-content-between align-items-center\">\n  <h2 class=\"card-title p-0 float-start\">Products</h2>\n  <button *rbacAllow=\"'Pages.Admin.Product.Create'\"\n    class=\"btn btn-sm btn-outline-primary\"\n    [routerLink]=\"[routers.productDetails + 'add']\">\n    <i class=\"fa fa-plus-circle\" aria-hidden=\"true\"></i> Setup New Product\n  </button>\n</div>\n@if (loading) {\n  <div class=\"w-100 text-center mt-3\">\n    <p-progressSpinner> </p-progressSpinner>\n  </div>\n}\n<div class=\"primeng-datatable-container actions-collapsed table-responsive mt-0\"\n  [class.hideTable]=\"totalRecordsUnFiltered === 0\">\n  <p-table #dt\n    [value]=\"products\"\n    [paginator]=\"totalRecords !== 0\"\n    [lazy]=\"true\"\n    [rows]=\"PAGE_SIZE\"\n    [totalRecords]=\"totalRecords\"\n    [loading]=\"loading\"\n    [filterDelay]=\"1000\"\n    (onLazyLoad)=\"onLazyLoad($event)\"\n    [customSort]=\"true\">\n    <ng-template pTemplate=\"caption\">\n      <div class=\"search-filter\">\n        <div class=\"col-12 col-sm-4\">\n          <p-multiSelect inputId=\"products-list-feature-keys\" placeholder=\"Filter by feature keys\"\n            [options]=\"featureKeysList\"\n            (onChange)=\"onSearchOptionChange($event)\"\n            [showHeader]=\"true\"\n            appendTo=\"body\">\n          </p-multiSelect>\n        </div>\n        <div class=\"text-end\">\n          <label for=\"products-list-search\" class=\"visually-hidden\">Search Product</label>\n          <p-iconfield iconPosition=\"left\">\n            <p-inputicon><i class=\"fa fa-search\" aria-hidden=\"true\"></i></p-inputicon>\n            <input type=\"text\"\n              id=\"products-list-search\"\n              name=\"products-list-search\"\n              [(ngModel)]=\"searchText\"\n              pInputText\n              placeholder=\"Search Product...\"\n              (input)=\"dt.filterGlobal($event.target.value, 'contains')\" />\n          </p-iconfield>\n        </div>\n      </div>\n    </ng-template>\n    <ng-template pTemplate=\"header\">\n      <tr class=\"head\">\n        <th scope=\"true\"\n          pSortableColumn=\"name\">\n          {{ 'Label.Name' | transloco }}\n          <p-sortIcon field=\"name\"></p-sortIcon>\n        </th>\n        <th scope=\"true\"\n          pSortableColumn=\"stripe_plan_id\">\n          {{ 'Admin.Products.StripePlan' | transloco }}\n          <p-sortIcon field=\"stripe_plan_id\"></p-sortIcon>\n        </th>\n        <th scope=\"true\"\n          pSortableColumn=\"permission_key\">\n          {{ 'Admin.Products.PermissionKey' | transloco }}\n          <p-sortIcon field=\"permission_key\"></p-sortIcon>\n        </th>\n        <th scope=\"true\"\n          pSortableColumn=\"feature_key\">\n          {{ 'Admin.Products.FeatureKey' | transloco }}\n          <p-sortIcon field=\"feature_key\"></p-sortIcon>\n        </th>\n        <th scope=\"true\"\n          pSortableColumn=\"product_key\">\n          {{ 'Admin.Products.ProductKey' | transloco }}\n          <p-sortIcon field=\"product_key\"></p-sortIcon>\n        </th>\n        <th scope=\"true\"\n          pSortableColumn=\"category\">\n          {{ 'Admin.Products.Category' | transloco }}\n          <p-sortIcon field=\"category\"></p-sortIcon>\n        </th>\n        <th scope=\"true\"\n          pSortableColumn=\"region\">\n          {{ 'Admin.Products.Region' | transloco }}\n          <p-sortIcon field=\"region\"></p-sortIcon>\n        </th>\n        <th scope=\"true\"\n          pSortableColumn=\"currency\">\n          {{ 'Admin.Products.Currency' | transloco }}\n          <p-sortIcon field=\"currency\"></p-sortIcon>\n        </th>\n        <th scope=\"true\"\n          pSortableColumn=\"price_per_unit\">\n          {{ 'Admin.Products.Price' | transloco }}\n          <p-sortIcon field=\"price_per_unit\"></p-sortIcon>\n        </th>\n        <th scope=\"true\"\n          pSortableColumn=\"active\">\n          {{ 'Label.IsActive' | transloco }}\n          <p-sortIcon field=\"active\"></p-sortIcon>\n        </th>\n        <th scope=\"true\"\n          pSortableColumn=\"billing_frequency\">\n          {{ 'Admin.Products.Billing' | transloco }}\n          <p-sortIcon field=\"billing_frequency\"></p-sortIcon>\n        </th>\n        <th scope=\"true\"\n          class=\"actions-list-two\">{{ 'Label.Actions' | transloco }}</th>\n      </tr>\n    </ng-template>\n    <ng-template pTemplate=\"body\"\n      let-item>\n      <tr>\n        <td data-head=\"Name\">{{ item.name }}</td>\n        <td data-head=\"Stripe Plan\">{{ item.stripe_plan_id }}</td>\n        <td data-head=\"Permission Key\">{{ item.permission_key }}</td>\n        <td data-head=\"Feature Key\">{{ item.feature_key }}</td>\n        <td data-head=\"Product Key\">{{ item.product_key }}</td>\n        <td data-head=\"Category\">\n          <span [appDynamicBadge]=\"{ itemsArray: categories, item: item.category }\"\n            color=\"warning\"\n            class=\"badge\">{{ item.category }}</span>\n        </td>\n        <td data-head=\"Region\">\n          <span [appDynamicBadge]=\"{ itemsArray: regions, item: item.region }\"\n            color=\"cyan\"\n            class=\"badge\">{{ item.region }}</span>\n        </td>\n        <td data-head=\"Currency\">\n          <span [appDynamicBadge]=\"{ itemsArray: currency, item: item.currency }\"\n            color=\"blue-grey\"\n            class=\"badge\">{{ item.currency }}</span>\n        </td>\n        <td data-head=\"Price\">{{ item.price_per_unit }}</td>\n        <td data-head=\"Active\">\n          <span [appDynamicBadge]=\"{ itemsArray: [true, false], item: item?.active }\"\n            color=\"success-danger\"\n            class=\"badge\">{{ item?.active ? 'Yes' : 'No' }}</span>\n        </td>\n        <td data-head=\"Billing\">\n          <span class=\"badge\"\n            [appDynamicBadge]=\"{\n                            itemsArray: billingFrequency,\n                            item: item?.billing_frequency\n                        }\"\n            color=\"blue-grey\">{{ item.billing_frequency }}</span>\n        </td>\n        <td data-head=\"Action\">\n          <ul class=\"list-unstyled list-inline width-max-content\">\n            <li ngbTooltip=\"Edit\"\n              class=\"me-2 me-sm-3\"\n              *rbacAllow=\"'Pages.Admin.Product.Edit'\"\n              [routerLink]=\"[routers.productDetails + item.id]\">\n              <i class=\"fa fa-edit edit-icon\" aria-hidden=\"true\"></i>\n            </li>\n            <li ngbTooltip=\"Delete\"\n              class=\"me-2 me-sm-3\"\n              *rbacAllow=\"'Pages.Admin.Product.Delete'\"\n              (keydown.enter)=\"onDelete(item)\"\n              (click)=\"onDelete(item)\">\n              <i class=\"fa fa-trash delete-icon\" aria-hidden=\"true\"></i>\n            </li>\n            <li ngbTooltip=\"Users List\"\n              class=\"me-2 me-sm-3\"\n              *rbacAllow=\"'Pages.Admin.Product.Edit'\"\n              [routerLink]=\"[routers.productsUserList + item.id]\">\n              <i class=\"fa fa-tasks cta1-icon\" aria-hidden=\"true\"></i>\n            </li>\n            <li ngbTooltip=\"Duplicate The Product\"\n              class=\"me-sm-3\"\n              [routerLink]=\"[routers.productDetails + 'add']\"\n              [queryParams]=\"{ duplicate_product_id: item.id }\">\n              <i class=\"fa fa-clone edit-icon\" aria-hidden=\"true\"></i>\n            </li>\n            <li ngbTooltip=\"Feedback Questions\"\n              container=\"body\"\n              class=\"me-2 me-sm-3\"\n              [routerLink]=\"[routers.feedbackQuestions]\"\n              [queryParams]=\"{ product_id: item.id }\">\n              <i class=\"fa fa-comments edit-icon\" aria-hidden=\"true\"></i>\n            </li>\n          </ul>\n        </td>\n      </tr>\n    </ng-template>\n  </p-table>\n  @if (totalRecords === 0 && totalRecordsUnFiltered !== 0) {\n    <div>\n      <pw-no-data [withImage]=\"true\" [message]=\"'Search.NoDataMessage' | transloco\" [description]=\"'Search.NoDataDescription' | transloco\" >\n      </pw-no-data>\n    </div>\n  }\n  @if (totalRecords !== 0) {\n    <pw-records-summary [showing]=\"dt?.value?.length ?? 0\" [total]=\"totalRecords\" />\n  }\n</div>\n@if (!loading && totalRecordsUnFiltered === 0) {\n  <pw-no-data [withImage]=\"true\" [message]=\"'Admin.Products.NoDataMessage' | transloco\"> </pw-no-data>\n}\n<!-- password validation modal for delete product -->\n<pw-password-validation #passwordValidationModalForProductDelete\n  (successEvent)=\"deleteProduct($event)\">\n  <div class=\"row\">\n    <div class=\"col-12\">\n      <p>{{ 'User.Account.Message.ActionCanNotUndone' | transloco }}</p>\n      <p>{{ 'User.Account.Message.ConfirmPassword' | transloco }}</p>\n    </div>\n  </div>\n</pw-password-validation>\n", styles: ["@charset \"UTF-8\";:root{--first: rgb(23 105 225);--second: rgb(54 194 131);--third: rgb(255 171 0);--text: rgb(34 34 34);--tabs_bg: rgb(23 105 225);--tabs_sub_bg: rgb(70, 136, 236);--tabs_text: rgb(255 255 255);--titles: rgb(34 34 34);--sidebar_bg: rgb(0, 48, 63);--sidebar_text: rgb(255 255 255)}@media(min-width:767px){.table-responsive td,.table-responsive th{font-size:11px!important}}.table-responsive td{padding:6px 10px!important;line-height:1.4;vertical-align:middle;word-break:break-word}.table-responsive th{vertical-align:bottom}.table-responsive td[data-head=Name]{font-weight:600;color:#1a1d21}.table-responsive td[data-head=\"Stripe Plan\"],.table-responsive td[data-head=\"Permission Key\"],.table-responsive td[data-head=\"Feature Key\"],.table-responsive td[data-head=\"Product Key\"]{color:#5a6473;font-variant-numeric:tabular-nums}.table-responsive td[data-head=Price]{white-space:nowrap;font-variant-numeric:tabular-nums;text-align:right}.table-responsive th:nth-child(9){text-align:right}.table-responsive .badge{font-size:11px;font-weight:600;padding:2px 8px;border-radius:4px;letter-spacing:.01em}.table-responsive .badge[class*=bg-success]{background-color:#e6f4ec!important;color:#0f6b3a!important}.table-responsive .badge[class*=bg-danger]{background-color:#fbeae8!important;color:#c0392b!important}.table-responsive .badge.bg-warning{background-color:#efebe6!important;color:#725731!important}.table-responsive .badge.bg-warning-1{background-color:#edefe6!important;color:#627231!important}.table-responsive .badge.bg-warning-2{background-color:#e7efe6!important;color:#367231!important}.table-responsive .badge.bg-warning-3{background-color:#e6efeb!important;color:#317257!important}.table-responsive .badge.bg-warning-4{background-color:#e6edef!important;color:#316272!important}.table-responsive .badge.bg-warning-5{background-color:#e6e7ef!important;color:#313672!important}.table-responsive .badge.bg-warning-6{background-color:#ebe6ef!important;color:#573172!important}.table-responsive .badge.bg-warning-7{background-color:#efe6ed!important;color:#723162!important}.table-responsive .badge.bg-warning-8{background-color:#efe6e7!important;color:#723136!important}.table-responsive .badge.bg-warning-9{background-color:#efebe6!important;color:#725731!important}.table-responsive .badge.bg-warning-10{background-color:#edefe6!important;color:#627231!important}.table-responsive .badge.bg-warning-11{background-color:#e7efe6!important;color:#367231!important}.table-responsive .badge.bg-warning-12{background-color:#e6efeb!important;color:#317257!important}.table-responsive .badge.bg-warning-13{background-color:#e6edef!important;color:#316272!important}.table-responsive .badge.bg-warning-14{background-color:#e6e7ef!important;color:#313672!important}.table-responsive .badge.bg-warning-15{background-color:#ebe6ef!important;color:#573172!important}.table-responsive .badge.bg-warning-16{background-color:#efe6ed!important;color:#723162!important}.table-responsive .badge.bg-warning-17{background-color:#efe6e7!important;color:#723136!important}.table-responsive .badge.bg-warning-18{background-color:#efebe6!important;color:#725731!important}.table-responsive .badge.bg-warning-19{background-color:#edefe6!important;color:#627231!important}.table-responsive .badge.bg-warning-20{background-color:#e7efe6!important;color:#367231!important}.table-responsive .badge.bg-warning-21{background-color:#e6efeb!important;color:#317257!important}.table-responsive .badge.bg-warning-22{background-color:#e6edef!important;color:#316272!important}.table-responsive .badge.bg-warning-23{background-color:#e6e7ef!important;color:#313672!important}.table-responsive .badge.bg-warning-24{background-color:#ebe6ef!important;color:#573172!important}.table-responsive .badge.bg-cyan{background-color:#e6eeef!important;color:#316772!important}.table-responsive .badge.bg-cyan-1{background-color:#e6e8ef!important;color:#313c72!important}.table-responsive .badge.bg-cyan-2{background-color:#ebe6ef!important;color:#523172!important}.table-responsive .badge.bg-cyan-3{background-color:#efe6ee!important;color:#723167!important}.table-responsive .badge.bg-cyan-4{background-color:#efe6e8!important;color:#72313c!important}.table-responsive .badge.bg-cyan-5{background-color:#efebe6!important;color:#725231!important}.table-responsive .badge.bg-cyan-6{background-color:#eeefe6!important;color:#677231!important}.table-responsive .badge.bg-cyan-7{background-color:#e8efe6!important;color:#3c7231!important}.table-responsive .badge.bg-cyan-8{background-color:#e6efeb!important;color:#317252!important}.table-responsive .badge.bg-cyan-9{background-color:#e6eeef!important;color:#316772!important}.table-responsive .badge.bg-cyan-10{background-color:#e6e8ef!important;color:#313c72!important}.table-responsive .badge.bg-cyan-11{background-color:#ebe6ef!important;color:#523172!important}.table-responsive .badge.bg-cyan-12{background-color:#efe6ee!important;color:#723167!important}.table-responsive .badge.bg-cyan-13{background-color:#efe6e8!important;color:#72313c!important}.table-responsive .badge.bg-cyan-14{background-color:#efebe6!important;color:#725231!important}.table-responsive .badge.bg-cyan-15{background-color:#eeefe6!important;color:#677231!important}.table-responsive .badge.bg-cyan-16{background-color:#e8efe6!important;color:#3c7231!important}.table-responsive .badge.bg-cyan-17{background-color:#e6efeb!important;color:#317252!important}.table-responsive .badge.bg-cyan-18{background-color:#e6eeef!important;color:#316772!important}.table-responsive .badge.bg-cyan-19{background-color:#e6e8ef!important;color:#313c72!important}.table-responsive .badge.bg-cyan-20{background-color:#ebe6ef!important;color:#523172!important}.table-responsive .badge.bg-cyan-21{background-color:#efe6ee!important;color:#723167!important}.table-responsive .badge.bg-cyan-22{background-color:#efe6e8!important;color:#72313c!important}.table-responsive .badge.bg-cyan-23{background-color:#efebe6!important;color:#725231!important}.table-responsive .badge.bg-cyan-24{background-color:#eeefe6!important;color:#677231!important}.table-responsive .badge.bg-blue-grey{background-color:#e6e9ef!important;color:#314772!important}.table-responsive .badge.bg-blue-grey-1{background-color:#e9e6ef!important;color:#473172!important}.table-responsive .badge.bg-blue-grey-2{background-color:#efe6ef!important;color:#723172!important}.table-responsive .badge.bg-blue-grey-3{background-color:#efe6e9!important;color:#723147!important}.table-responsive .badge.bg-blue-grey-4{background-color:#efe9e6!important;color:#724731!important}.table-responsive .badge.bg-blue-grey-5{background-color:#efefe6!important;color:#727231!important}.table-responsive .badge.bg-blue-grey-6{background-color:#e9efe6!important;color:#477231!important}.table-responsive .badge.bg-blue-grey-7{background-color:#e6efe9!important;color:#317247!important}.table-responsive .badge.bg-blue-grey-8{background-color:#e6efef!important;color:#317272!important}.table-responsive .badge.bg-blue-grey-9{background-color:#e6e9ef!important;color:#314772!important}.table-responsive .badge.bg-blue-grey-10{background-color:#e9e6ef!important;color:#473172!important}.table-responsive .badge.bg-blue-grey-11{background-color:#efe6ef!important;color:#723172!important}.table-responsive .badge.bg-blue-grey-12{background-color:#efe6e9!important;color:#723147!important}.table-responsive .badge.bg-blue-grey-13{background-color:#efe9e6!important;color:#724731!important}.table-responsive .badge.bg-blue-grey-14{background-color:#efefe6!important;color:#727231!important}.table-responsive .badge.bg-blue-grey-15{background-color:#e9efe6!important;color:#477231!important}.table-responsive .badge.bg-blue-grey-16{background-color:#e6efe9!important;color:#317247!important}.table-responsive .badge.bg-blue-grey-17{background-color:#e6efef!important;color:#317272!important}.table-responsive .badge.bg-blue-grey-18{background-color:#e6e9ef!important;color:#314772!important}.table-responsive .badge.bg-blue-grey-19{background-color:#e9e6ef!important;color:#473172!important}.table-responsive .badge.bg-blue-grey-20{background-color:#efe6ef!important;color:#723172!important}.table-responsive .badge.bg-blue-grey-21{background-color:#efe6e9!important;color:#723147!important}.table-responsive .badge.bg-blue-grey-22{background-color:#efe9e6!important;color:#724731!important}.table-responsive .badge.bg-blue-grey-23{background-color:#efefe6!important;color:#727231!important}.table-responsive .badge.bg-blue-grey-24{background-color:#e9efe6!important;color:#477231!important}.table-responsive .badge.bg-cyan-default{background-color:#e6eeef!important;color:#316772!important}.table-responsive .badge.bg-cyan-default-change{background-color:#e6efeb!important;color:#317252!important}.table-responsive .badge.bg-success:before,.table-responsive .badge.bg-danger:before{content:\"\";display:inline-block;box-sizing:border-box;width:7px;height:7px;margin-right:6px;border-radius:50%;vertical-align:middle}.table-responsive .badge.bg-success:before{background-color:currentColor}.table-responsive .badge.bg-danger:before{background-color:transparent;border:1.5px solid currentColor}.width-max-content{width:max-content}\n"], dependencies: [{ kind: "component", type: i2.Table, selector: "p-table", inputs: ["frozenColumns", "frozenValue", "styleClass", "tableStyle", "tableStyleClass", "paginator", "pageLinks", "rowsPerPageOptions", "alwaysShowPaginator", "paginatorPosition", "paginatorStyleClass", "paginatorDropdownAppendTo", "paginatorDropdownScrollHeight", "currentPageReportTemplate", "showCurrentPageReport", "showJumpToPageDropdown", "showJumpToPageInput", "showFirstLastIcon", "showPageLinks", "defaultSortOrder", "sortMode", "resetPageOnSort", "selectionMode", "selectionPageOnly", "contextMenuSelection", "contextMenuSelectionMode", "dataKey", "metaKeySelection", "rowSelectable", "rowTrackBy", "lazy", "lazyLoadOnInit", "compareSelectionBy", "csvSeparator", "exportFilename", "filters", "globalFilterFields", "filterDelay", "filterLocale", "expandedRowKeys", "editingRowKeys", "rowExpandMode", "scrollable", "rowGroupMode", "scrollHeight", "virtualScroll", "virtualScrollItemSize", "virtualScrollOptions", "virtualScrollDelay", "frozenWidth", "contextMenu", "resizableColumns", "columnResizeMode", "reorderableColumns", "loading", "loadingIcon", "showLoader", "rowHover", "customSort", "showInitialSortBadge", "exportFunction", "exportHeader", "stateKey", "stateStorage", "editMode", "groupRowsBy", "size", "showGridlines", "stripedRows", "groupRowsByOrder", "responsiveLayout", "breakpoint", "paginatorLocale", "value", "columns", "first", "rows", "totalRecords", "sortField", "sortOrder", "multiSortMeta", "selection", "selectAll"], outputs: ["contextMenuSelectionChange", "selectAllChange", "selectionChange", "onRowSelect", "onRowUnselect", "onPage", "onSort", "onFilter", "onLazyLoad", "onRowExpand", "onRowCollapse", "onContextMenuSelect", "onColResize", "onColReorder", "onRowReorder", "onEditInit", "onEditComplete", "onEditCancel", "onHeaderCheckboxToggle", "sortFunction", "firstChange", "rowsChange", "onStateSave", "onStateRestore"] }, { kind: "directive", type: i3$1.PrimeTemplate, selector: "[pTemplate]", inputs: ["type", "pTemplate"] }, { kind: "directive", type: i2.SortableColumn, selector: "[pSortableColumn]", inputs: ["pSortableColumn", "pSortableColumnDisabled"] }, { kind: "component", type: i2.SortIcon, selector: "p-sortIcon", inputs: ["field"] }, { kind: "component", type: i6$2.MultiSelect, selector: "p-multiSelect, p-multiselect, p-multi-select", inputs: ["id", "ariaLabel", "styleClass", "panelStyle", "panelStyleClass", "inputId", "readonly", "group", "filter", "filterPlaceHolder", "filterLocale", "overlayVisible", "tabindex", "dataKey", "ariaLabelledBy", "displaySelectedLabel", "maxSelectedLabels", "selectionLimit", "selectedItemsLabel", "showToggleAll", "emptyFilterMessage", "emptyMessage", "resetFilterOnHide", "dropdownIcon", "chipIcon", "optionLabel", "optionValue", "optionDisabled", "optionGroupLabel", "optionGroupChildren", "showHeader", "filterBy", "scrollHeight", "lazy", "virtualScroll", "loading", "virtualScrollItemSize", "loadingIcon", "virtualScrollOptions", "overlayOptions", "ariaFilterLabel", "filterMatchMode", "tooltip", "tooltipPosition", "tooltipPositionStyle", "tooltipStyleClass", "autofocusFilter", "display", "autocomplete", "showClear", "autofocus", "placeholder", "options", "filterValue", "selectAll", "focusOnHover", "filterFields", "selectOnFocus", "autoOptionFocus", "highlightOnSelect", "size", "variant", "fluid", "appendTo", "motionOptions"], outputs: ["onChange", "onFilter", "onFocus", "onBlur", "onClick", "onClear", "onPanelShow", "onPanelHide", "onLazyLoad", "onRemove", "onSelectAllChange"] }, { kind: "directive", type: i4$1.InputText, selector: "[pInputText]", inputs: ["hostName", "ptInputText", "pInputTextPT", "pInputTextUnstyled", "pSize", "variant", "fluid", "invalid"] }, { kind: "component", type: i5$1.IconField, selector: "p-iconfield, p-iconField, p-icon-field", inputs: ["hostName", "iconPosition", "styleClass"] }, { kind: "component", type: i6.InputIcon, selector: "p-inputicon, p-inputIcon", inputs: ["hostName", "styleClass"] }, { kind: "directive", type: i2$1.NgbTooltip, selector: "[ngbTooltip]", inputs: ["animation", "autoClose", "placement", "popperOptions", "triggers", "positionTarget", "container", "disableTooltip", "tooltipClass", "tooltipContext", "openDelay", "closeDelay", "ngbTooltip"], outputs: ["shown", "hidden"], exportAs: ["ngbTooltip"] }, { kind: "directive", type: i9.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { kind: "directive", type: i9.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i9.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "component", type: i10$1.PasswordValidationComponent, selector: "pw-password-validation", inputs: ["confirmMessage"], outputs: ["successEvent"] }, { kind: "component", type: i4.ProgressSpinner, selector: "p-progressSpinner, p-progress-spinner, p-progressspinner", inputs: ["styleClass", "strokeWidth", "fill", "animationDuration", "ariaLabel"] }, { kind: "component", type: i10$1.NoDataComponent, selector: "pw-no-data", inputs: ["message", "description", "withImage"] }, { kind: "component", type: i10$1.RecordsSummaryComponent, selector: "pw-records-summary", inputs: ["showing", "total"] }, { kind: "directive", type: i11.DynamicBadgeDirective, selector: "[appDynamicBadge]", inputs: ["appDynamicBadge", "color", "colorByName", "dataName"] }, { kind: "directive", type: i11.RbacAllowDirective, selector: "[rbacAllow]", inputs: ["rbacAllow"] }, { kind: "directive", type: i12.RouterLink, selector: "[routerLink]", inputs: ["target", "queryParams", "fragment", "queryParamsHandling", "state", "info", "relativeTo", "preserveFragment", "skipLocationChange", "replaceUrl", "routerLink"] }, { kind: "pipe", type: i13.TranslocoPipe, name: "transloco" }] }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.6", type: ProductsListComponent, isStandalone: false, selector: "pw-admin-products-list", viewQueries: [{ propertyName: "passwordValidationModalForProductDelete", first: true, predicate: ["passwordValidationModalForProductDelete"], descendants: true }], usesInheritance: true, ngImport: i0, template: "<div class=\"col-xs-12 text-end d-flex justify-content-between align-items-center\">\n  <h2 class=\"card-title p-0 float-start\">Products</h2>\n  <button *rbacAllow=\"'Pages.Admin.Product.Create'\"\n    class=\"btn btn-sm btn-outline-primary\"\n    [routerLink]=\"[routers.productDetails + 'add']\">\n    <i class=\"fa fa-plus-circle\" aria-hidden=\"true\"></i> Setup New Product\n  </button>\n</div>\n@if (loading) {\n  <div class=\"w-100 text-center mt-3\">\n    <p-progressSpinner> </p-progressSpinner>\n  </div>\n}\n<div class=\"primeng-datatable-container actions-collapsed table-responsive mt-0\"\n  [class.hideTable]=\"totalRecordsUnFiltered === 0\">\n  <p-table #dt\n    [value]=\"products\"\n    [paginator]=\"totalRecords !== 0\"\n    [lazy]=\"true\"\n    [rows]=\"PAGE_SIZE\"\n    [totalRecords]=\"totalRecords\"\n    [loading]=\"loading\"\n    [filterDelay]=\"1000\"\n    (onLazyLoad)=\"onLazyLoad($event)\"\n    [customSort]=\"true\">\n    <ng-template pTemplate=\"caption\">\n      <div class=\"search-filter\">\n        <div class=\"col-12 col-sm-4\">\n          <p-multiSelect inputId=\"products-list-feature-keys\" placeholder=\"Filter by feature keys\"\n            [options]=\"featureKeysList\"\n            (onChange)=\"onSearchOptionChange($event)\"\n            [showHeader]=\"true\"\n            appendTo=\"body\">\n          </p-multiSelect>\n        </div>\n        <div class=\"text-end\">\n          <label for=\"products-list-search\" class=\"visually-hidden\">Search Product</label>\n          <p-iconfield iconPosition=\"left\">\n            <p-inputicon><i class=\"fa fa-search\" aria-hidden=\"true\"></i></p-inputicon>\n            <input type=\"text\"\n              id=\"products-list-search\"\n              name=\"products-list-search\"\n              [(ngModel)]=\"searchText\"\n              pInputText\n              placeholder=\"Search Product...\"\n              (input)=\"dt.filterGlobal($event.target.value, 'contains')\" />\n          </p-iconfield>\n        </div>\n      </div>\n    </ng-template>\n    <ng-template pTemplate=\"header\">\n      <tr class=\"head\">\n        <th scope=\"true\"\n          pSortableColumn=\"name\">\n          {{ 'Label.Name' | transloco }}\n          <p-sortIcon field=\"name\"></p-sortIcon>\n        </th>\n        <th scope=\"true\"\n          pSortableColumn=\"stripe_plan_id\">\n          {{ 'Admin.Products.StripePlan' | transloco }}\n          <p-sortIcon field=\"stripe_plan_id\"></p-sortIcon>\n        </th>\n        <th scope=\"true\"\n          pSortableColumn=\"permission_key\">\n          {{ 'Admin.Products.PermissionKey' | transloco }}\n          <p-sortIcon field=\"permission_key\"></p-sortIcon>\n        </th>\n        <th scope=\"true\"\n          pSortableColumn=\"feature_key\">\n          {{ 'Admin.Products.FeatureKey' | transloco }}\n          <p-sortIcon field=\"feature_key\"></p-sortIcon>\n        </th>\n        <th scope=\"true\"\n          pSortableColumn=\"product_key\">\n          {{ 'Admin.Products.ProductKey' | transloco }}\n          <p-sortIcon field=\"product_key\"></p-sortIcon>\n        </th>\n        <th scope=\"true\"\n          pSortableColumn=\"category\">\n          {{ 'Admin.Products.Category' | transloco }}\n          <p-sortIcon field=\"category\"></p-sortIcon>\n        </th>\n        <th scope=\"true\"\n          pSortableColumn=\"region\">\n          {{ 'Admin.Products.Region' | transloco }}\n          <p-sortIcon field=\"region\"></p-sortIcon>\n        </th>\n        <th scope=\"true\"\n          pSortableColumn=\"currency\">\n          {{ 'Admin.Products.Currency' | transloco }}\n          <p-sortIcon field=\"currency\"></p-sortIcon>\n        </th>\n        <th scope=\"true\"\n          pSortableColumn=\"price_per_unit\">\n          {{ 'Admin.Products.Price' | transloco }}\n          <p-sortIcon field=\"price_per_unit\"></p-sortIcon>\n        </th>\n        <th scope=\"true\"\n          pSortableColumn=\"active\">\n          {{ 'Label.IsActive' | transloco }}\n          <p-sortIcon field=\"active\"></p-sortIcon>\n        </th>\n        <th scope=\"true\"\n          pSortableColumn=\"billing_frequency\">\n          {{ 'Admin.Products.Billing' | transloco }}\n          <p-sortIcon field=\"billing_frequency\"></p-sortIcon>\n        </th>\n        <th scope=\"true\"\n          class=\"actions-list-two\">{{ 'Label.Actions' | transloco }}</th>\n      </tr>\n    </ng-template>\n    <ng-template pTemplate=\"body\"\n      let-item>\n      <tr>\n        <td data-head=\"Name\">{{ item.name }}</td>\n        <td data-head=\"Stripe Plan\">{{ item.stripe_plan_id }}</td>\n        <td data-head=\"Permission Key\">{{ item.permission_key }}</td>\n        <td data-head=\"Feature Key\">{{ item.feature_key }}</td>\n        <td data-head=\"Product Key\">{{ item.product_key }}</td>\n        <td data-head=\"Category\">\n          <span [appDynamicBadge]=\"{ itemsArray: categories, item: item.category }\"\n            color=\"warning\"\n            class=\"badge\">{{ item.category }}</span>\n        </td>\n        <td data-head=\"Region\">\n          <span [appDynamicBadge]=\"{ itemsArray: regions, item: item.region }\"\n            color=\"cyan\"\n            class=\"badge\">{{ item.region }}</span>\n        </td>\n        <td data-head=\"Currency\">\n          <span [appDynamicBadge]=\"{ itemsArray: currency, item: item.currency }\"\n            color=\"blue-grey\"\n            class=\"badge\">{{ item.currency }}</span>\n        </td>\n        <td data-head=\"Price\">{{ item.price_per_unit }}</td>\n        <td data-head=\"Active\">\n          <span [appDynamicBadge]=\"{ itemsArray: [true, false], item: item?.active }\"\n            color=\"success-danger\"\n            class=\"badge\">{{ item?.active ? 'Yes' : 'No' }}</span>\n        </td>\n        <td data-head=\"Billing\">\n          <span class=\"badge\"\n            [appDynamicBadge]=\"{\n                            itemsArray: billingFrequency,\n                            item: item?.billing_frequency\n                        }\"\n            color=\"blue-grey\">{{ item.billing_frequency }}</span>\n        </td>\n        <td data-head=\"Action\">\n          <ul class=\"list-unstyled list-inline width-max-content\">\n            <li ngbTooltip=\"Edit\"\n              class=\"me-2 me-sm-3\"\n              *rbacAllow=\"'Pages.Admin.Product.Edit'\"\n              [routerLink]=\"[routers.productDetails + item.id]\">\n              <i class=\"fa fa-edit edit-icon\" aria-hidden=\"true\"></i>\n            </li>\n            <li ngbTooltip=\"Delete\"\n              class=\"me-2 me-sm-3\"\n              *rbacAllow=\"'Pages.Admin.Product.Delete'\"\n              (keydown.enter)=\"onDelete(item)\"\n              (click)=\"onDelete(item)\">\n              <i class=\"fa fa-trash delete-icon\" aria-hidden=\"true\"></i>\n            </li>\n            <li ngbTooltip=\"Users List\"\n              class=\"me-2 me-sm-3\"\n              *rbacAllow=\"'Pages.Admin.Product.Edit'\"\n              [routerLink]=\"[routers.productsUserList + item.id]\">\n              <i class=\"fa fa-tasks cta1-icon\" aria-hidden=\"true\"></i>\n            </li>\n            <li ngbTooltip=\"Duplicate The Product\"\n              class=\"me-sm-3\"\n              [routerLink]=\"[routers.productDetails + 'add']\"\n              [queryParams]=\"{ duplicate_product_id: item.id }\">\n              <i class=\"fa fa-clone edit-icon\" aria-hidden=\"true\"></i>\n            </li>\n            <li ngbTooltip=\"Feedback Questions\"\n              container=\"body\"\n              class=\"me-2 me-sm-3\"\n              [routerLink]=\"[routers.feedbackQuestions]\"\n              [queryParams]=\"{ product_id: item.id }\">\n              <i class=\"fa fa-comments edit-icon\" aria-hidden=\"true\"></i>\n            </li>\n          </ul>\n        </td>\n      </tr>\n    </ng-template>\n  </p-table>\n  @if (totalRecords === 0 && totalRecordsUnFiltered !== 0) {\n    <div>\n      <pw-no-data [withImage]=\"true\" [message]=\"'Search.NoDataMessage' | transloco\" [description]=\"'Search.NoDataDescription' | transloco\" >\n      </pw-no-data>\n    </div>\n  }\n  @if (totalRecords !== 0) {\n    <pw-records-summary [showing]=\"dt?.value?.length ?? 0\" [total]=\"totalRecords\" />\n  }\n</div>\n@if (!loading && totalRecordsUnFiltered === 0) {\n  <pw-no-data [withImage]=\"true\" [message]=\"'Admin.Products.NoDataMessage' | transloco\"> </pw-no-data>\n}\n<!-- password validation modal for delete product -->\n<pw-password-validation #passwordValidationModalForProductDelete\n  [destructive]=\"true\"\n  (successEvent)=\"deleteProduct($event)\">\n</pw-password-validation>\n", styles: ["@charset \"UTF-8\";:root{--first: rgb(23 105 225);--second: rgb(54 194 131);--third: rgb(255 171 0);--text: rgb(34 34 34);--tabs_bg: rgb(23 105 225);--tabs_sub_bg: rgb(70, 136, 236);--tabs_text: rgb(255 255 255);--titles: rgb(34 34 34);--sidebar_bg: rgb(0, 48, 63);--sidebar_text: rgb(255 255 255)}.table-responsive td{padding:6px 10px!important;line-height:1.4;vertical-align:middle;word-break:break-word}.table-responsive th{vertical-align:bottom}.table-responsive td[data-head=Name]{font-weight:600;color:#1a1d21}.table-responsive td[data-head=\"Stripe Plan\"],.table-responsive td[data-head=\"Permission Key\"],.table-responsive td[data-head=\"Feature Key\"],.table-responsive td[data-head=\"Product Key\"]{color:#5a6473;font-variant-numeric:tabular-nums}.table-responsive td[data-head=Price]{white-space:nowrap;font-variant-numeric:tabular-nums;text-align:right}.table-responsive th:nth-child(9){text-align:right}.table-responsive .badge{font-size:11px;font-weight:600;padding:2px 8px;border-radius:4px;letter-spacing:.01em}.table-responsive .badge[class*=bg-success]{background-color:#e6f4ec!important;color:#0f6b3a!important}.table-responsive .badge[class*=bg-danger]{background-color:#fbeae8!important;color:#c0392b!important}.table-responsive .badge.bg-warning{background-color:#efebe6!important;color:#725731!important}.table-responsive .badge.bg-warning-1{background-color:#edefe6!important;color:#627231!important}.table-responsive .badge.bg-warning-2{background-color:#e7efe6!important;color:#367231!important}.table-responsive .badge.bg-warning-3{background-color:#e6efeb!important;color:#317257!important}.table-responsive .badge.bg-warning-4{background-color:#e6edef!important;color:#316272!important}.table-responsive .badge.bg-warning-5{background-color:#e6e7ef!important;color:#313672!important}.table-responsive .badge.bg-warning-6{background-color:#ebe6ef!important;color:#573172!important}.table-responsive .badge.bg-warning-7{background-color:#efe6ed!important;color:#723162!important}.table-responsive .badge.bg-warning-8{background-color:#efe6e7!important;color:#723136!important}.table-responsive .badge.bg-warning-9{background-color:#efebe6!important;color:#725731!important}.table-responsive .badge.bg-warning-10{background-color:#edefe6!important;color:#627231!important}.table-responsive .badge.bg-warning-11{background-color:#e7efe6!important;color:#367231!important}.table-responsive .badge.bg-warning-12{background-color:#e6efeb!important;color:#317257!important}.table-responsive .badge.bg-warning-13{background-color:#e6edef!important;color:#316272!important}.table-responsive .badge.bg-warning-14{background-color:#e6e7ef!important;color:#313672!important}.table-responsive .badge.bg-warning-15{background-color:#ebe6ef!important;color:#573172!important}.table-responsive .badge.bg-warning-16{background-color:#efe6ed!important;color:#723162!important}.table-responsive .badge.bg-warning-17{background-color:#efe6e7!important;color:#723136!important}.table-responsive .badge.bg-warning-18{background-color:#efebe6!important;color:#725731!important}.table-responsive .badge.bg-warning-19{background-color:#edefe6!important;color:#627231!important}.table-responsive .badge.bg-warning-20{background-color:#e7efe6!important;color:#367231!important}.table-responsive .badge.bg-warning-21{background-color:#e6efeb!important;color:#317257!important}.table-responsive .badge.bg-warning-22{background-color:#e6edef!important;color:#316272!important}.table-responsive .badge.bg-warning-23{background-color:#e6e7ef!important;color:#313672!important}.table-responsive .badge.bg-warning-24{background-color:#ebe6ef!important;color:#573172!important}.table-responsive .badge.bg-cyan{background-color:#e6eeef!important;color:#316772!important}.table-responsive .badge.bg-cyan-1{background-color:#e6e8ef!important;color:#313c72!important}.table-responsive .badge.bg-cyan-2{background-color:#ebe6ef!important;color:#523172!important}.table-responsive .badge.bg-cyan-3{background-color:#efe6ee!important;color:#723167!important}.table-responsive .badge.bg-cyan-4{background-color:#efe6e8!important;color:#72313c!important}.table-responsive .badge.bg-cyan-5{background-color:#efebe6!important;color:#725231!important}.table-responsive .badge.bg-cyan-6{background-color:#eeefe6!important;color:#677231!important}.table-responsive .badge.bg-cyan-7{background-color:#e8efe6!important;color:#3c7231!important}.table-responsive .badge.bg-cyan-8{background-color:#e6efeb!important;color:#317252!important}.table-responsive .badge.bg-cyan-9{background-color:#e6eeef!important;color:#316772!important}.table-responsive .badge.bg-cyan-10{background-color:#e6e8ef!important;color:#313c72!important}.table-responsive .badge.bg-cyan-11{background-color:#ebe6ef!important;color:#523172!important}.table-responsive .badge.bg-cyan-12{background-color:#efe6ee!important;color:#723167!important}.table-responsive .badge.bg-cyan-13{background-color:#efe6e8!important;color:#72313c!important}.table-responsive .badge.bg-cyan-14{background-color:#efebe6!important;color:#725231!important}.table-responsive .badge.bg-cyan-15{background-color:#eeefe6!important;color:#677231!important}.table-responsive .badge.bg-cyan-16{background-color:#e8efe6!important;color:#3c7231!important}.table-responsive .badge.bg-cyan-17{background-color:#e6efeb!important;color:#317252!important}.table-responsive .badge.bg-cyan-18{background-color:#e6eeef!important;color:#316772!important}.table-responsive .badge.bg-cyan-19{background-color:#e6e8ef!important;color:#313c72!important}.table-responsive .badge.bg-cyan-20{background-color:#ebe6ef!important;color:#523172!important}.table-responsive .badge.bg-cyan-21{background-color:#efe6ee!important;color:#723167!important}.table-responsive .badge.bg-cyan-22{background-color:#efe6e8!important;color:#72313c!important}.table-responsive .badge.bg-cyan-23{background-color:#efebe6!important;color:#725231!important}.table-responsive .badge.bg-cyan-24{background-color:#eeefe6!important;color:#677231!important}.table-responsive .badge.bg-blue-grey{background-color:#e6e9ef!important;color:#314772!important}.table-responsive .badge.bg-blue-grey-1{background-color:#e9e6ef!important;color:#473172!important}.table-responsive .badge.bg-blue-grey-2{background-color:#efe6ef!important;color:#723172!important}.table-responsive .badge.bg-blue-grey-3{background-color:#efe6e9!important;color:#723147!important}.table-responsive .badge.bg-blue-grey-4{background-color:#efe9e6!important;color:#724731!important}.table-responsive .badge.bg-blue-grey-5{background-color:#efefe6!important;color:#727231!important}.table-responsive .badge.bg-blue-grey-6{background-color:#e9efe6!important;color:#477231!important}.table-responsive .badge.bg-blue-grey-7{background-color:#e6efe9!important;color:#317247!important}.table-responsive .badge.bg-blue-grey-8{background-color:#e6efef!important;color:#317272!important}.table-responsive .badge.bg-blue-grey-9{background-color:#e6e9ef!important;color:#314772!important}.table-responsive .badge.bg-blue-grey-10{background-color:#e9e6ef!important;color:#473172!important}.table-responsive .badge.bg-blue-grey-11{background-color:#efe6ef!important;color:#723172!important}.table-responsive .badge.bg-blue-grey-12{background-color:#efe6e9!important;color:#723147!important}.table-responsive .badge.bg-blue-grey-13{background-color:#efe9e6!important;color:#724731!important}.table-responsive .badge.bg-blue-grey-14{background-color:#efefe6!important;color:#727231!important}.table-responsive .badge.bg-blue-grey-15{background-color:#e9efe6!important;color:#477231!important}.table-responsive .badge.bg-blue-grey-16{background-color:#e6efe9!important;color:#317247!important}.table-responsive .badge.bg-blue-grey-17{background-color:#e6efef!important;color:#317272!important}.table-responsive .badge.bg-blue-grey-18{background-color:#e6e9ef!important;color:#314772!important}.table-responsive .badge.bg-blue-grey-19{background-color:#e9e6ef!important;color:#473172!important}.table-responsive .badge.bg-blue-grey-20{background-color:#efe6ef!important;color:#723172!important}.table-responsive .badge.bg-blue-grey-21{background-color:#efe6e9!important;color:#723147!important}.table-responsive .badge.bg-blue-grey-22{background-color:#efe9e6!important;color:#724731!important}.table-responsive .badge.bg-blue-grey-23{background-color:#efefe6!important;color:#727231!important}.table-responsive .badge.bg-blue-grey-24{background-color:#e9efe6!important;color:#477231!important}.table-responsive .badge.bg-cyan-default{background-color:#e6eeef!important;color:#316772!important}.table-responsive .badge.bg-cyan-default-change{background-color:#e6efeb!important;color:#317252!important}.table-responsive .badge.bg-success:before,.table-responsive .badge.bg-danger:before{content:\"\";display:inline-block;box-sizing:border-box;width:7px;height:7px;margin-right:6px;border-radius:50%;vertical-align:middle}.table-responsive .badge.bg-success:before{background-color:currentColor}.table-responsive .badge.bg-danger:before{background-color:transparent;border:1.5px solid currentColor}.width-max-content{width:max-content}\n"], dependencies: [{ kind: "component", type: i2.Table, selector: "p-table", inputs: ["frozenColumns", "frozenValue", "styleClass", "tableStyle", "tableStyleClass", "paginator", "pageLinks", "rowsPerPageOptions", "alwaysShowPaginator", "paginatorPosition", "paginatorStyleClass", "paginatorDropdownAppendTo", "paginatorDropdownScrollHeight", "currentPageReportTemplate", "showCurrentPageReport", "showJumpToPageDropdown", "showJumpToPageInput", "showFirstLastIcon", "showPageLinks", "defaultSortOrder", "sortMode", "resetPageOnSort", "selectionMode", "selectionPageOnly", "contextMenuSelection", "contextMenuSelectionMode", "dataKey", "metaKeySelection", "rowSelectable", "rowTrackBy", "lazy", "lazyLoadOnInit", "compareSelectionBy", "csvSeparator", "exportFilename", "filters", "globalFilterFields", "filterDelay", "filterLocale", "expandedRowKeys", "editingRowKeys", "rowExpandMode", "scrollable", "rowGroupMode", "scrollHeight", "virtualScroll", "virtualScrollItemSize", "virtualScrollOptions", "virtualScrollDelay", "frozenWidth", "contextMenu", "resizableColumns", "columnResizeMode", "reorderableColumns", "loading", "loadingIcon", "showLoader", "rowHover", "customSort", "showInitialSortBadge", "exportFunction", "exportHeader", "stateKey", "stateStorage", "editMode", "groupRowsBy", "size", "showGridlines", "stripedRows", "groupRowsByOrder", "responsiveLayout", "breakpoint", "paginatorLocale", "value", "columns", "first", "rows", "totalRecords", "sortField", "sortOrder", "multiSortMeta", "selection", "selectAll"], outputs: ["contextMenuSelectionChange", "selectAllChange", "selectionChange", "onRowSelect", "onRowUnselect", "onPage", "onSort", "onFilter", "onLazyLoad", "onRowExpand", "onRowCollapse", "onContextMenuSelect", "onColResize", "onColReorder", "onRowReorder", "onEditInit", "onEditComplete", "onEditCancel", "onHeaderCheckboxToggle", "sortFunction", "firstChange", "rowsChange", "onStateSave", "onStateRestore"] }, { kind: "directive", type: i3$1.PrimeTemplate, selector: "[pTemplate]", inputs: ["type", "pTemplate"] }, { kind: "directive", type: i2.SortableColumn, selector: "[pSortableColumn]", inputs: ["pSortableColumn", "pSortableColumnDisabled"] }, { kind: "component", type: i2.SortIcon, selector: "p-sortIcon", inputs: ["field"] }, { kind: "component", type: i6$2.MultiSelect, selector: "p-multiSelect, p-multiselect, p-multi-select", inputs: ["id", "ariaLabel", "styleClass", "panelStyle", "panelStyleClass", "inputId", "readonly", "group", "filter", "filterPlaceHolder", "filterLocale", "overlayVisible", "tabindex", "dataKey", "ariaLabelledBy", "displaySelectedLabel", "maxSelectedLabels", "selectionLimit", "selectedItemsLabel", "showToggleAll", "emptyFilterMessage", "emptyMessage", "resetFilterOnHide", "dropdownIcon", "chipIcon", "optionLabel", "optionValue", "optionDisabled", "optionGroupLabel", "optionGroupChildren", "showHeader", "filterBy", "scrollHeight", "lazy", "virtualScroll", "loading", "virtualScrollItemSize", "loadingIcon", "virtualScrollOptions", "overlayOptions", "ariaFilterLabel", "filterMatchMode", "tooltip", "tooltipPosition", "tooltipPositionStyle", "tooltipStyleClass", "autofocusFilter", "display", "autocomplete", "showClear", "autofocus", "placeholder", "options", "filterValue", "selectAll", "focusOnHover", "filterFields", "selectOnFocus", "autoOptionFocus", "highlightOnSelect", "size", "variant", "fluid", "appendTo", "motionOptions"], outputs: ["onChange", "onFilter", "onFocus", "onBlur", "onClick", "onClear", "onPanelShow", "onPanelHide", "onLazyLoad", "onRemove", "onSelectAllChange"] }, { kind: "directive", type: i4$1.InputText, selector: "[pInputText]", inputs: ["hostName", "ptInputText", "pInputTextPT", "pInputTextUnstyled", "pSize", "variant", "fluid", "invalid"] }, { kind: "component", type: i5$1.IconField, selector: "p-iconfield, p-iconField, p-icon-field", inputs: ["hostName", "iconPosition", "styleClass"] }, { kind: "component", type: i6.InputIcon, selector: "p-inputicon, p-inputIcon", inputs: ["hostName", "styleClass"] }, { kind: "directive", type: i2$1.NgbTooltip, selector: "[ngbTooltip]", inputs: ["animation", "autoClose", "placement", "popperOptions", "triggers", "positionTarget", "container", "disableTooltip", "tooltipClass", "tooltipContext", "openDelay", "closeDelay", "ngbTooltip"], outputs: ["shown", "hidden"], exportAs: ["ngbTooltip"] }, { kind: "directive", type: i9.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { kind: "directive", type: i9.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i9.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "component", type: i10$1.PasswordValidationComponent, selector: "pw-password-validation", inputs: ["confirmMessage", "destructive"], outputs: ["successEvent"] }, { kind: "component", type: i4.ProgressSpinner, selector: "p-progressSpinner, p-progress-spinner, p-progressspinner", inputs: ["styleClass", "strokeWidth", "fill", "animationDuration", "ariaLabel"] }, { kind: "component", type: i10$1.NoDataComponent, selector: "pw-no-data", inputs: ["message", "description", "withImage"] }, { kind: "component", type: i10$1.RecordsSummaryComponent, selector: "pw-records-summary", inputs: ["showing", "total"] }, { kind: "directive", type: i11.DynamicBadgeDirective, selector: "[appDynamicBadge]", inputs: ["appDynamicBadge", "color", "colorByName", "dataName"] }, { kind: "directive", type: i11.RbacAllowDirective, selector: "[rbacAllow]", inputs: ["rbacAllow"] }, { kind: "directive", type: i12.RouterLink, selector: "[routerLink]", inputs: ["target", "queryParams", "fragment", "queryParamsHandling", "state", "info", "relativeTo", "preserveFragment", "skipLocationChange", "replaceUrl", "routerLink"] }, { kind: "pipe", type: i13.TranslocoPipe, name: "transloco" }] }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.6", ngImport: i0, type: ProductsListComponent, decorators: [{
             type: Component,
-            args: [{ selector: 'pw-admin-products-list', standalone: false, template: "<div class=\"col-xs-12 text-end d-flex justify-content-between align-items-center\">\n  <h2 class=\"card-title p-0 float-start\">Products</h2>\n  <button *rbacAllow=\"'Pages.Admin.Product.Create'\"\n    class=\"btn btn-sm btn-outline-primary\"\n    [routerLink]=\"[routers.productDetails + 'add']\">\n    <i class=\"fa fa-plus-circle\" aria-hidden=\"true\"></i> Setup New Product\n  </button>\n</div>\n@if (loading) {\n  <div class=\"w-100 text-center mt-3\">\n    <p-progressSpinner> </p-progressSpinner>\n  </div>\n}\n<div class=\"primeng-datatable-container actions-collapsed table-responsive mt-0\"\n  [class.hideTable]=\"totalRecordsUnFiltered === 0\">\n  <p-table #dt\n    [value]=\"products\"\n    [paginator]=\"totalRecords !== 0\"\n    [lazy]=\"true\"\n    [rows]=\"PAGE_SIZE\"\n    [totalRecords]=\"totalRecords\"\n    [loading]=\"loading\"\n    [filterDelay]=\"1000\"\n    (onLazyLoad)=\"onLazyLoad($event)\"\n    [customSort]=\"true\">\n    <ng-template pTemplate=\"caption\">\n      <div class=\"search-filter\">\n        <div class=\"col-12 col-sm-4\">\n          <p-multiSelect inputId=\"products-list-feature-keys\" placeholder=\"Filter by feature keys\"\n            [options]=\"featureKeysList\"\n            (onChange)=\"onSearchOptionChange($event)\"\n            [showHeader]=\"true\"\n            appendTo=\"body\">\n          </p-multiSelect>\n        </div>\n        <div class=\"text-end\">\n          <label for=\"products-list-search\" class=\"visually-hidden\">Search Product</label>\n          <p-iconfield iconPosition=\"left\">\n            <p-inputicon><i class=\"fa fa-search\" aria-hidden=\"true\"></i></p-inputicon>\n            <input type=\"text\"\n              id=\"products-list-search\"\n              name=\"products-list-search\"\n              [(ngModel)]=\"searchText\"\n              pInputText\n              placeholder=\"Search Product...\"\n              (input)=\"dt.filterGlobal($event.target.value, 'contains')\" />\n          </p-iconfield>\n        </div>\n      </div>\n    </ng-template>\n    <ng-template pTemplate=\"header\">\n      <tr class=\"head\">\n        <th scope=\"true\"\n          pSortableColumn=\"name\">\n          {{ 'Label.Name' | transloco }}\n          <p-sortIcon field=\"name\"></p-sortIcon>\n        </th>\n        <th scope=\"true\"\n          pSortableColumn=\"stripe_plan_id\">\n          {{ 'Admin.Products.StripePlan' | transloco }}\n          <p-sortIcon field=\"stripe_plan_id\"></p-sortIcon>\n        </th>\n        <th scope=\"true\"\n          pSortableColumn=\"permission_key\">\n          {{ 'Admin.Products.PermissionKey' | transloco }}\n          <p-sortIcon field=\"permission_key\"></p-sortIcon>\n        </th>\n        <th scope=\"true\"\n          pSortableColumn=\"feature_key\">\n          {{ 'Admin.Products.FeatureKey' | transloco }}\n          <p-sortIcon field=\"feature_key\"></p-sortIcon>\n        </th>\n        <th scope=\"true\"\n          pSortableColumn=\"product_key\">\n          {{ 'Admin.Products.ProductKey' | transloco }}\n          <p-sortIcon field=\"product_key\"></p-sortIcon>\n        </th>\n        <th scope=\"true\"\n          pSortableColumn=\"category\">\n          {{ 'Admin.Products.Category' | transloco }}\n          <p-sortIcon field=\"category\"></p-sortIcon>\n        </th>\n        <th scope=\"true\"\n          pSortableColumn=\"region\">\n          {{ 'Admin.Products.Region' | transloco }}\n          <p-sortIcon field=\"region\"></p-sortIcon>\n        </th>\n        <th scope=\"true\"\n          pSortableColumn=\"currency\">\n          {{ 'Admin.Products.Currency' | transloco }}\n          <p-sortIcon field=\"currency\"></p-sortIcon>\n        </th>\n        <th scope=\"true\"\n          pSortableColumn=\"price_per_unit\">\n          {{ 'Admin.Products.Price' | transloco }}\n          <p-sortIcon field=\"price_per_unit\"></p-sortIcon>\n        </th>\n        <th scope=\"true\"\n          pSortableColumn=\"active\">\n          {{ 'Label.IsActive' | transloco }}\n          <p-sortIcon field=\"active\"></p-sortIcon>\n        </th>\n        <th scope=\"true\"\n          pSortableColumn=\"billing_frequency\">\n          {{ 'Admin.Products.Billing' | transloco }}\n          <p-sortIcon field=\"billing_frequency\"></p-sortIcon>\n        </th>\n        <th scope=\"true\"\n          class=\"actions-list-two\">{{ 'Label.Actions' | transloco }}</th>\n      </tr>\n    </ng-template>\n    <ng-template pTemplate=\"body\"\n      let-item>\n      <tr>\n        <td data-head=\"Name\">{{ item.name }}</td>\n        <td data-head=\"Stripe Plan\">{{ item.stripe_plan_id }}</td>\n        <td data-head=\"Permission Key\">{{ item.permission_key }}</td>\n        <td data-head=\"Feature Key\">{{ item.feature_key }}</td>\n        <td data-head=\"Product Key\">{{ item.product_key }}</td>\n        <td data-head=\"Category\">\n          <span [appDynamicBadge]=\"{ itemsArray: categories, item: item.category }\"\n            color=\"warning\"\n            class=\"badge\">{{ item.category }}</span>\n        </td>\n        <td data-head=\"Region\">\n          <span [appDynamicBadge]=\"{ itemsArray: regions, item: item.region }\"\n            color=\"cyan\"\n            class=\"badge\">{{ item.region }}</span>\n        </td>\n        <td data-head=\"Currency\">\n          <span [appDynamicBadge]=\"{ itemsArray: currency, item: item.currency }\"\n            color=\"blue-grey\"\n            class=\"badge\">{{ item.currency }}</span>\n        </td>\n        <td data-head=\"Price\">{{ item.price_per_unit }}</td>\n        <td data-head=\"Active\">\n          <span [appDynamicBadge]=\"{ itemsArray: [true, false], item: item?.active }\"\n            color=\"success-danger\"\n            class=\"badge\">{{ item?.active ? 'Yes' : 'No' }}</span>\n        </td>\n        <td data-head=\"Billing\">\n          <span class=\"badge\"\n            [appDynamicBadge]=\"{\n                            itemsArray: billingFrequency,\n                            item: item?.billing_frequency\n                        }\"\n            color=\"blue-grey\">{{ item.billing_frequency }}</span>\n        </td>\n        <td data-head=\"Action\">\n          <ul class=\"list-unstyled list-inline width-max-content\">\n            <li ngbTooltip=\"Edit\"\n              class=\"me-2 me-sm-3\"\n              *rbacAllow=\"'Pages.Admin.Product.Edit'\"\n              [routerLink]=\"[routers.productDetails + item.id]\">\n              <i class=\"fa fa-edit edit-icon\" aria-hidden=\"true\"></i>\n            </li>\n            <li ngbTooltip=\"Delete\"\n              class=\"me-2 me-sm-3\"\n              *rbacAllow=\"'Pages.Admin.Product.Delete'\"\n              (keydown.enter)=\"onDelete(item)\"\n              (click)=\"onDelete(item)\">\n              <i class=\"fa fa-trash delete-icon\" aria-hidden=\"true\"></i>\n            </li>\n            <li ngbTooltip=\"Users List\"\n              class=\"me-2 me-sm-3\"\n              *rbacAllow=\"'Pages.Admin.Product.Edit'\"\n              [routerLink]=\"[routers.productsUserList + item.id]\">\n              <i class=\"fa fa-tasks cta1-icon\" aria-hidden=\"true\"></i>\n            </li>\n            <li ngbTooltip=\"Duplicate The Product\"\n              class=\"me-sm-3\"\n              [routerLink]=\"[routers.productDetails + 'add']\"\n              [queryParams]=\"{ duplicate_product_id: item.id }\">\n              <i class=\"fa fa-clone edit-icon\" aria-hidden=\"true\"></i>\n            </li>\n            <li ngbTooltip=\"Feedback Questions\"\n              container=\"body\"\n              class=\"me-2 me-sm-3\"\n              [routerLink]=\"[routers.feedbackQuestions]\"\n              [queryParams]=\"{ product_id: item.id }\">\n              <i class=\"fa fa-comments edit-icon\" aria-hidden=\"true\"></i>\n            </li>\n          </ul>\n        </td>\n      </tr>\n    </ng-template>\n  </p-table>\n  @if (totalRecords === 0 && totalRecordsUnFiltered !== 0) {\n    <div>\n      <pw-no-data [withImage]=\"true\" [message]=\"'Search.NoDataMessage' | transloco\" [description]=\"'Search.NoDataDescription' | transloco\" >\n      </pw-no-data>\n    </div>\n  }\n  @if (totalRecords !== 0) {\n    <pw-records-summary [showing]=\"dt?.value?.length ?? 0\" [total]=\"totalRecords\" />\n  }\n</div>\n@if (!loading && totalRecordsUnFiltered === 0) {\n  <pw-no-data [withImage]=\"true\" [message]=\"'Admin.Products.NoDataMessage' | transloco\"> </pw-no-data>\n}\n<!-- password validation modal for delete product -->\n<pw-password-validation #passwordValidationModalForProductDelete\n  (successEvent)=\"deleteProduct($event)\">\n  <div class=\"row\">\n    <div class=\"col-12\">\n      <p>{{ 'User.Account.Message.ActionCanNotUndone' | transloco }}</p>\n      <p>{{ 'User.Account.Message.ConfirmPassword' | transloco }}</p>\n    </div>\n  </div>\n</pw-password-validation>\n", styles: ["@charset \"UTF-8\";:root{--first: rgb(23 105 225);--second: rgb(54 194 131);--third: rgb(255 171 0);--text: rgb(34 34 34);--tabs_bg: rgb(23 105 225);--tabs_sub_bg: rgb(70, 136, 236);--tabs_text: rgb(255 255 255);--titles: rgb(34 34 34);--sidebar_bg: rgb(0, 48, 63);--sidebar_text: rgb(255 255 255)}@media(min-width:767px){.table-responsive td,.table-responsive th{font-size:11px!important}}.table-responsive td{padding:6px 10px!important;line-height:1.4;vertical-align:middle;word-break:break-word}.table-responsive th{vertical-align:bottom}.table-responsive td[data-head=Name]{font-weight:600;color:#1a1d21}.table-responsive td[data-head=\"Stripe Plan\"],.table-responsive td[data-head=\"Permission Key\"],.table-responsive td[data-head=\"Feature Key\"],.table-responsive td[data-head=\"Product Key\"]{color:#5a6473;font-variant-numeric:tabular-nums}.table-responsive td[data-head=Price]{white-space:nowrap;font-variant-numeric:tabular-nums;text-align:right}.table-responsive th:nth-child(9){text-align:right}.table-responsive .badge{font-size:11px;font-weight:600;padding:2px 8px;border-radius:4px;letter-spacing:.01em}.table-responsive .badge[class*=bg-success]{background-color:#e6f4ec!important;color:#0f6b3a!important}.table-responsive .badge[class*=bg-danger]{background-color:#fbeae8!important;color:#c0392b!important}.table-responsive .badge.bg-warning{background-color:#efebe6!important;color:#725731!important}.table-responsive .badge.bg-warning-1{background-color:#edefe6!important;color:#627231!important}.table-responsive .badge.bg-warning-2{background-color:#e7efe6!important;color:#367231!important}.table-responsive .badge.bg-warning-3{background-color:#e6efeb!important;color:#317257!important}.table-responsive .badge.bg-warning-4{background-color:#e6edef!important;color:#316272!important}.table-responsive .badge.bg-warning-5{background-color:#e6e7ef!important;color:#313672!important}.table-responsive .badge.bg-warning-6{background-color:#ebe6ef!important;color:#573172!important}.table-responsive .badge.bg-warning-7{background-color:#efe6ed!important;color:#723162!important}.table-responsive .badge.bg-warning-8{background-color:#efe6e7!important;color:#723136!important}.table-responsive .badge.bg-warning-9{background-color:#efebe6!important;color:#725731!important}.table-responsive .badge.bg-warning-10{background-color:#edefe6!important;color:#627231!important}.table-responsive .badge.bg-warning-11{background-color:#e7efe6!important;color:#367231!important}.table-responsive .badge.bg-warning-12{background-color:#e6efeb!important;color:#317257!important}.table-responsive .badge.bg-warning-13{background-color:#e6edef!important;color:#316272!important}.table-responsive .badge.bg-warning-14{background-color:#e6e7ef!important;color:#313672!important}.table-responsive .badge.bg-warning-15{background-color:#ebe6ef!important;color:#573172!important}.table-responsive .badge.bg-warning-16{background-color:#efe6ed!important;color:#723162!important}.table-responsive .badge.bg-warning-17{background-color:#efe6e7!important;color:#723136!important}.table-responsive .badge.bg-warning-18{background-color:#efebe6!important;color:#725731!important}.table-responsive .badge.bg-warning-19{background-color:#edefe6!important;color:#627231!important}.table-responsive .badge.bg-warning-20{background-color:#e7efe6!important;color:#367231!important}.table-responsive .badge.bg-warning-21{background-color:#e6efeb!important;color:#317257!important}.table-responsive .badge.bg-warning-22{background-color:#e6edef!important;color:#316272!important}.table-responsive .badge.bg-warning-23{background-color:#e6e7ef!important;color:#313672!important}.table-responsive .badge.bg-warning-24{background-color:#ebe6ef!important;color:#573172!important}.table-responsive .badge.bg-cyan{background-color:#e6eeef!important;color:#316772!important}.table-responsive .badge.bg-cyan-1{background-color:#e6e8ef!important;color:#313c72!important}.table-responsive .badge.bg-cyan-2{background-color:#ebe6ef!important;color:#523172!important}.table-responsive .badge.bg-cyan-3{background-color:#efe6ee!important;color:#723167!important}.table-responsive .badge.bg-cyan-4{background-color:#efe6e8!important;color:#72313c!important}.table-responsive .badge.bg-cyan-5{background-color:#efebe6!important;color:#725231!important}.table-responsive .badge.bg-cyan-6{background-color:#eeefe6!important;color:#677231!important}.table-responsive .badge.bg-cyan-7{background-color:#e8efe6!important;color:#3c7231!important}.table-responsive .badge.bg-cyan-8{background-color:#e6efeb!important;color:#317252!important}.table-responsive .badge.bg-cyan-9{background-color:#e6eeef!important;color:#316772!important}.table-responsive .badge.bg-cyan-10{background-color:#e6e8ef!important;color:#313c72!important}.table-responsive .badge.bg-cyan-11{background-color:#ebe6ef!important;color:#523172!important}.table-responsive .badge.bg-cyan-12{background-color:#efe6ee!important;color:#723167!important}.table-responsive .badge.bg-cyan-13{background-color:#efe6e8!important;color:#72313c!important}.table-responsive .badge.bg-cyan-14{background-color:#efebe6!important;color:#725231!important}.table-responsive .badge.bg-cyan-15{background-color:#eeefe6!important;color:#677231!important}.table-responsive .badge.bg-cyan-16{background-color:#e8efe6!important;color:#3c7231!important}.table-responsive .badge.bg-cyan-17{background-color:#e6efeb!important;color:#317252!important}.table-responsive .badge.bg-cyan-18{background-color:#e6eeef!important;color:#316772!important}.table-responsive .badge.bg-cyan-19{background-color:#e6e8ef!important;color:#313c72!important}.table-responsive .badge.bg-cyan-20{background-color:#ebe6ef!important;color:#523172!important}.table-responsive .badge.bg-cyan-21{background-color:#efe6ee!important;color:#723167!important}.table-responsive .badge.bg-cyan-22{background-color:#efe6e8!important;color:#72313c!important}.table-responsive .badge.bg-cyan-23{background-color:#efebe6!important;color:#725231!important}.table-responsive .badge.bg-cyan-24{background-color:#eeefe6!important;color:#677231!important}.table-responsive .badge.bg-blue-grey{background-color:#e6e9ef!important;color:#314772!important}.table-responsive .badge.bg-blue-grey-1{background-color:#e9e6ef!important;color:#473172!important}.table-responsive .badge.bg-blue-grey-2{background-color:#efe6ef!important;color:#723172!important}.table-responsive .badge.bg-blue-grey-3{background-color:#efe6e9!important;color:#723147!important}.table-responsive .badge.bg-blue-grey-4{background-color:#efe9e6!important;color:#724731!important}.table-responsive .badge.bg-blue-grey-5{background-color:#efefe6!important;color:#727231!important}.table-responsive .badge.bg-blue-grey-6{background-color:#e9efe6!important;color:#477231!important}.table-responsive .badge.bg-blue-grey-7{background-color:#e6efe9!important;color:#317247!important}.table-responsive .badge.bg-blue-grey-8{background-color:#e6efef!important;color:#317272!important}.table-responsive .badge.bg-blue-grey-9{background-color:#e6e9ef!important;color:#314772!important}.table-responsive .badge.bg-blue-grey-10{background-color:#e9e6ef!important;color:#473172!important}.table-responsive .badge.bg-blue-grey-11{background-color:#efe6ef!important;color:#723172!important}.table-responsive .badge.bg-blue-grey-12{background-color:#efe6e9!important;color:#723147!important}.table-responsive .badge.bg-blue-grey-13{background-color:#efe9e6!important;color:#724731!important}.table-responsive .badge.bg-blue-grey-14{background-color:#efefe6!important;color:#727231!important}.table-responsive .badge.bg-blue-grey-15{background-color:#e9efe6!important;color:#477231!important}.table-responsive .badge.bg-blue-grey-16{background-color:#e6efe9!important;color:#317247!important}.table-responsive .badge.bg-blue-grey-17{background-color:#e6efef!important;color:#317272!important}.table-responsive .badge.bg-blue-grey-18{background-color:#e6e9ef!important;color:#314772!important}.table-responsive .badge.bg-blue-grey-19{background-color:#e9e6ef!important;color:#473172!important}.table-responsive .badge.bg-blue-grey-20{background-color:#efe6ef!important;color:#723172!important}.table-responsive .badge.bg-blue-grey-21{background-color:#efe6e9!important;color:#723147!important}.table-responsive .badge.bg-blue-grey-22{background-color:#efe9e6!important;color:#724731!important}.table-responsive .badge.bg-blue-grey-23{background-color:#efefe6!important;color:#727231!important}.table-responsive .badge.bg-blue-grey-24{background-color:#e9efe6!important;color:#477231!important}.table-responsive .badge.bg-cyan-default{background-color:#e6eeef!important;color:#316772!important}.table-responsive .badge.bg-cyan-default-change{background-color:#e6efeb!important;color:#317252!important}.table-responsive .badge.bg-success:before,.table-responsive .badge.bg-danger:before{content:\"\";display:inline-block;box-sizing:border-box;width:7px;height:7px;margin-right:6px;border-radius:50%;vertical-align:middle}.table-responsive .badge.bg-success:before{background-color:currentColor}.table-responsive .badge.bg-danger:before{background-color:transparent;border:1.5px solid currentColor}.width-max-content{width:max-content}\n"] }]
+            args: [{ selector: 'pw-admin-products-list', standalone: false, template: "<div class=\"col-xs-12 text-end d-flex justify-content-between align-items-center\">\n  <h2 class=\"card-title p-0 float-start\">Products</h2>\n  <button *rbacAllow=\"'Pages.Admin.Product.Create'\"\n    class=\"btn btn-sm btn-outline-primary\"\n    [routerLink]=\"[routers.productDetails + 'add']\">\n    <i class=\"fa fa-plus-circle\" aria-hidden=\"true\"></i> Setup New Product\n  </button>\n</div>\n@if (loading) {\n  <div class=\"w-100 text-center mt-3\">\n    <p-progressSpinner> </p-progressSpinner>\n  </div>\n}\n<div class=\"primeng-datatable-container actions-collapsed table-responsive mt-0\"\n  [class.hideTable]=\"totalRecordsUnFiltered === 0\">\n  <p-table #dt\n    [value]=\"products\"\n    [paginator]=\"totalRecords !== 0\"\n    [lazy]=\"true\"\n    [rows]=\"PAGE_SIZE\"\n    [totalRecords]=\"totalRecords\"\n    [loading]=\"loading\"\n    [filterDelay]=\"1000\"\n    (onLazyLoad)=\"onLazyLoad($event)\"\n    [customSort]=\"true\">\n    <ng-template pTemplate=\"caption\">\n      <div class=\"search-filter\">\n        <div class=\"col-12 col-sm-4\">\n          <p-multiSelect inputId=\"products-list-feature-keys\" placeholder=\"Filter by feature keys\"\n            [options]=\"featureKeysList\"\n            (onChange)=\"onSearchOptionChange($event)\"\n            [showHeader]=\"true\"\n            appendTo=\"body\">\n          </p-multiSelect>\n        </div>\n        <div class=\"text-end\">\n          <label for=\"products-list-search\" class=\"visually-hidden\">Search Product</label>\n          <p-iconfield iconPosition=\"left\">\n            <p-inputicon><i class=\"fa fa-search\" aria-hidden=\"true\"></i></p-inputicon>\n            <input type=\"text\"\n              id=\"products-list-search\"\n              name=\"products-list-search\"\n              [(ngModel)]=\"searchText\"\n              pInputText\n              placeholder=\"Search Product...\"\n              (input)=\"dt.filterGlobal($event.target.value, 'contains')\" />\n          </p-iconfield>\n        </div>\n      </div>\n    </ng-template>\n    <ng-template pTemplate=\"header\">\n      <tr class=\"head\">\n        <th scope=\"true\"\n          pSortableColumn=\"name\">\n          {{ 'Label.Name' | transloco }}\n          <p-sortIcon field=\"name\"></p-sortIcon>\n        </th>\n        <th scope=\"true\"\n          pSortableColumn=\"stripe_plan_id\">\n          {{ 'Admin.Products.StripePlan' | transloco }}\n          <p-sortIcon field=\"stripe_plan_id\"></p-sortIcon>\n        </th>\n        <th scope=\"true\"\n          pSortableColumn=\"permission_key\">\n          {{ 'Admin.Products.PermissionKey' | transloco }}\n          <p-sortIcon field=\"permission_key\"></p-sortIcon>\n        </th>\n        <th scope=\"true\"\n          pSortableColumn=\"feature_key\">\n          {{ 'Admin.Products.FeatureKey' | transloco }}\n          <p-sortIcon field=\"feature_key\"></p-sortIcon>\n        </th>\n        <th scope=\"true\"\n          pSortableColumn=\"product_key\">\n          {{ 'Admin.Products.ProductKey' | transloco }}\n          <p-sortIcon field=\"product_key\"></p-sortIcon>\n        </th>\n        <th scope=\"true\"\n          pSortableColumn=\"category\">\n          {{ 'Admin.Products.Category' | transloco }}\n          <p-sortIcon field=\"category\"></p-sortIcon>\n        </th>\n        <th scope=\"true\"\n          pSortableColumn=\"region\">\n          {{ 'Admin.Products.Region' | transloco }}\n          <p-sortIcon field=\"region\"></p-sortIcon>\n        </th>\n        <th scope=\"true\"\n          pSortableColumn=\"currency\">\n          {{ 'Admin.Products.Currency' | transloco }}\n          <p-sortIcon field=\"currency\"></p-sortIcon>\n        </th>\n        <th scope=\"true\"\n          pSortableColumn=\"price_per_unit\">\n          {{ 'Admin.Products.Price' | transloco }}\n          <p-sortIcon field=\"price_per_unit\"></p-sortIcon>\n        </th>\n        <th scope=\"true\"\n          pSortableColumn=\"active\">\n          {{ 'Label.IsActive' | transloco }}\n          <p-sortIcon field=\"active\"></p-sortIcon>\n        </th>\n        <th scope=\"true\"\n          pSortableColumn=\"billing_frequency\">\n          {{ 'Admin.Products.Billing' | transloco }}\n          <p-sortIcon field=\"billing_frequency\"></p-sortIcon>\n        </th>\n        <th scope=\"true\"\n          class=\"actions-list-two\">{{ 'Label.Actions' | transloco }}</th>\n      </tr>\n    </ng-template>\n    <ng-template pTemplate=\"body\"\n      let-item>\n      <tr>\n        <td data-head=\"Name\">{{ item.name }}</td>\n        <td data-head=\"Stripe Plan\">{{ item.stripe_plan_id }}</td>\n        <td data-head=\"Permission Key\">{{ item.permission_key }}</td>\n        <td data-head=\"Feature Key\">{{ item.feature_key }}</td>\n        <td data-head=\"Product Key\">{{ item.product_key }}</td>\n        <td data-head=\"Category\">\n          <span [appDynamicBadge]=\"{ itemsArray: categories, item: item.category }\"\n            color=\"warning\"\n            class=\"badge\">{{ item.category }}</span>\n        </td>\n        <td data-head=\"Region\">\n          <span [appDynamicBadge]=\"{ itemsArray: regions, item: item.region }\"\n            color=\"cyan\"\n            class=\"badge\">{{ item.region }}</span>\n        </td>\n        <td data-head=\"Currency\">\n          <span [appDynamicBadge]=\"{ itemsArray: currency, item: item.currency }\"\n            color=\"blue-grey\"\n            class=\"badge\">{{ item.currency }}</span>\n        </td>\n        <td data-head=\"Price\">{{ item.price_per_unit }}</td>\n        <td data-head=\"Active\">\n          <span [appDynamicBadge]=\"{ itemsArray: [true, false], item: item?.active }\"\n            color=\"success-danger\"\n            class=\"badge\">{{ item?.active ? 'Yes' : 'No' }}</span>\n        </td>\n        <td data-head=\"Billing\">\n          <span class=\"badge\"\n            [appDynamicBadge]=\"{\n                            itemsArray: billingFrequency,\n                            item: item?.billing_frequency\n                        }\"\n            color=\"blue-grey\">{{ item.billing_frequency }}</span>\n        </td>\n        <td data-head=\"Action\">\n          <ul class=\"list-unstyled list-inline width-max-content\">\n            <li ngbTooltip=\"Edit\"\n              class=\"me-2 me-sm-3\"\n              *rbacAllow=\"'Pages.Admin.Product.Edit'\"\n              [routerLink]=\"[routers.productDetails + item.id]\">\n              <i class=\"fa fa-edit edit-icon\" aria-hidden=\"true\"></i>\n            </li>\n            <li ngbTooltip=\"Delete\"\n              class=\"me-2 me-sm-3\"\n              *rbacAllow=\"'Pages.Admin.Product.Delete'\"\n              (keydown.enter)=\"onDelete(item)\"\n              (click)=\"onDelete(item)\">\n              <i class=\"fa fa-trash delete-icon\" aria-hidden=\"true\"></i>\n            </li>\n            <li ngbTooltip=\"Users List\"\n              class=\"me-2 me-sm-3\"\n              *rbacAllow=\"'Pages.Admin.Product.Edit'\"\n              [routerLink]=\"[routers.productsUserList + item.id]\">\n              <i class=\"fa fa-tasks cta1-icon\" aria-hidden=\"true\"></i>\n            </li>\n            <li ngbTooltip=\"Duplicate The Product\"\n              class=\"me-sm-3\"\n              [routerLink]=\"[routers.productDetails + 'add']\"\n              [queryParams]=\"{ duplicate_product_id: item.id }\">\n              <i class=\"fa fa-clone edit-icon\" aria-hidden=\"true\"></i>\n            </li>\n            <li ngbTooltip=\"Feedback Questions\"\n              container=\"body\"\n              class=\"me-2 me-sm-3\"\n              [routerLink]=\"[routers.feedbackQuestions]\"\n              [queryParams]=\"{ product_id: item.id }\">\n              <i class=\"fa fa-comments edit-icon\" aria-hidden=\"true\"></i>\n            </li>\n          </ul>\n        </td>\n      </tr>\n    </ng-template>\n  </p-table>\n  @if (totalRecords === 0 && totalRecordsUnFiltered !== 0) {\n    <div>\n      <pw-no-data [withImage]=\"true\" [message]=\"'Search.NoDataMessage' | transloco\" [description]=\"'Search.NoDataDescription' | transloco\" >\n      </pw-no-data>\n    </div>\n  }\n  @if (totalRecords !== 0) {\n    <pw-records-summary [showing]=\"dt?.value?.length ?? 0\" [total]=\"totalRecords\" />\n  }\n</div>\n@if (!loading && totalRecordsUnFiltered === 0) {\n  <pw-no-data [withImage]=\"true\" [message]=\"'Admin.Products.NoDataMessage' | transloco\"> </pw-no-data>\n}\n<!-- password validation modal for delete product -->\n<pw-password-validation #passwordValidationModalForProductDelete\n  [destructive]=\"true\"\n  (successEvent)=\"deleteProduct($event)\">\n</pw-password-validation>\n", styles: ["@charset \"UTF-8\";:root{--first: rgb(23 105 225);--second: rgb(54 194 131);--third: rgb(255 171 0);--text: rgb(34 34 34);--tabs_bg: rgb(23 105 225);--tabs_sub_bg: rgb(70, 136, 236);--tabs_text: rgb(255 255 255);--titles: rgb(34 34 34);--sidebar_bg: rgb(0, 48, 63);--sidebar_text: rgb(255 255 255)}.table-responsive td{padding:6px 10px!important;line-height:1.4;vertical-align:middle;word-break:break-word}.table-responsive th{vertical-align:bottom}.table-responsive td[data-head=Name]{font-weight:600;color:#1a1d21}.table-responsive td[data-head=\"Stripe Plan\"],.table-responsive td[data-head=\"Permission Key\"],.table-responsive td[data-head=\"Feature Key\"],.table-responsive td[data-head=\"Product Key\"]{color:#5a6473;font-variant-numeric:tabular-nums}.table-responsive td[data-head=Price]{white-space:nowrap;font-variant-numeric:tabular-nums;text-align:right}.table-responsive th:nth-child(9){text-align:right}.table-responsive .badge{font-size:11px;font-weight:600;padding:2px 8px;border-radius:4px;letter-spacing:.01em}.table-responsive .badge[class*=bg-success]{background-color:#e6f4ec!important;color:#0f6b3a!important}.table-responsive .badge[class*=bg-danger]{background-color:#fbeae8!important;color:#c0392b!important}.table-responsive .badge.bg-warning{background-color:#efebe6!important;color:#725731!important}.table-responsive .badge.bg-warning-1{background-color:#edefe6!important;color:#627231!important}.table-responsive .badge.bg-warning-2{background-color:#e7efe6!important;color:#367231!important}.table-responsive .badge.bg-warning-3{background-color:#e6efeb!important;color:#317257!important}.table-responsive .badge.bg-warning-4{background-color:#e6edef!important;color:#316272!important}.table-responsive .badge.bg-warning-5{background-color:#e6e7ef!important;color:#313672!important}.table-responsive .badge.bg-warning-6{background-color:#ebe6ef!important;color:#573172!important}.table-responsive .badge.bg-warning-7{background-color:#efe6ed!important;color:#723162!important}.table-responsive .badge.bg-warning-8{background-color:#efe6e7!important;color:#723136!important}.table-responsive .badge.bg-warning-9{background-color:#efebe6!important;color:#725731!important}.table-responsive .badge.bg-warning-10{background-color:#edefe6!important;color:#627231!important}.table-responsive .badge.bg-warning-11{background-color:#e7efe6!important;color:#367231!important}.table-responsive .badge.bg-warning-12{background-color:#e6efeb!important;color:#317257!important}.table-responsive .badge.bg-warning-13{background-color:#e6edef!important;color:#316272!important}.table-responsive .badge.bg-warning-14{background-color:#e6e7ef!important;color:#313672!important}.table-responsive .badge.bg-warning-15{background-color:#ebe6ef!important;color:#573172!important}.table-responsive .badge.bg-warning-16{background-color:#efe6ed!important;color:#723162!important}.table-responsive .badge.bg-warning-17{background-color:#efe6e7!important;color:#723136!important}.table-responsive .badge.bg-warning-18{background-color:#efebe6!important;color:#725731!important}.table-responsive .badge.bg-warning-19{background-color:#edefe6!important;color:#627231!important}.table-responsive .badge.bg-warning-20{background-color:#e7efe6!important;color:#367231!important}.table-responsive .badge.bg-warning-21{background-color:#e6efeb!important;color:#317257!important}.table-responsive .badge.bg-warning-22{background-color:#e6edef!important;color:#316272!important}.table-responsive .badge.bg-warning-23{background-color:#e6e7ef!important;color:#313672!important}.table-responsive .badge.bg-warning-24{background-color:#ebe6ef!important;color:#573172!important}.table-responsive .badge.bg-cyan{background-color:#e6eeef!important;color:#316772!important}.table-responsive .badge.bg-cyan-1{background-color:#e6e8ef!important;color:#313c72!important}.table-responsive .badge.bg-cyan-2{background-color:#ebe6ef!important;color:#523172!important}.table-responsive .badge.bg-cyan-3{background-color:#efe6ee!important;color:#723167!important}.table-responsive .badge.bg-cyan-4{background-color:#efe6e8!important;color:#72313c!important}.table-responsive .badge.bg-cyan-5{background-color:#efebe6!important;color:#725231!important}.table-responsive .badge.bg-cyan-6{background-color:#eeefe6!important;color:#677231!important}.table-responsive .badge.bg-cyan-7{background-color:#e8efe6!important;color:#3c7231!important}.table-responsive .badge.bg-cyan-8{background-color:#e6efeb!important;color:#317252!important}.table-responsive .badge.bg-cyan-9{background-color:#e6eeef!important;color:#316772!important}.table-responsive .badge.bg-cyan-10{background-color:#e6e8ef!important;color:#313c72!important}.table-responsive .badge.bg-cyan-11{background-color:#ebe6ef!important;color:#523172!important}.table-responsive .badge.bg-cyan-12{background-color:#efe6ee!important;color:#723167!important}.table-responsive .badge.bg-cyan-13{background-color:#efe6e8!important;color:#72313c!important}.table-responsive .badge.bg-cyan-14{background-color:#efebe6!important;color:#725231!important}.table-responsive .badge.bg-cyan-15{background-color:#eeefe6!important;color:#677231!important}.table-responsive .badge.bg-cyan-16{background-color:#e8efe6!important;color:#3c7231!important}.table-responsive .badge.bg-cyan-17{background-color:#e6efeb!important;color:#317252!important}.table-responsive .badge.bg-cyan-18{background-color:#e6eeef!important;color:#316772!important}.table-responsive .badge.bg-cyan-19{background-color:#e6e8ef!important;color:#313c72!important}.table-responsive .badge.bg-cyan-20{background-color:#ebe6ef!important;color:#523172!important}.table-responsive .badge.bg-cyan-21{background-color:#efe6ee!important;color:#723167!important}.table-responsive .badge.bg-cyan-22{background-color:#efe6e8!important;color:#72313c!important}.table-responsive .badge.bg-cyan-23{background-color:#efebe6!important;color:#725231!important}.table-responsive .badge.bg-cyan-24{background-color:#eeefe6!important;color:#677231!important}.table-responsive .badge.bg-blue-grey{background-color:#e6e9ef!important;color:#314772!important}.table-responsive .badge.bg-blue-grey-1{background-color:#e9e6ef!important;color:#473172!important}.table-responsive .badge.bg-blue-grey-2{background-color:#efe6ef!important;color:#723172!important}.table-responsive .badge.bg-blue-grey-3{background-color:#efe6e9!important;color:#723147!important}.table-responsive .badge.bg-blue-grey-4{background-color:#efe9e6!important;color:#724731!important}.table-responsive .badge.bg-blue-grey-5{background-color:#efefe6!important;color:#727231!important}.table-responsive .badge.bg-blue-grey-6{background-color:#e9efe6!important;color:#477231!important}.table-responsive .badge.bg-blue-grey-7{background-color:#e6efe9!important;color:#317247!important}.table-responsive .badge.bg-blue-grey-8{background-color:#e6efef!important;color:#317272!important}.table-responsive .badge.bg-blue-grey-9{background-color:#e6e9ef!important;color:#314772!important}.table-responsive .badge.bg-blue-grey-10{background-color:#e9e6ef!important;color:#473172!important}.table-responsive .badge.bg-blue-grey-11{background-color:#efe6ef!important;color:#723172!important}.table-responsive .badge.bg-blue-grey-12{background-color:#efe6e9!important;color:#723147!important}.table-responsive .badge.bg-blue-grey-13{background-color:#efe9e6!important;color:#724731!important}.table-responsive .badge.bg-blue-grey-14{background-color:#efefe6!important;color:#727231!important}.table-responsive .badge.bg-blue-grey-15{background-color:#e9efe6!important;color:#477231!important}.table-responsive .badge.bg-blue-grey-16{background-color:#e6efe9!important;color:#317247!important}.table-responsive .badge.bg-blue-grey-17{background-color:#e6efef!important;color:#317272!important}.table-responsive .badge.bg-blue-grey-18{background-color:#e6e9ef!important;color:#314772!important}.table-responsive .badge.bg-blue-grey-19{background-color:#e9e6ef!important;color:#473172!important}.table-responsive .badge.bg-blue-grey-20{background-color:#efe6ef!important;color:#723172!important}.table-responsive .badge.bg-blue-grey-21{background-color:#efe6e9!important;color:#723147!important}.table-responsive .badge.bg-blue-grey-22{background-color:#efe9e6!important;color:#724731!important}.table-responsive .badge.bg-blue-grey-23{background-color:#efefe6!important;color:#727231!important}.table-responsive .badge.bg-blue-grey-24{background-color:#e9efe6!important;color:#477231!important}.table-responsive .badge.bg-cyan-default{background-color:#e6eeef!important;color:#316772!important}.table-responsive .badge.bg-cyan-default-change{background-color:#e6efeb!important;color:#317252!important}.table-responsive .badge.bg-success:before,.table-responsive .badge.bg-danger:before{content:\"\";display:inline-block;box-sizing:border-box;width:7px;height:7px;margin-right:6px;border-radius:50%;vertical-align:middle}.table-responsive .badge.bg-success:before{background-color:currentColor}.table-responsive .badge.bg-danger:before{background-color:transparent;border:1.5px solid currentColor}.width-max-content{width:max-content}\n"] }]
         }], ctorParameters: () => [{ type: i1$1.ProductService }, { type: i1$1.AuthService }, { type: i0.Injector }, { type: i0.ChangeDetectorRef }], propDecorators: { passwordValidationModalForProductDelete: [{
                 type: ViewChild,
                 args: ['passwordValidationModalForProductDelete', { static: false }]
@@ -6051,10 +6051,10 @@ class ResourceAdminDetailsComponent extends AppBaseComponent {
         delete data.id;
         this.adminService
             .addPost(data)
-            .subscribe(response => {
+            .pipe(switchMap(response => this.postTags(response.id)))
+            .subscribe(() => {
             this.toast.success(this.translation.translate('Resource.AddedMessage'));
             this.back();
-            this.postTags(response.id);
             this.cdr.markForCheck();
         })
             .add(() => {
@@ -6126,9 +6126,9 @@ class ResourceAdminDetailsComponent extends AppBaseComponent {
         }
     }
     updatePost(data) {
-        this.postTags(this.blog.id);
         this.adminService
             .updatePost(data, this.id)
+            .pipe(switchMap(() => this.postTags(this.blog.id)))
             .subscribe(() => {
             this.toast.success(this.translation.translate('Resource.UpdatedMessage'));
             this.navigateToResourceList({ resetSearch: true });
@@ -6177,18 +6177,15 @@ class ResourceAdminDetailsComponent extends AppBaseComponent {
         this.tagsSuggestion = values;
     }
     postTags(id) {
-        if (this.selectedTags.length > 0) {
-            const data = {
-                entity_tags: this.selectedTags.map(item => {
-                    const tag = {};
-                    tag['tag_id'] = item.id;
-                    return tag;
-                }),
-                slug: id,
-                tag_entity: TAG_ENTITY.POST
-            };
-            this.tagService.addTags(data).subscribe();
+        if (this.selectedTags.length === 0) {
+            return of(null);
         }
+        const data = {
+            entity_tags: this.selectedTags.map(item => ({ tag_id: item.id })),
+            slug: id,
+            tag_entity: TAG_ENTITY.POST
+        };
+        return this.tagService.addTags(data);
     }
     /**
      * Gets the list of members for the subscription to populate the Author dropdown
@@ -7026,7 +7023,7 @@ class SubscriptionUsersComponent extends AppBaseComponent {
         });
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.6", ngImport: i0, type: SubscriptionUsersComponent, deps: [{ token: i1$1.SubscriptionService }, { token: i0.Injector }, { token: i0.ChangeDetectorRef }, { token: i1$1.AuthService }, { token: i1$1.WindowService }, { token: i1.AdminService }, { token: i1$1.CustomToastService }], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.6", type: SubscriptionUsersComponent, isStandalone: false, selector: "pw-subscription-users", viewQueries: [{ propertyName: "passwordValidationModalForImpersonate", first: true, predicate: ["passwordValidationModalForImpersonate"], descendants: true }, { propertyName: "passwordValidationModalForUserDelete", first: true, predicate: ["passwordValidationModalForUserDelete"], descendants: true }, { propertyName: "passwordValidationModalForRemove2fa", first: true, predicate: ["passwordValidationModalForRemove2fa"], descendants: true }], usesInheritance: true, ngImport: i0, template: "<div class=\"w-100 text-center mt-3\">\n  @if (!isLoaded) {\n    <p-progressSpinner></p-progressSpinner>\n  }\n</div>\n@if (!isAddEnabled && canShowSubscriptionActions && isUserSubscriptionSuperAdmin) {\n  <div class=\"text-end mb-2\">\n    <button class=\"btn btn-sm btn-outline-primary\" (click)=\"isAddEnabled = true\">\n      <i class=\"fa fa-plus-circle\" aria-hidden=\"true\"></i> Add Members\n    </button>\n  </div>\n}\n@if (!isAddEnabled) {\n  <section id=\"members\"\n    >\n    <div [class.hideTable]=\"totalUnfilteredCount === 0\"\n      class=\"primeng-datatable-container actions-collapsed table-responsive mt-0\">\n      <p-table #dt\n        [value]=\"subscriptionMembers\"\n        [paginator]=\"totalRecords !== 0\"\n        [rows]=\"PAGE_SIZE\"\n        [lazy]=\"true\"\n        [totalRecords]=\"totalRecords\"\n        [loading]=\"loading\"\n        [filterDelay]=\"1000\"\n        [customSort]=\"true\"\n        (onLazyLoad)=\"onLazyLoad($event)\">\n        <ng-template pTemplate=\"caption\">\n          <div class=\"text-end\">\n            <label for=\"subscription-users-search\" class=\"visually-hidden\">Search subscription users</label>\n            <p-iconfield iconPosition=\"left\">\n              <p-inputicon><i class=\"fa fa-search\" aria-hidden=\"true\"></i></p-inputicon>\n              <input id=\"subscription-users-search\"\n                name=\"subscription-users-search\"\n                [(ngModel)]=\"searchText\"\n                (input)=\"dt.filterGlobal($event.target.value, 'contains')\"\n                type=\"text\"\n                pInputText\n                placeholder=\"Search subscription users...\" />\n            </p-iconfield>\n          </div>\n        </ng-template>\n        <ng-template pTemplate=\"header\">\n          <tr>\n            <th scope=\"true\"\n              pSortableColumn=\"id\">\n              {{ 'Admin.Users.Id' | transloco }}\n              <p-sortIcon field=\"id\"></p-sortIcon>\n            </th>\n            <th scope=\"true\"\n              pSortableColumn=\"first_name\">\n              {{ 'Label.FirstName' | transloco }}\n            </th>\n            <th scope=\"true\"\n              pSortableColumn=\"last_name\">\n              {{ 'Label.LastName' | transloco }}\n              <p-sortIcon field=\"last_name\"></p-sortIcon>\n            </th>\n            <th scope=\"true\"\n              pSortableColumn=\"email\">\n              {{ 'Label.Email' | transloco }}\n              <p-sortIcon field=\"email\"></p-sortIcon>\n            </th>\n            <th scope=\"true\"\n              pSortableColumn=\"slug\">\n              {{ 'Admin.Subscriptions.NickName' | transloco }}\n              <p-sortIcon field=\"slug\"></p-sortIcon>\n            </th>\n            <th scope=\"true\"\n              pSortableColumn=\"has_password\">\n              {{ 'Admin.Subscriptions.EmailConfirmed' | transloco }}\n              <p-sortIcon field=\"has_password\"></p-sortIcon>\n            </th>\n            <th scope=\"true\"\n              pSortableColumn=\"last_sign_in_at\">\n              {{ 'Admin.Subscriptions.LastLogin' | transloco }}\n              <p-sortIcon field=\"last_sign_in_at\"></p-sortIcon>\n            </th>\n            <th scope=\"true\" class=\"actions-list-two\">\n              {{ 'Label.Actions' | transloco }}\n            </th>\n          </tr>\n        </ng-template>\n        <ng-template pTemplate=\"body\"\n          let-user>\n          <tr>\n            <td data-head=\"Id\">{{ user.id }}</td>\n            <td data-head=\"First Name\">\n              <span class=\"first-name\">{{ user.first_name }}</span>\n              @if (subscriptionOwnerUserId === user.id) {\n                <span *rbacAllow=\"'Pages.Alpha'\" class=\"badge bg-primary mx-1\"> Owner </span>\n              }\n              @if (subscriptionAdmins?.includes(user?.id)) {\n                <span class=\"badge bg-success mx-1 admin-badge\"> Admin </span>\n              }\n            </td>\n            <td data-head=\"Last Name\">\n              {{ user.last_name }}\n              @if (user?.alpha) {\n                <span\n                  [pTooltip]=\"'Admin.Users.Tooltip.AlphaIcon'|transloco\"\n                  tooltipPosition=\"top\">\n                  <i class=\"fa-regular fa-square-a alpha-beta text-warning\"></i>\n                </span>\n              }\n              @if (user?.beta) {\n                <span\n                  [pTooltip]=\"'Admin.Users.Tooltip.BetaIcon'|transloco\"\n                  class=\"ms-2\"\n                  tooltipPosition=\"top\">\n                  <i class=\"fa-regular fa-square-b alpha-beta text-primary\"></i>\n                </span>\n              }\n              @if (user?.cognito_sso_activated) {\n                <span\n                  class=\"ms-2\"\n                  [pTooltip]=\"'Admin.Users.Tooltip.Cognito' | transloco\"\n                  tooltipPosition=\"top\">\n                  <i class=\"fa fa-cloud success\" ></i>\n                </span>\n              }\n            </td>\n            <td data-head=\"Email\">{{ user.email }}</td>\n            <td data-head=\"Nick Name\">\n              <a [routerLink]=\"['/members', user.slug]\">{{ user.slug }}</a>\n            </td>\n            <td data-head=\"Email Confirm\">\n              <span [appDynamicBadge]=\"{ itemsArray: [true, false], item: user?.has_password }\"\n                color=\"success-danger\"\n                class=\"badge\">\n                {{ user?.has_password ? 'Yes' : 'No' }}\n              </span>\n              @if (user?.blocked) {\n                <span\n                  [pTooltip]=\"'This user has been blocked'\"\n                  class=\"ms-2\"\n                  tooltipPosition=\"top\">\n                  <i class=\"fa-solid fa-hexagon-exclamation text-danger hexa-warning\"></i>\n                </span>\n              }\n            </td>\n            <td data-head=\"Last Login\">\n              @if (user?.current_sign_in_at) {\n                <span>\n                  <span>\n                    {{ user.current_sign_in_at | dateFormat }}\n                  </span>\n                  @if (user.current_sign_in_at) {\n                    <span>\n                      &nbsp;({{ user.current_sign_in_at | sinceAgo }})\n                    </span>\n                  }\n                </span>\n              } @else {\n                <span>\n                  <span>\n                    {{ user.last_sign_in_at | dateFormat }}\n                  </span>\n                  @if (user.last_sign_in_at) {\n                    <span>\n                      &nbsp;({{ user.last_sign_in_at | sinceAgo }})\n                    </span>\n                  }\n                </span>\n              }\n            </td>\n            <td data-head=\"Action\">\n              <ul class=\"list-unstyled list-inline list-action\">\n                <li *rbacAllow=\"'Pages.Alpha'\" ngbTooltip=\"Impersonate this user\" class=\"me-2 me-sm-3\">\n                  <i (click)=\"onImpersonate(user)\" (keydown.enter)=\"onImpersonate(user)\"  class=\"fas fa-people-arrows fa-lg\" aria-hidden=\"true\"></i>\n                </li>\n                @if (subscriptionOwnerUserId !== user.id) {\n                  <li *rbacAllow=\"'Pages.Alpha'\" ngbTooltip=\"Set this user as new owner\" class=\"me-2 me-sm-3\">\n                    <i (click)=\"onChangeOwner(user)\" (keydown.enter)=\"onChangeOwner(user)\"  class=\"fa fa-key warning fa-lg\" aria-hidden=\"true\"></i>\n                  </li>\n                }\n                @if (user?.enable_two_factor_authenticator) {\n                  <li *rbacAllow=\"'Pages.Alpha'\"\n                    (click)=\"disable2fa(user?.id)\"\n                    (keydown.enter)=\"disable2fa(user?.id)\"\n                    ngbTooltip=\"Disable 2FA\"\n                    class=\"me-2 me-sm-3 success\">\n                    <i class=\"fa fa-lock\"\n                    aria-hidden=\"true\"></i>\n                  </li>\n                }\n                @if (canShowSubscriptionActions && isUserSubscriptionSuperAdmin) {\n                  <!-- Make Admin -->\n                  @if (!subscriptionAdmins?.includes(user.id)) {\n                    <li ngbTooltip=\"Make Admin\"\n                      class=\"me-2 me-sm-3 mx-2\"\n                      >\n                      <i\n                        class=\"fa fa-user-crown fa-lg success\"\n                        (click)=\"makeAdmin(user, true)\"\n                        (keydown.enter)=\"makeAdmin(users, true)\"\n                        aria-hidden=\"true\"\n                      ></i>\n                    </li>\n                  }\n                  <li></li>\n                  <!-- Remove Admin -->\n                  @if (subscriptionAdmins?.includes(user.id)) {\n                    <li ngbTooltip=\"Remove Admin\"\n                      class=\"me-2 me-sm-3 mx-2\"\n                      >\n                      <i\n                        class=\"fa fa-ban warning fa-lg\"\n                        (keydown.enter)=\"makeAdmin(user, false)\"\n                        (click)=\"makeAdmin(user, false)\"\n                        aria-hidden=\"true\"\n                      ></i>\n                    </li>\n                  }\n                } @else {\n                  <li class=\"mx-3\"></li>\n                }\n                @if (canShowSubscriptionActions) {\n                  <li\n                    [routerLink]=\"[routers.usersDetails + user.id]\"\n                    ngbTooltip=\"Edit\"\n                    class=\"me-2 me-sm-3\">\n                    <i class=\"fa fa-edit edit-icon\"\n                    aria-hidden=\"true\"></i>\n                  </li>\n                }\n                @if (canShowSubscriptionActions && isGranted('Pages.Admin.Users.Delete')) {\n                  <li\n                    ngbTooltip=\"Remove user from subscription\"\n                    class=\"me-2 me-sm-3\">\n                    <i (click)=\"onDelete(user)\"\n                      (keydown.enter)=\"onDelete(user)\"\n                      class=\"fa fa-trash delete-icon\"\n                    aria-hidden=\"true\"></i>\n                  </li>\n                }\n              </ul>\n            </td>\n          </tr>\n        </ng-template>\n      </p-table>\n      @if (totalRecords === 0 && totalUnfilteredCount !== 0) {\n        <div>\n          <pw-no-data [withImage]=\"true\" [message]=\"'Search.NoDataMessage' | transloco\" [description]=\"'Search.NoDataDescription' | transloco\" >\n          </pw-no-data>\n        </div>\n      }\n      @if (totalRecords !== 0) {\n        <pw-records-summary [showing]=\"dt?.value?.length ?? 0\" [total]=\"totalRecords\" />\n      }\n    </div>\n    @if (totalUnfilteredCount === 0 && isLoaded) {\n      <div>\n        <pw-no-data [withImage]=\"true\" [message]=\"'Admin.Subscriptions.NoSubscriptionUsersMessage' | transloco\">\n        </pw-no-data>\n      </div>\n    }\n  </section>\n}\n\n\n@if (isAddEnabled) {\n  <section id=\"manage-members\"\n    >\n    <pw-add-members (membersAdded)=\"onMembersAdded()\"\n    ></pw-add-members>\n  </section>\n}\n\n<!-- password validation modal for impersonate -->\n<pw-password-validation #passwordValidationModalForImpersonate\n  (successEvent)=\"onUserImpersonation($event)\">\n</pw-password-validation>\n<!-- password validation modal for delete user -->\n\n<!-- password validation modal for remove2fa -->\n<pw-password-validation #passwordValidationModalForRemove2fa\n  (successEvent)=\"remove2fa($event)\">\n</pw-password-validation>\n", styles: [".hexa-warning{font-size:18px;vertical-align:middle}.alpha-beta{font-size:14px}.info-icon{vertical-align:middle;margin-left:5px}.first-name{margin-right:5px}\n"], dependencies: [{ kind: "component", type: i2.Table, selector: "p-table", inputs: ["frozenColumns", "frozenValue", "styleClass", "tableStyle", "tableStyleClass", "paginator", "pageLinks", "rowsPerPageOptions", "alwaysShowPaginator", "paginatorPosition", "paginatorStyleClass", "paginatorDropdownAppendTo", "paginatorDropdownScrollHeight", "currentPageReportTemplate", "showCurrentPageReport", "showJumpToPageDropdown", "showJumpToPageInput", "showFirstLastIcon", "showPageLinks", "defaultSortOrder", "sortMode", "resetPageOnSort", "selectionMode", "selectionPageOnly", "contextMenuSelection", "contextMenuSelectionMode", "dataKey", "metaKeySelection", "rowSelectable", "rowTrackBy", "lazy", "lazyLoadOnInit", "compareSelectionBy", "csvSeparator", "exportFilename", "filters", "globalFilterFields", "filterDelay", "filterLocale", "expandedRowKeys", "editingRowKeys", "rowExpandMode", "scrollable", "rowGroupMode", "scrollHeight", "virtualScroll", "virtualScrollItemSize", "virtualScrollOptions", "virtualScrollDelay", "frozenWidth", "contextMenu", "resizableColumns", "columnResizeMode", "reorderableColumns", "loading", "loadingIcon", "showLoader", "rowHover", "customSort", "showInitialSortBadge", "exportFunction", "exportHeader", "stateKey", "stateStorage", "editMode", "groupRowsBy", "size", "showGridlines", "stripedRows", "groupRowsByOrder", "responsiveLayout", "breakpoint", "paginatorLocale", "value", "columns", "first", "rows", "totalRecords", "sortField", "sortOrder", "multiSortMeta", "selection", "selectAll"], outputs: ["contextMenuSelectionChange", "selectAllChange", "selectionChange", "onRowSelect", "onRowUnselect", "onPage", "onSort", "onFilter", "onLazyLoad", "onRowExpand", "onRowCollapse", "onContextMenuSelect", "onColResize", "onColReorder", "onRowReorder", "onEditInit", "onEditComplete", "onEditCancel", "onHeaderCheckboxToggle", "sortFunction", "firstChange", "rowsChange", "onStateSave", "onStateRestore"] }, { kind: "directive", type: i3$1.PrimeTemplate, selector: "[pTemplate]", inputs: ["type", "pTemplate"] }, { kind: "directive", type: i2.SortableColumn, selector: "[pSortableColumn]", inputs: ["pSortableColumn", "pSortableColumnDisabled"] }, { kind: "component", type: i2.SortIcon, selector: "p-sortIcon", inputs: ["field"] }, { kind: "directive", type: i6$1.Tooltip, selector: "[pTooltip]", inputs: ["tooltipPosition", "tooltipEvent", "positionStyle", "tooltipStyleClass", "tooltipZIndex", "escape", "showDelay", "hideDelay", "life", "positionTop", "positionLeft", "autoHide", "fitContent", "hideOnEscape", "pTooltip", "tooltipDisabled", "tooltipOptions", "appendTo", "ptTooltip", "pTooltipPT", "pTooltipUnstyled"] }, { kind: "directive", type: i4$1.InputText, selector: "[pInputText]", inputs: ["hostName", "ptInputText", "pInputTextPT", "pInputTextUnstyled", "pSize", "variant", "fluid", "invalid"] }, { kind: "component", type: i5$1.IconField, selector: "p-iconfield, p-iconField, p-icon-field", inputs: ["hostName", "iconPosition", "styleClass"] }, { kind: "component", type: i6.InputIcon, selector: "p-inputicon, p-inputIcon", inputs: ["hostName", "styleClass"] }, { kind: "directive", type: i2$1.NgbTooltip, selector: "[ngbTooltip]", inputs: ["animation", "autoClose", "placement", "popperOptions", "triggers", "positionTarget", "container", "disableTooltip", "tooltipClass", "tooltipContext", "openDelay", "closeDelay", "ngbTooltip"], outputs: ["shown", "hidden"], exportAs: ["ngbTooltip"] }, { kind: "directive", type: i9.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { kind: "directive", type: i9.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i9.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "component", type: i10$1.PasswordValidationComponent, selector: "pw-password-validation", inputs: ["confirmMessage"], outputs: ["successEvent"] }, { kind: "component", type: i4.ProgressSpinner, selector: "p-progressSpinner, p-progress-spinner, p-progressspinner", inputs: ["styleClass", "strokeWidth", "fill", "animationDuration", "ariaLabel"] }, { kind: "component", type: i10$1.NoDataComponent, selector: "pw-no-data", inputs: ["message", "description", "withImage"] }, { kind: "component", type: i10$1.RecordsSummaryComponent, selector: "pw-records-summary", inputs: ["showing", "total"] }, { kind: "directive", type: i11.DynamicBadgeDirective, selector: "[appDynamicBadge]", inputs: ["appDynamicBadge", "color", "colorByName", "dataName"] }, { kind: "directive", type: i11.RbacAllowDirective, selector: "[rbacAllow]", inputs: ["rbacAllow"] }, { kind: "directive", type: i12.RouterLink, selector: "[routerLink]", inputs: ["target", "queryParams", "fragment", "queryParamsHandling", "state", "info", "relativeTo", "preserveFragment", "skipLocationChange", "replaceUrl", "routerLink"] }, { kind: "component", type: AddMembersComponent, selector: "pw-add-members", outputs: ["membersAdded"] }, { kind: "pipe", type: i13.TranslocoPipe, name: "transloco" }, { kind: "pipe", type: i17.DateFormatPipe, name: "dateFormat" }, { kind: "pipe", type: i17.SinceAgoPipe, name: "sinceAgo" }] }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.6", type: SubscriptionUsersComponent, isStandalone: false, selector: "pw-subscription-users", viewQueries: [{ propertyName: "passwordValidationModalForImpersonate", first: true, predicate: ["passwordValidationModalForImpersonate"], descendants: true }, { propertyName: "passwordValidationModalForUserDelete", first: true, predicate: ["passwordValidationModalForUserDelete"], descendants: true }, { propertyName: "passwordValidationModalForRemove2fa", first: true, predicate: ["passwordValidationModalForRemove2fa"], descendants: true }], usesInheritance: true, ngImport: i0, template: "<div class=\"w-100 text-center mt-3\">\n  @if (!isLoaded) {\n    <p-progressSpinner></p-progressSpinner>\n  }\n</div>\n@if (!isAddEnabled && canShowSubscriptionActions && isUserSubscriptionSuperAdmin) {\n  <div class=\"text-end mb-2\">\n    <button class=\"btn btn-sm btn-outline-primary\" (click)=\"isAddEnabled = true\">\n      <i class=\"fa fa-plus-circle\" aria-hidden=\"true\"></i> Add Members\n    </button>\n  </div>\n}\n@if (!isAddEnabled) {\n  <section id=\"members\"\n    >\n    <div [class.hideTable]=\"totalUnfilteredCount === 0\"\n      class=\"primeng-datatable-container actions-collapsed table-responsive mt-0\">\n      <p-table #dt\n        [value]=\"subscriptionMembers\"\n        [paginator]=\"totalRecords !== 0\"\n        [rows]=\"PAGE_SIZE\"\n        [lazy]=\"true\"\n        [totalRecords]=\"totalRecords\"\n        [loading]=\"loading\"\n        [filterDelay]=\"1000\"\n        [customSort]=\"true\"\n        (onLazyLoad)=\"onLazyLoad($event)\">\n        <ng-template pTemplate=\"caption\">\n          <div class=\"text-end\">\n            <label for=\"subscription-users-search\" class=\"visually-hidden\">Search subscription users</label>\n            <p-iconfield iconPosition=\"left\">\n              <p-inputicon><i class=\"fa fa-search\" aria-hidden=\"true\"></i></p-inputicon>\n              <input id=\"subscription-users-search\"\n                name=\"subscription-users-search\"\n                [(ngModel)]=\"searchText\"\n                (input)=\"dt.filterGlobal($event.target.value, 'contains')\"\n                type=\"text\"\n                pInputText\n                placeholder=\"Search subscription users...\" />\n            </p-iconfield>\n          </div>\n        </ng-template>\n        <ng-template pTemplate=\"header\">\n          <tr>\n            <th scope=\"true\"\n              pSortableColumn=\"id\">\n              {{ 'Admin.Users.Id' | transloco }}\n              <p-sortIcon field=\"id\"></p-sortIcon>\n            </th>\n            <th scope=\"true\"\n              pSortableColumn=\"first_name\">\n              {{ 'Label.FirstName' | transloco }}\n            </th>\n            <th scope=\"true\"\n              pSortableColumn=\"last_name\">\n              {{ 'Label.LastName' | transloco }}\n              <p-sortIcon field=\"last_name\"></p-sortIcon>\n            </th>\n            <th scope=\"true\"\n              pSortableColumn=\"email\">\n              {{ 'Label.Email' | transloco }}\n              <p-sortIcon field=\"email\"></p-sortIcon>\n            </th>\n            <th scope=\"true\"\n              pSortableColumn=\"slug\">\n              {{ 'Admin.Subscriptions.NickName' | transloco }}\n              <p-sortIcon field=\"slug\"></p-sortIcon>\n            </th>\n            <th scope=\"true\"\n              pSortableColumn=\"has_password\">\n              {{ 'Admin.Subscriptions.EmailConfirmed' | transloco }}\n              <p-sortIcon field=\"has_password\"></p-sortIcon>\n            </th>\n            <th scope=\"true\"\n              pSortableColumn=\"last_sign_in_at\">\n              {{ 'Admin.Subscriptions.LastLogin' | transloco }}\n              <p-sortIcon field=\"last_sign_in_at\"></p-sortIcon>\n            </th>\n            <th scope=\"true\" class=\"actions-list-two\">\n              {{ 'Label.Actions' | transloco }}\n            </th>\n          </tr>\n        </ng-template>\n        <ng-template pTemplate=\"body\"\n          let-user>\n          <tr>\n            <td data-head=\"Id\">{{ user.id }}</td>\n            <td data-head=\"First Name\">\n              <span class=\"first-name\">{{ user.first_name }}</span>\n              @if (subscriptionOwnerUserId === user.id) {\n                <span *rbacAllow=\"'Pages.Alpha'\" class=\"badge bg-primary mx-1\"> Owner </span>\n              }\n              @if (subscriptionAdmins?.includes(user?.id)) {\n                <span class=\"badge bg-success mx-1 admin-badge\"> Admin </span>\n              }\n            </td>\n            <td data-head=\"Last Name\">\n              {{ user.last_name }}\n              @if (user?.alpha) {\n                <span\n                  [pTooltip]=\"'Admin.Users.Tooltip.AlphaIcon'|transloco\"\n                  tooltipPosition=\"top\">\n                  <i class=\"fa-regular fa-square-a alpha-beta text-warning\"></i>\n                </span>\n              }\n              @if (user?.beta) {\n                <span\n                  [pTooltip]=\"'Admin.Users.Tooltip.BetaIcon'|transloco\"\n                  class=\"ms-2\"\n                  tooltipPosition=\"top\">\n                  <i class=\"fa-regular fa-square-b alpha-beta text-primary\"></i>\n                </span>\n              }\n              @if (user?.cognito_sso_activated) {\n                <span\n                  class=\"ms-2\"\n                  [pTooltip]=\"'Admin.Users.Tooltip.Cognito' | transloco\"\n                  tooltipPosition=\"top\">\n                  <i class=\"fa fa-cloud success\" ></i>\n                </span>\n              }\n            </td>\n            <td data-head=\"Email\">{{ user.email }}</td>\n            <td data-head=\"Nick Name\">\n              <a [routerLink]=\"['/members', user.slug]\">{{ user.slug }}</a>\n            </td>\n            <td data-head=\"Email Confirm\">\n              <span [appDynamicBadge]=\"{ itemsArray: [true, false], item: user?.has_password }\"\n                color=\"success-danger\"\n                class=\"badge\">\n                {{ user?.has_password ? 'Yes' : 'No' }}\n              </span>\n              @if (user?.blocked) {\n                <span\n                  [pTooltip]=\"'This user has been blocked'\"\n                  class=\"ms-2\"\n                  tooltipPosition=\"top\">\n                  <i class=\"fa-solid fa-hexagon-exclamation text-danger hexa-warning\"></i>\n                </span>\n              }\n            </td>\n            <td data-head=\"Last Login\">\n              @if (user?.current_sign_in_at) {\n                <span>\n                  <span>\n                    {{ user.current_sign_in_at | dateFormat }}\n                  </span>\n                  @if (user.current_sign_in_at) {\n                    <span>\n                      &nbsp;({{ user.current_sign_in_at | sinceAgo }})\n                    </span>\n                  }\n                </span>\n              } @else {\n                <span>\n                  <span>\n                    {{ user.last_sign_in_at | dateFormat }}\n                  </span>\n                  @if (user.last_sign_in_at) {\n                    <span>\n                      &nbsp;({{ user.last_sign_in_at | sinceAgo }})\n                    </span>\n                  }\n                </span>\n              }\n            </td>\n            <td data-head=\"Action\">\n              <ul class=\"list-unstyled list-inline list-action\">\n                <li *rbacAllow=\"'Pages.Alpha'\" ngbTooltip=\"Impersonate this user\" class=\"me-2 me-sm-3\">\n                  <i (click)=\"onImpersonate(user)\" (keydown.enter)=\"onImpersonate(user)\"  class=\"fas fa-people-arrows fa-lg\" aria-hidden=\"true\"></i>\n                </li>\n                @if (subscriptionOwnerUserId !== user.id) {\n                  <li *rbacAllow=\"'Pages.Alpha'\" ngbTooltip=\"Set this user as new owner\" class=\"me-2 me-sm-3\">\n                    <i (click)=\"onChangeOwner(user)\" (keydown.enter)=\"onChangeOwner(user)\"  class=\"fa fa-key warning fa-lg\" aria-hidden=\"true\"></i>\n                  </li>\n                }\n                @if (user?.enable_two_factor_authenticator) {\n                  <li *rbacAllow=\"'Pages.Alpha'\"\n                    (click)=\"disable2fa(user?.id)\"\n                    (keydown.enter)=\"disable2fa(user?.id)\"\n                    ngbTooltip=\"Disable 2FA\"\n                    class=\"me-2 me-sm-3 success\">\n                    <i class=\"fa fa-lock\"\n                    aria-hidden=\"true\"></i>\n                  </li>\n                }\n                @if (canShowSubscriptionActions && isUserSubscriptionSuperAdmin) {\n                  <!-- Make Admin -->\n                  @if (!subscriptionAdmins?.includes(user.id)) {\n                    <li ngbTooltip=\"Make Admin\"\n                      class=\"me-2 me-sm-3 mx-2\"\n                      >\n                      <i\n                        class=\"fa fa-user-crown fa-lg success\"\n                        (click)=\"makeAdmin(user, true)\"\n                        (keydown.enter)=\"makeAdmin(users, true)\"\n                        aria-hidden=\"true\"\n                      ></i>\n                    </li>\n                  }\n                  <li></li>\n                  <!-- Remove Admin -->\n                  @if (subscriptionAdmins?.includes(user.id)) {\n                    <li ngbTooltip=\"Remove Admin\"\n                      class=\"me-2 me-sm-3 mx-2\"\n                      >\n                      <i\n                        class=\"fa fa-ban warning fa-lg\"\n                        (keydown.enter)=\"makeAdmin(user, false)\"\n                        (click)=\"makeAdmin(user, false)\"\n                        aria-hidden=\"true\"\n                      ></i>\n                    </li>\n                  }\n                } @else {\n                  <li class=\"mx-3\"></li>\n                }\n                @if (canShowSubscriptionActions) {\n                  <li\n                    [routerLink]=\"[routers.usersDetails + user.id]\"\n                    ngbTooltip=\"Edit\"\n                    class=\"me-2 me-sm-3\">\n                    <i class=\"fa fa-edit edit-icon\"\n                    aria-hidden=\"true\"></i>\n                  </li>\n                }\n                @if (canShowSubscriptionActions && isGranted('Pages.Admin.Users.Delete')) {\n                  <li\n                    ngbTooltip=\"Remove user from subscription\"\n                    class=\"me-2 me-sm-3\">\n                    <i (click)=\"onDelete(user)\"\n                      (keydown.enter)=\"onDelete(user)\"\n                      class=\"fa fa-trash delete-icon\"\n                    aria-hidden=\"true\"></i>\n                  </li>\n                }\n              </ul>\n            </td>\n          </tr>\n        </ng-template>\n      </p-table>\n      @if (totalRecords === 0 && totalUnfilteredCount !== 0) {\n        <div>\n          <pw-no-data [withImage]=\"true\" [message]=\"'Search.NoDataMessage' | transloco\" [description]=\"'Search.NoDataDescription' | transloco\" >\n          </pw-no-data>\n        </div>\n      }\n      @if (totalRecords !== 0) {\n        <pw-records-summary [showing]=\"dt?.value?.length ?? 0\" [total]=\"totalRecords\" />\n      }\n    </div>\n    @if (totalUnfilteredCount === 0 && isLoaded) {\n      <div>\n        <pw-no-data [withImage]=\"true\" [message]=\"'Admin.Subscriptions.NoSubscriptionUsersMessage' | transloco\">\n        </pw-no-data>\n      </div>\n    }\n  </section>\n}\n\n\n@if (isAddEnabled) {\n  <section id=\"manage-members\"\n    >\n    <pw-add-members (membersAdded)=\"onMembersAdded()\"\n    ></pw-add-members>\n  </section>\n}\n\n<!-- password validation modal for impersonate -->\n<pw-password-validation #passwordValidationModalForImpersonate\n  (successEvent)=\"onUserImpersonation($event)\">\n</pw-password-validation>\n<!-- password validation modal for delete user -->\n\n<!-- password validation modal for remove2fa -->\n<pw-password-validation #passwordValidationModalForRemove2fa\n  (successEvent)=\"remove2fa($event)\">\n</pw-password-validation>\n", styles: [".hexa-warning{font-size:18px;vertical-align:middle}.alpha-beta{font-size:14px}.info-icon{vertical-align:middle;margin-left:5px}.first-name{margin-right:5px}\n"], dependencies: [{ kind: "component", type: i2.Table, selector: "p-table", inputs: ["frozenColumns", "frozenValue", "styleClass", "tableStyle", "tableStyleClass", "paginator", "pageLinks", "rowsPerPageOptions", "alwaysShowPaginator", "paginatorPosition", "paginatorStyleClass", "paginatorDropdownAppendTo", "paginatorDropdownScrollHeight", "currentPageReportTemplate", "showCurrentPageReport", "showJumpToPageDropdown", "showJumpToPageInput", "showFirstLastIcon", "showPageLinks", "defaultSortOrder", "sortMode", "resetPageOnSort", "selectionMode", "selectionPageOnly", "contextMenuSelection", "contextMenuSelectionMode", "dataKey", "metaKeySelection", "rowSelectable", "rowTrackBy", "lazy", "lazyLoadOnInit", "compareSelectionBy", "csvSeparator", "exportFilename", "filters", "globalFilterFields", "filterDelay", "filterLocale", "expandedRowKeys", "editingRowKeys", "rowExpandMode", "scrollable", "rowGroupMode", "scrollHeight", "virtualScroll", "virtualScrollItemSize", "virtualScrollOptions", "virtualScrollDelay", "frozenWidth", "contextMenu", "resizableColumns", "columnResizeMode", "reorderableColumns", "loading", "loadingIcon", "showLoader", "rowHover", "customSort", "showInitialSortBadge", "exportFunction", "exportHeader", "stateKey", "stateStorage", "editMode", "groupRowsBy", "size", "showGridlines", "stripedRows", "groupRowsByOrder", "responsiveLayout", "breakpoint", "paginatorLocale", "value", "columns", "first", "rows", "totalRecords", "sortField", "sortOrder", "multiSortMeta", "selection", "selectAll"], outputs: ["contextMenuSelectionChange", "selectAllChange", "selectionChange", "onRowSelect", "onRowUnselect", "onPage", "onSort", "onFilter", "onLazyLoad", "onRowExpand", "onRowCollapse", "onContextMenuSelect", "onColResize", "onColReorder", "onRowReorder", "onEditInit", "onEditComplete", "onEditCancel", "onHeaderCheckboxToggle", "sortFunction", "firstChange", "rowsChange", "onStateSave", "onStateRestore"] }, { kind: "directive", type: i3$1.PrimeTemplate, selector: "[pTemplate]", inputs: ["type", "pTemplate"] }, { kind: "directive", type: i2.SortableColumn, selector: "[pSortableColumn]", inputs: ["pSortableColumn", "pSortableColumnDisabled"] }, { kind: "component", type: i2.SortIcon, selector: "p-sortIcon", inputs: ["field"] }, { kind: "directive", type: i6$1.Tooltip, selector: "[pTooltip]", inputs: ["tooltipPosition", "tooltipEvent", "positionStyle", "tooltipStyleClass", "tooltipZIndex", "escape", "showDelay", "hideDelay", "life", "positionTop", "positionLeft", "autoHide", "fitContent", "hideOnEscape", "pTooltip", "tooltipDisabled", "tooltipOptions", "appendTo", "ptTooltip", "pTooltipPT", "pTooltipUnstyled"] }, { kind: "directive", type: i4$1.InputText, selector: "[pInputText]", inputs: ["hostName", "ptInputText", "pInputTextPT", "pInputTextUnstyled", "pSize", "variant", "fluid", "invalid"] }, { kind: "component", type: i5$1.IconField, selector: "p-iconfield, p-iconField, p-icon-field", inputs: ["hostName", "iconPosition", "styleClass"] }, { kind: "component", type: i6.InputIcon, selector: "p-inputicon, p-inputIcon", inputs: ["hostName", "styleClass"] }, { kind: "directive", type: i2$1.NgbTooltip, selector: "[ngbTooltip]", inputs: ["animation", "autoClose", "placement", "popperOptions", "triggers", "positionTarget", "container", "disableTooltip", "tooltipClass", "tooltipContext", "openDelay", "closeDelay", "ngbTooltip"], outputs: ["shown", "hidden"], exportAs: ["ngbTooltip"] }, { kind: "directive", type: i9.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { kind: "directive", type: i9.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i9.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "component", type: i10$1.PasswordValidationComponent, selector: "pw-password-validation", inputs: ["confirmMessage", "destructive"], outputs: ["successEvent"] }, { kind: "component", type: i4.ProgressSpinner, selector: "p-progressSpinner, p-progress-spinner, p-progressspinner", inputs: ["styleClass", "strokeWidth", "fill", "animationDuration", "ariaLabel"] }, { kind: "component", type: i10$1.NoDataComponent, selector: "pw-no-data", inputs: ["message", "description", "withImage"] }, { kind: "component", type: i10$1.RecordsSummaryComponent, selector: "pw-records-summary", inputs: ["showing", "total"] }, { kind: "directive", type: i11.DynamicBadgeDirective, selector: "[appDynamicBadge]", inputs: ["appDynamicBadge", "color", "colorByName", "dataName"] }, { kind: "directive", type: i11.RbacAllowDirective, selector: "[rbacAllow]", inputs: ["rbacAllow"] }, { kind: "directive", type: i12.RouterLink, selector: "[routerLink]", inputs: ["target", "queryParams", "fragment", "queryParamsHandling", "state", "info", "relativeTo", "preserveFragment", "skipLocationChange", "replaceUrl", "routerLink"] }, { kind: "component", type: AddMembersComponent, selector: "pw-add-members", outputs: ["membersAdded"] }, { kind: "pipe", type: i13.TranslocoPipe, name: "transloco" }, { kind: "pipe", type: i17.DateFormatPipe, name: "dateFormat" }, { kind: "pipe", type: i17.SinceAgoPipe, name: "sinceAgo" }] }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.6", ngImport: i0, type: SubscriptionUsersComponent, decorators: [{
             type: Component,
@@ -7686,11 +7683,11 @@ class SubscriptionInsightNpsComponent extends AppBaseComponent {
         super.ngOnDestroy();
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.6", ngImport: i0, type: SubscriptionInsightNpsComponent, deps: [{ token: i1.AdminService }, { token: i0.Injector }, { token: i1$1.CommonService }, { token: i2$1.NgbModal }, { token: i0.ChangeDetectorRef }], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.6", type: SubscriptionInsightNpsComponent, isStandalone: false, selector: "pw-subscription-insight-nps", viewQueries: [{ propertyName: "content", first: true, predicate: ["showComment"], descendants: true, static: true }], usesInheritance: true, ngImport: i0, template: "<app-date-picker\n  [selectedDateRange]=\"selectedDateRange\"\n  [dateRanges]=\"dateRanges\"\n  (dateRangeChange)=\"onDateRangeSelect($event)\">\n</app-date-picker>\n@if (graphLoading) {\n  <div class=\"w-100 text-center mt-3\">\n    <p-progressSpinner strokeWidth=\"2\"> </p-progressSpinner>\n  </div>\n}\n\n@if (graph) {\n  <plotly-plot [data]=\"graph?.data\"\n    [config]=\"graph?.config\"\n  [layout]=\"graph?.layout\" [useResizeHandler]=\"graph? true : false\"></plotly-plot>\n}\n\n<div class=\"row m-0\">\n  <h2 class=\"card-title p-0 my-4\">User Feedbacks</h2>\n</div>\n\n@if (!isLoaded) {\n  <div class=\"w-100 text-center mt-3\"\n    >\n    <p-progressSpinner strokeWidth=\"2\"> </p-progressSpinner>\n  </div>\n}\n<div class=\"primeng-datatable-container actions-collapsed table-responsive mt-0\"\n  [class.hideTable]=\"totalRecords === 0\">\n  <p-table #tt\n    [value]=\"feedbacks\"\n    [paginator]=\"totalRecords !== 0\"\n    [rows]=\"PAGE_SIZE\"\n    [totalRecords]=\"totalRecords\"\n    [loading]=\"loading\"\n    [lazy]=\"true\"\n    (onLazyLoad)=\"onLazyLoad($event)\"\n    [filterDelay]=\"1000\"\n    [customSort]=\"true\">\n    <ng-template pTemplate=\"header\">\n      <tr>\n        <th scope=\"true\"\n          pSortableColumn=\"created_at\">\n          Created At\n          <p-sortIcon field=\"created_at\"></p-sortIcon>\n        </th>\n        <th scope=\"true\">User Name</th>\n        <th scope=\"true\">Product Name</th>\n        <th scope=\"true\">Feedback Question Name</th>\n        <th scope=\"true\">Comment</th>\n        <th scope=\"true\"\n          pSortableColumn=\"value\">\n          Value\n          <p-sortIcon field=\"value\"></p-sortIcon>\n        </th>\n        <th class=\"actions-list-two\"\n        scope=\"true\">Action</th>\n      </tr>\n    </ng-template>\n    <!-- Table Body -->\n    <ng-template pTemplate=\"body\"\n      let-item>\n      <tr>\n        <td data-head=\"created_at\">{{ item?.created_at | dateFormat }}</td>\n        <td data-head=\"user_name\">\n          <a [routerLink]=\"['/members/' + item.user_slug]\">{{ item?.user_name }}</a>\n        </td>\n        <td data-head=\"product_name\">{{ item?.product_name }}</td>\n        <td data-head=\"feedback_question_name\">{{ item?.feedback_question_name }}</td>\n        <td data-head=\"comment\">\n          @if (item?.comment) {\n            <button\n              class=\"btn btn-sm btn-info\"\n              (click)=\"openComment(item?.comment)\">\n              Display\n            </button>\n          }\n        </td>\n        <td data-head=\"value\">\n          <span [ngClass]=\"{'fw-bold text-danger':item?.value <= 6,'fw-bold text-success':item.value>8}\">\n            {{ item?.value }}\n          </span>\n        </td>\n        <td data-head=\"Action\">\n          <ul class=\"list-unstyled list-inline list-action\">\n            @if (currentUser && item.user_id !== currentUser.id) {\n              <li ngbTooltip=\"Send Chat Message\"\n                *rbacAllow=\"'Pages.Chat'\"\n                class=\"me-2 me-sm-3\"\n                [routerLink]=\"['/message']\"\n                [fragment]=\"item.user_slug\">\n                <i class=\"fa fa-comments cta1-icon\" aria-hidden=\"true\"></i>\n              </li>\n            }\n          </ul>\n        </td>\n      </tr>\n    </ng-template>\n  </p-table>\n  @if (totalRecords !== 0) {\n    <pw-records-summary [showing]=\"tt?.value?.length ?? 0\" [total]=\"totalRecords\" />\n  }\n</div>\n@if (totalRecords === 0 && isLoaded) {\n  <div>\n    <pw-no-data [withImage]=\"true\" message=\"No Feedback Found\"> </pw-no-data>\n  </div>\n}\n\n<ng-template #showComment\n  let-modal>\n  <div class=\"modal-header\">\n    <h4 class=\"mb-0\">Comment</h4>\n    <button type=\"button\"\n      class=\"btn-close float-end\"\n      aria-label=\"Close\"\n      (click)=\"modal.dismiss()\">\n\n    </button>\n  </div>\n  <div class=\"modal-body\">\n    <h6 class=\"text-center modal-basic-title\">{{ commentToShow }}</h6>\n  </div>\n</ng-template>\n", dependencies: [{ kind: "component", type: i2.Table, selector: "p-table", inputs: ["frozenColumns", "frozenValue", "styleClass", "tableStyle", "tableStyleClass", "paginator", "pageLinks", "rowsPerPageOptions", "alwaysShowPaginator", "paginatorPosition", "paginatorStyleClass", "paginatorDropdownAppendTo", "paginatorDropdownScrollHeight", "currentPageReportTemplate", "showCurrentPageReport", "showJumpToPageDropdown", "showJumpToPageInput", "showFirstLastIcon", "showPageLinks", "defaultSortOrder", "sortMode", "resetPageOnSort", "selectionMode", "selectionPageOnly", "contextMenuSelection", "contextMenuSelectionMode", "dataKey", "metaKeySelection", "rowSelectable", "rowTrackBy", "lazy", "lazyLoadOnInit", "compareSelectionBy", "csvSeparator", "exportFilename", "filters", "globalFilterFields", "filterDelay", "filterLocale", "expandedRowKeys", "editingRowKeys", "rowExpandMode", "scrollable", "rowGroupMode", "scrollHeight", "virtualScroll", "virtualScrollItemSize", "virtualScrollOptions", "virtualScrollDelay", "frozenWidth", "contextMenu", "resizableColumns", "columnResizeMode", "reorderableColumns", "loading", "loadingIcon", "showLoader", "rowHover", "customSort", "showInitialSortBadge", "exportFunction", "exportHeader", "stateKey", "stateStorage", "editMode", "groupRowsBy", "size", "showGridlines", "stripedRows", "groupRowsByOrder", "responsiveLayout", "breakpoint", "paginatorLocale", "value", "columns", "first", "rows", "totalRecords", "sortField", "sortOrder", "multiSortMeta", "selection", "selectAll"], outputs: ["contextMenuSelectionChange", "selectAllChange", "selectionChange", "onRowSelect", "onRowUnselect", "onPage", "onSort", "onFilter", "onLazyLoad", "onRowExpand", "onRowCollapse", "onContextMenuSelect", "onColResize", "onColReorder", "onRowReorder", "onEditInit", "onEditComplete", "onEditCancel", "onHeaderCheckboxToggle", "sortFunction", "firstChange", "rowsChange", "onStateSave", "onStateRestore"] }, { kind: "directive", type: i3$1.PrimeTemplate, selector: "[pTemplate]", inputs: ["type", "pTemplate"] }, { kind: "directive", type: i2.SortableColumn, selector: "[pSortableColumn]", inputs: ["pSortableColumn", "pSortableColumnDisabled"] }, { kind: "component", type: i2.SortIcon, selector: "p-sortIcon", inputs: ["field"] }, { kind: "component", type: i2$2.PlotlyComponent, selector: "plotly-plot", inputs: ["data", "layout", "config", "frames", "style", "theme", "divId", "revision", "className", "debug", "useResizeHandler", "updateOnLayoutChange", "updateOnDataChange", "updateOnlyWithRevision"], outputs: ["initialized", "update", "purge", "error", "afterExport", "afterPlot", "animated", "animatingFrame", "animationInterrupted", "autoSize", "beforeExport", "beforeHover", "buttonClicked", "click", "plotlyClick", "clickAnnotation", "deselect", "doubleClick", "framework", "hover", "legendClick", "legendDoubleClick", "react", "relayout", "relayouting", "restyle", "redraw", "selected", "selecting", "sliderChange", "sliderEnd", "sliderStart", "sunburstclick", "transitioning", "transitionInterrupted", "unhover", "treemapclick", "webglcontextlost"] }, { kind: "directive", type: i2$1.NgbTooltip, selector: "[ngbTooltip]", inputs: ["animation", "autoClose", "placement", "popperOptions", "triggers", "positionTarget", "container", "disableTooltip", "tooltipClass", "tooltipContext", "openDelay", "closeDelay", "ngbTooltip"], outputs: ["shown", "hidden"], exportAs: ["ngbTooltip"] }, { kind: "directive", type: i3.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "component", type: i10$1.DateRangePickerComponent, selector: "app-date-picker", inputs: ["selectedDateRange", "dateRanges", "inputId"], outputs: ["dateRangeChange"] }, { kind: "component", type: i4.ProgressSpinner, selector: "p-progressSpinner, p-progress-spinner, p-progressspinner", inputs: ["styleClass", "strokeWidth", "fill", "animationDuration", "ariaLabel"] }, { kind: "component", type: i10$1.NoDataComponent, selector: "pw-no-data", inputs: ["message", "description", "withImage"] }, { kind: "component", type: i10$1.RecordsSummaryComponent, selector: "pw-records-summary", inputs: ["showing", "total"] }, { kind: "directive", type: i11.RbacAllowDirective, selector: "[rbacAllow]", inputs: ["rbacAllow"] }, { kind: "directive", type: i12.RouterLink, selector: "[routerLink]", inputs: ["target", "queryParams", "fragment", "queryParamsHandling", "state", "info", "relativeTo", "preserveFragment", "skipLocationChange", "replaceUrl", "routerLink"] }, { kind: "pipe", type: i17.DateFormatPipe, name: "dateFormat" }] }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.6", type: SubscriptionInsightNpsComponent, isStandalone: false, selector: "pw-subscription-insight-nps", viewQueries: [{ propertyName: "content", first: true, predicate: ["showComment"], descendants: true, static: true }], usesInheritance: true, ngImport: i0, template: "<app-date-picker\n  [selectedDateRange]=\"selectedDateRange\"\n  [dateRanges]=\"dateRanges\"\n  (dateRangeChange)=\"onDateRangeSelect($event)\">\n</app-date-picker>\n@if (graphLoading) {\n  <div class=\"w-100 text-center mt-3\">\n    <p-progressSpinner strokeWidth=\"2\"> </p-progressSpinner>\n  </div>\n}\n\n@if (graph) {\n  <plotly-plot [data]=\"graph?.data\"\n    [config]=\"graph?.config\"\n  [layout]=\"graph?.layout\" [useResizeHandler]=\"graph? true : false\"></plotly-plot>\n}\n\n<div class=\"row m-0\">\n  <h2 class=\"card-title p-0 my-4\">User Feedbacks</h2>\n</div>\n\n@if (!isLoaded) {\n  <div class=\"w-100 text-center mt-3\"\n    >\n    <p-progressSpinner strokeWidth=\"2\"> </p-progressSpinner>\n  </div>\n}\n<div class=\"primeng-datatable-container actions-collapsed table-responsive mt-0\"\n  [class.hideTable]=\"totalRecords === 0\">\n  <p-table #tt\n    [value]=\"feedbacks\"\n    [paginator]=\"totalRecords !== 0\"\n    [rows]=\"PAGE_SIZE\"\n    [totalRecords]=\"totalRecords\"\n    [loading]=\"loading\"\n    [lazy]=\"true\"\n    (onLazyLoad)=\"onLazyLoad($event)\"\n    [filterDelay]=\"1000\"\n    [customSort]=\"true\">\n    <ng-template pTemplate=\"header\">\n      <tr>\n        <th scope=\"true\"\n          pSortableColumn=\"created_at\">\n          Created At\n          <p-sortIcon field=\"created_at\"></p-sortIcon>\n        </th>\n        <th scope=\"true\">User Name</th>\n        <th scope=\"true\">Product Name</th>\n        <th scope=\"true\">Feedback Question Name</th>\n        <th scope=\"true\">Comment</th>\n        <th scope=\"true\"\n          pSortableColumn=\"value\">\n          Value\n          <p-sortIcon field=\"value\"></p-sortIcon>\n        </th>\n        <th class=\"actions-list-two\"\n        scope=\"true\">Action</th>\n      </tr>\n    </ng-template>\n    <!-- Table Body -->\n    <ng-template pTemplate=\"body\"\n      let-item>\n      <tr>\n        <td data-head=\"created_at\">{{ item?.created_at | dateFormat }}</td>\n        <td data-head=\"user_name\">\n          <a [routerLink]=\"['/members/' + item.user_slug]\">{{ item?.user_name }}</a>\n        </td>\n        <td data-head=\"product_name\">{{ item?.product_name }}</td>\n        <td data-head=\"feedback_question_name\">{{ item?.feedback_question_name }}</td>\n        <td data-head=\"comment\">\n          @if (item?.comment) {\n            <button\n              class=\"btn btn-sm btn-info\"\n              (click)=\"openComment(item?.comment)\">\n              Display\n            </button>\n          }\n        </td>\n        <td data-head=\"value\">\n          <span [ngClass]=\"{'fw-bold text-danger':item?.value <= 6,'fw-bold text-success-muted':item.value>8}\">\n            {{ item?.value }}\n          </span>\n        </td>\n        <td data-head=\"Action\">\n          <ul class=\"list-unstyled list-inline list-action\">\n            @if (currentUser && item.user_id !== currentUser.id) {\n              <li ngbTooltip=\"Send Chat Message\"\n                *rbacAllow=\"'Pages.Chat'\"\n                class=\"me-2 me-sm-3\"\n                [routerLink]=\"['/message']\"\n                [fragment]=\"item.user_slug\">\n                <i class=\"fa fa-comments cta1-icon\" aria-hidden=\"true\"></i>\n              </li>\n            }\n          </ul>\n        </td>\n      </tr>\n    </ng-template>\n  </p-table>\n  @if (totalRecords !== 0) {\n    <pw-records-summary [showing]=\"tt?.value?.length ?? 0\" [total]=\"totalRecords\" />\n  }\n</div>\n@if (totalRecords === 0 && isLoaded) {\n  <div>\n    <pw-no-data [withImage]=\"true\" message=\"No Feedback Found\"> </pw-no-data>\n  </div>\n}\n\n<ng-template #showComment\n  let-modal>\n  <div class=\"modal-header\">\n    <h4 class=\"mb-0\">Comment</h4>\n    <button type=\"button\"\n      class=\"btn-close float-end\"\n      aria-label=\"Close\"\n      (click)=\"modal.dismiss()\">\n\n    </button>\n  </div>\n  <div class=\"modal-body\">\n    <h6 class=\"text-center modal-basic-title\">{{ commentToShow }}</h6>\n  </div>\n</ng-template>\n", dependencies: [{ kind: "component", type: i2.Table, selector: "p-table", inputs: ["frozenColumns", "frozenValue", "styleClass", "tableStyle", "tableStyleClass", "paginator", "pageLinks", "rowsPerPageOptions", "alwaysShowPaginator", "paginatorPosition", "paginatorStyleClass", "paginatorDropdownAppendTo", "paginatorDropdownScrollHeight", "currentPageReportTemplate", "showCurrentPageReport", "showJumpToPageDropdown", "showJumpToPageInput", "showFirstLastIcon", "showPageLinks", "defaultSortOrder", "sortMode", "resetPageOnSort", "selectionMode", "selectionPageOnly", "contextMenuSelection", "contextMenuSelectionMode", "dataKey", "metaKeySelection", "rowSelectable", "rowTrackBy", "lazy", "lazyLoadOnInit", "compareSelectionBy", "csvSeparator", "exportFilename", "filters", "globalFilterFields", "filterDelay", "filterLocale", "expandedRowKeys", "editingRowKeys", "rowExpandMode", "scrollable", "rowGroupMode", "scrollHeight", "virtualScroll", "virtualScrollItemSize", "virtualScrollOptions", "virtualScrollDelay", "frozenWidth", "contextMenu", "resizableColumns", "columnResizeMode", "reorderableColumns", "loading", "loadingIcon", "showLoader", "rowHover", "customSort", "showInitialSortBadge", "exportFunction", "exportHeader", "stateKey", "stateStorage", "editMode", "groupRowsBy", "size", "showGridlines", "stripedRows", "groupRowsByOrder", "responsiveLayout", "breakpoint", "paginatorLocale", "value", "columns", "first", "rows", "totalRecords", "sortField", "sortOrder", "multiSortMeta", "selection", "selectAll"], outputs: ["contextMenuSelectionChange", "selectAllChange", "selectionChange", "onRowSelect", "onRowUnselect", "onPage", "onSort", "onFilter", "onLazyLoad", "onRowExpand", "onRowCollapse", "onContextMenuSelect", "onColResize", "onColReorder", "onRowReorder", "onEditInit", "onEditComplete", "onEditCancel", "onHeaderCheckboxToggle", "sortFunction", "firstChange", "rowsChange", "onStateSave", "onStateRestore"] }, { kind: "directive", type: i3$1.PrimeTemplate, selector: "[pTemplate]", inputs: ["type", "pTemplate"] }, { kind: "directive", type: i2.SortableColumn, selector: "[pSortableColumn]", inputs: ["pSortableColumn", "pSortableColumnDisabled"] }, { kind: "component", type: i2.SortIcon, selector: "p-sortIcon", inputs: ["field"] }, { kind: "component", type: i2$2.PlotlyComponent, selector: "plotly-plot", inputs: ["data", "layout", "config", "frames", "style", "theme", "divId", "revision", "className", "debug", "useResizeHandler", "updateOnLayoutChange", "updateOnDataChange", "updateOnlyWithRevision"], outputs: ["initialized", "update", "purge", "error", "afterExport", "afterPlot", "animated", "animatingFrame", "animationInterrupted", "autoSize", "beforeExport", "beforeHover", "buttonClicked", "click", "plotlyClick", "clickAnnotation", "deselect", "doubleClick", "framework", "hover", "legendClick", "legendDoubleClick", "react", "relayout", "relayouting", "restyle", "redraw", "selected", "selecting", "sliderChange", "sliderEnd", "sliderStart", "sunburstclick", "transitioning", "transitionInterrupted", "unhover", "treemapclick", "webglcontextlost"] }, { kind: "directive", type: i2$1.NgbTooltip, selector: "[ngbTooltip]", inputs: ["animation", "autoClose", "placement", "popperOptions", "triggers", "positionTarget", "container", "disableTooltip", "tooltipClass", "tooltipContext", "openDelay", "closeDelay", "ngbTooltip"], outputs: ["shown", "hidden"], exportAs: ["ngbTooltip"] }, { kind: "directive", type: i3.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "component", type: i10$1.DateRangePickerComponent, selector: "app-date-picker", inputs: ["selectedDateRange", "dateRanges", "inputId"], outputs: ["dateRangeChange"] }, { kind: "component", type: i4.ProgressSpinner, selector: "p-progressSpinner, p-progress-spinner, p-progressspinner", inputs: ["styleClass", "strokeWidth", "fill", "animationDuration", "ariaLabel"] }, { kind: "component", type: i10$1.NoDataComponent, selector: "pw-no-data", inputs: ["message", "description", "withImage"] }, { kind: "component", type: i10$1.RecordsSummaryComponent, selector: "pw-records-summary", inputs: ["showing", "total"] }, { kind: "directive", type: i11.RbacAllowDirective, selector: "[rbacAllow]", inputs: ["rbacAllow"] }, { kind: "directive", type: i12.RouterLink, selector: "[routerLink]", inputs: ["target", "queryParams", "fragment", "queryParamsHandling", "state", "info", "relativeTo", "preserveFragment", "skipLocationChange", "replaceUrl", "routerLink"] }, { kind: "pipe", type: i17.DateFormatPipe, name: "dateFormat" }] }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.6", ngImport: i0, type: SubscriptionInsightNpsComponent, decorators: [{
             type: Component,
-            args: [{ selector: 'pw-subscription-insight-nps', standalone: false, template: "<app-date-picker\n  [selectedDateRange]=\"selectedDateRange\"\n  [dateRanges]=\"dateRanges\"\n  (dateRangeChange)=\"onDateRangeSelect($event)\">\n</app-date-picker>\n@if (graphLoading) {\n  <div class=\"w-100 text-center mt-3\">\n    <p-progressSpinner strokeWidth=\"2\"> </p-progressSpinner>\n  </div>\n}\n\n@if (graph) {\n  <plotly-plot [data]=\"graph?.data\"\n    [config]=\"graph?.config\"\n  [layout]=\"graph?.layout\" [useResizeHandler]=\"graph? true : false\"></plotly-plot>\n}\n\n<div class=\"row m-0\">\n  <h2 class=\"card-title p-0 my-4\">User Feedbacks</h2>\n</div>\n\n@if (!isLoaded) {\n  <div class=\"w-100 text-center mt-3\"\n    >\n    <p-progressSpinner strokeWidth=\"2\"> </p-progressSpinner>\n  </div>\n}\n<div class=\"primeng-datatable-container actions-collapsed table-responsive mt-0\"\n  [class.hideTable]=\"totalRecords === 0\">\n  <p-table #tt\n    [value]=\"feedbacks\"\n    [paginator]=\"totalRecords !== 0\"\n    [rows]=\"PAGE_SIZE\"\n    [totalRecords]=\"totalRecords\"\n    [loading]=\"loading\"\n    [lazy]=\"true\"\n    (onLazyLoad)=\"onLazyLoad($event)\"\n    [filterDelay]=\"1000\"\n    [customSort]=\"true\">\n    <ng-template pTemplate=\"header\">\n      <tr>\n        <th scope=\"true\"\n          pSortableColumn=\"created_at\">\n          Created At\n          <p-sortIcon field=\"created_at\"></p-sortIcon>\n        </th>\n        <th scope=\"true\">User Name</th>\n        <th scope=\"true\">Product Name</th>\n        <th scope=\"true\">Feedback Question Name</th>\n        <th scope=\"true\">Comment</th>\n        <th scope=\"true\"\n          pSortableColumn=\"value\">\n          Value\n          <p-sortIcon field=\"value\"></p-sortIcon>\n        </th>\n        <th class=\"actions-list-two\"\n        scope=\"true\">Action</th>\n      </tr>\n    </ng-template>\n    <!-- Table Body -->\n    <ng-template pTemplate=\"body\"\n      let-item>\n      <tr>\n        <td data-head=\"created_at\">{{ item?.created_at | dateFormat }}</td>\n        <td data-head=\"user_name\">\n          <a [routerLink]=\"['/members/' + item.user_slug]\">{{ item?.user_name }}</a>\n        </td>\n        <td data-head=\"product_name\">{{ item?.product_name }}</td>\n        <td data-head=\"feedback_question_name\">{{ item?.feedback_question_name }}</td>\n        <td data-head=\"comment\">\n          @if (item?.comment) {\n            <button\n              class=\"btn btn-sm btn-info\"\n              (click)=\"openComment(item?.comment)\">\n              Display\n            </button>\n          }\n        </td>\n        <td data-head=\"value\">\n          <span [ngClass]=\"{'fw-bold text-danger':item?.value <= 6,'fw-bold text-success':item.value>8}\">\n            {{ item?.value }}\n          </span>\n        </td>\n        <td data-head=\"Action\">\n          <ul class=\"list-unstyled list-inline list-action\">\n            @if (currentUser && item.user_id !== currentUser.id) {\n              <li ngbTooltip=\"Send Chat Message\"\n                *rbacAllow=\"'Pages.Chat'\"\n                class=\"me-2 me-sm-3\"\n                [routerLink]=\"['/message']\"\n                [fragment]=\"item.user_slug\">\n                <i class=\"fa fa-comments cta1-icon\" aria-hidden=\"true\"></i>\n              </li>\n            }\n          </ul>\n        </td>\n      </tr>\n    </ng-template>\n  </p-table>\n  @if (totalRecords !== 0) {\n    <pw-records-summary [showing]=\"tt?.value?.length ?? 0\" [total]=\"totalRecords\" />\n  }\n</div>\n@if (totalRecords === 0 && isLoaded) {\n  <div>\n    <pw-no-data [withImage]=\"true\" message=\"No Feedback Found\"> </pw-no-data>\n  </div>\n}\n\n<ng-template #showComment\n  let-modal>\n  <div class=\"modal-header\">\n    <h4 class=\"mb-0\">Comment</h4>\n    <button type=\"button\"\n      class=\"btn-close float-end\"\n      aria-label=\"Close\"\n      (click)=\"modal.dismiss()\">\n\n    </button>\n  </div>\n  <div class=\"modal-body\">\n    <h6 class=\"text-center modal-basic-title\">{{ commentToShow }}</h6>\n  </div>\n</ng-template>\n" }]
+            args: [{ selector: 'pw-subscription-insight-nps', standalone: false, template: "<app-date-picker\n  [selectedDateRange]=\"selectedDateRange\"\n  [dateRanges]=\"dateRanges\"\n  (dateRangeChange)=\"onDateRangeSelect($event)\">\n</app-date-picker>\n@if (graphLoading) {\n  <div class=\"w-100 text-center mt-3\">\n    <p-progressSpinner strokeWidth=\"2\"> </p-progressSpinner>\n  </div>\n}\n\n@if (graph) {\n  <plotly-plot [data]=\"graph?.data\"\n    [config]=\"graph?.config\"\n  [layout]=\"graph?.layout\" [useResizeHandler]=\"graph? true : false\"></plotly-plot>\n}\n\n<div class=\"row m-0\">\n  <h2 class=\"card-title p-0 my-4\">User Feedbacks</h2>\n</div>\n\n@if (!isLoaded) {\n  <div class=\"w-100 text-center mt-3\"\n    >\n    <p-progressSpinner strokeWidth=\"2\"> </p-progressSpinner>\n  </div>\n}\n<div class=\"primeng-datatable-container actions-collapsed table-responsive mt-0\"\n  [class.hideTable]=\"totalRecords === 0\">\n  <p-table #tt\n    [value]=\"feedbacks\"\n    [paginator]=\"totalRecords !== 0\"\n    [rows]=\"PAGE_SIZE\"\n    [totalRecords]=\"totalRecords\"\n    [loading]=\"loading\"\n    [lazy]=\"true\"\n    (onLazyLoad)=\"onLazyLoad($event)\"\n    [filterDelay]=\"1000\"\n    [customSort]=\"true\">\n    <ng-template pTemplate=\"header\">\n      <tr>\n        <th scope=\"true\"\n          pSortableColumn=\"created_at\">\n          Created At\n          <p-sortIcon field=\"created_at\"></p-sortIcon>\n        </th>\n        <th scope=\"true\">User Name</th>\n        <th scope=\"true\">Product Name</th>\n        <th scope=\"true\">Feedback Question Name</th>\n        <th scope=\"true\">Comment</th>\n        <th scope=\"true\"\n          pSortableColumn=\"value\">\n          Value\n          <p-sortIcon field=\"value\"></p-sortIcon>\n        </th>\n        <th class=\"actions-list-two\"\n        scope=\"true\">Action</th>\n      </tr>\n    </ng-template>\n    <!-- Table Body -->\n    <ng-template pTemplate=\"body\"\n      let-item>\n      <tr>\n        <td data-head=\"created_at\">{{ item?.created_at | dateFormat }}</td>\n        <td data-head=\"user_name\">\n          <a [routerLink]=\"['/members/' + item.user_slug]\">{{ item?.user_name }}</a>\n        </td>\n        <td data-head=\"product_name\">{{ item?.product_name }}</td>\n        <td data-head=\"feedback_question_name\">{{ item?.feedback_question_name }}</td>\n        <td data-head=\"comment\">\n          @if (item?.comment) {\n            <button\n              class=\"btn btn-sm btn-info\"\n              (click)=\"openComment(item?.comment)\">\n              Display\n            </button>\n          }\n        </td>\n        <td data-head=\"value\">\n          <span [ngClass]=\"{'fw-bold text-danger':item?.value <= 6,'fw-bold text-success-muted':item.value>8}\">\n            {{ item?.value }}\n          </span>\n        </td>\n        <td data-head=\"Action\">\n          <ul class=\"list-unstyled list-inline list-action\">\n            @if (currentUser && item.user_id !== currentUser.id) {\n              <li ngbTooltip=\"Send Chat Message\"\n                *rbacAllow=\"'Pages.Chat'\"\n                class=\"me-2 me-sm-3\"\n                [routerLink]=\"['/message']\"\n                [fragment]=\"item.user_slug\">\n                <i class=\"fa fa-comments cta1-icon\" aria-hidden=\"true\"></i>\n              </li>\n            }\n          </ul>\n        </td>\n      </tr>\n    </ng-template>\n  </p-table>\n  @if (totalRecords !== 0) {\n    <pw-records-summary [showing]=\"tt?.value?.length ?? 0\" [total]=\"totalRecords\" />\n  }\n</div>\n@if (totalRecords === 0 && isLoaded) {\n  <div>\n    <pw-no-data [withImage]=\"true\" message=\"No Feedback Found\"> </pw-no-data>\n  </div>\n}\n\n<ng-template #showComment\n  let-modal>\n  <div class=\"modal-header\">\n    <h4 class=\"mb-0\">Comment</h4>\n    <button type=\"button\"\n      class=\"btn-close float-end\"\n      aria-label=\"Close\"\n      (click)=\"modal.dismiss()\">\n\n    </button>\n  </div>\n  <div class=\"modal-body\">\n    <h6 class=\"text-center modal-basic-title\">{{ commentToShow }}</h6>\n  </div>\n</ng-template>\n" }]
         }], ctorParameters: () => [{ type: i1.AdminService }, { type: i0.Injector }, { type: i1$1.CommonService }, { type: i2$1.NgbModal }, { type: i0.ChangeDetectorRef }], propDecorators: { content: [{
                 type: ViewChild,
                 args: ['showComment', { static: true }]
@@ -8466,7 +8463,7 @@ class SubscriptionsListComponent extends AppBaseComponent {
         super.ngOnDestroy();
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.6", ngImport: i0, type: SubscriptionsListComponent, deps: [{ token: i1$1.ProductService }, { token: i1.AdminService }, { token: i9.UntypedFormBuilder }, { token: i0.Injector }, { token: i0.ChangeDetectorRef }, { token: i1$1.CommonService }], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.6", type: SubscriptionsListComponent, isStandalone: false, selector: "pw-subscriptions-list", viewQueries: [{ propertyName: "refProduct", first: true, predicate: ["refProduct"], descendants: true }, { propertyName: "recoverSubscriptionPasswordModal", first: true, predicate: ["recoverSubscriptionPasswordModal"], descendants: true }], usesInheritance: true, ngImport: i0, template: "<div class=\"row\">\n  <div\n    class=\"col-12 d-flex justify-content-between align-items-center\">\n    <h2 class=\"card-title p-0 float-start\">Subscriptions</h2>\n    <a class=\"btn btn-sm btn-outline-primary float-end\"\n      id=\"btn-create\"\n      [routerLink]=\"[routers.inviteUsers]\">\n      <i class=\"fa fa-plus-circle\" aria-hidden=\"true\"></i> Invite a User to a Trial\n    </a>\n  </div>\n</div>\n<div class=\"p-2 mt-2\">\n  <div class=\"w-100 text-center\">\n    @if (!isLoaded) {\n      <p-progressSpinner> </p-progressSpinner>\n    }\n  </div>\n  <div class=\"primeng-datatable-container actions-collapsed table-responsive mt-0\"\n    [class.hideTable]=\"totalRecordsUnFiltered === 0\">\n    <p-table #dt\n      [value]=\"subscriptions\"\n      [paginator]=\"totalRecords !== 0\"\n      [rows]=\"PAGE_SIZE\"\n      [lazy]=\"true\"\n      [totalRecords]=\"totalRecords\"\n      [loading]=\"loading\"\n      [filterDelay]=\"1000\"\n      (onLazyLoad)=\"onLazyLoad($event)\"\n      [customSort]=\"true\">\n      <ng-template pTemplate=\"caption\">\n        @if (subscriptionInsights) {\n          <div class=\"row mb-4\">\n            @for (temp of objectKeys(subscriptionInsights); track temp) {\n              <div class=\"col-12 col-lg-3 summary\">\n                <div class=\"card\">\n                  <div class=\"card-body\">\n                    @for (item of subscriptionInsights[temp]; track item) {\n                      @let k = item | kpiInsight;\n                      <div class=\"kpi\">\n                        <p class=\"kpi-label\">{{ k.name }}@if (item?.info) {<span [pTooltip]=\"item?.info\"><i class=\"far fa-info-circle text-muted\"></i></span>}</p>\n                        <div class=\"kpi-value\">{{ k.primary }}</div>\n                        @if (k.secondary) {<div class=\"kpi-comp\">{{ k.comp }} <b>{{ k.secondary }}</b></div>}\n                      </div>\n                    }\n                  </div>\n                </div>\n              </div>\n            }\n          </div>\n        }\n        <div class=\"search-filter\">\n          <div class=\"col-12 col-sm-4\">\n            <p-multiSelect inputId=\"subscriptions-list-feature-keys\"\n              placeholder=\"Filter by feature keys\"\n              [showToggleAll]=\"true\"\n              [showHeader]=\"true\"\n              [maxSelectedLabels]=\"2\"\n              selectedItemsLabel=\"{0} feature keys selected\"\n              [(ngModel)]=\"selectedFeatureKeys\"\n              [options]=\"searchOptions\"\n              (onChange)=\"onSearchOptionChange($event)\"\n              appendTo=\"body\">\n            </p-multiSelect>\n          </div>\n          <div class=\"col-12 col-sm-4\">\n            <p-select\n              inputId=\"subscriptions-list-status\"\n              [options]=\"subscriptionStatus\"\n              [placeholder]=\"'Filter by status'\"\n              (onChange)=\"filterByStatus($event.value)\"\n              [(ngModel)]=\"status\"\n              appendTo=\"body\">\n            </p-select>\n          </div>\n          <div class=\"text-end\">\n            <label for=\"subscriptions-list-search\" class=\"visually-hidden\">Search Subscription</label>\n            <p-iconfield iconPosition=\"left\">\n              <p-inputicon><i class=\"fa fa-search\" aria-hidden=\"true\"></i></p-inputicon>\n              <input type=\"text\"\n                id=\"subscriptions-list-search\"\n                name=\"subscriptions-list-search\"\n                [(ngModel)]=\"searchText\"\n                pInputText\n                placeholder=\"Search Subscription...\"\n                (input)=\"dt.filterGlobal($event.target.value, 'contains')\" />\n            </p-iconfield>\n          </div>\n        </div>\n      </ng-template>\n      <ng-template pTemplate=\"header\">\n        <tr>\n          <th scope=\"true\"\n            pSortableColumn=\"id\">\n            {{ 'Admin.Subscriptions.Id' | transloco }}\n            <p-sortIcon field=\"id\"></p-sortIcon>\n          </th>\n          <th scope=\"true\"\n            pSortableColumn=\"organisation\">\n            {{ 'Admin.Subscriptions.Organization' | transloco }}\n            <p-sortIcon field=\"organisation\"></p-sortIcon>\n          </th>\n          <th scope=\"true\"\n            pSortableColumn=\"contact_name\">\n            {{ 'Admin.Subscriptions.ContactName' | transloco }}\n            <p-sortIcon field=\"contact_name\"></p-sortIcon>\n          </th>\n          <th scope=\"true\"\n            pSortableColumn=\"contact_email\">\n            {{ 'Admin.Subscriptions.ContactEmail' | transloco }}\n            <p-sortIcon field=\"contact_email\"></p-sortIcon>\n          </th>\n          <th scope=\"true\">{{ 'Admin.Subscriptions.Product' | transloco }}</th>\n          <th scope=\"true\">{{ 'Admin.Subscriptions.Currency' | transloco }}</th>\n          <th scope=\"true\">{{ 'Admin.Subscriptions.PricePerMonth' | transloco }}</th>\n          <th scope=\"true\"\n            pSortableColumn=\"stripe_customer_id\">\n            {{ 'Admin.Subscriptions.Paid' | transloco }}\n            <p-sortIcon field=\"stripe_customer_id\"></p-sortIcon>\n          </th>\n          <th scope=\"true\">{{ 'Admin.Subscriptions.Billing' | transloco }}</th>\n          <th scope=\"true\"\n            class=\"expires-at-width\">\n            {{ 'Admin.Subscriptions.ExpiresAt' | transloco }}\n          </th>\n          <th scope=\"true\"\n            pSortableColumn=\"sessions_total\">\n            {{ 'Admin.Subscriptions.SessionsTotal' | transloco }}\n            <p-sortIcon field=\"sessions_total\"></p-sortIcon>\n          </th>\n          <th scope=\"true\"\n            pSortableColumn=\"sessions_last_month\">\n            {{ 'Admin.Subscriptions.SessionsTotalLastMonth' | transloco }}\n            <p-sortIcon field=\"sessions_last_month\"></p-sortIcon>\n          </th>\n          <th scope=\"true\"\n            pSortableColumn=\"deleted_at\">\n            {{ 'Admin.Subscriptions.Deleted' | transloco }}\n            <p-sortIcon field=\"deleted_at\"></p-sortIcon>\n          </th>\n          <th class=\"actions-list-two\"\n          scope=\"true\">{{ 'Label.Actions' | transloco }}</th>\n        </tr>\n      </ng-template>\n      <ng-template pTemplate=\"body\"\n        let-item>\n        <tr>\n          <td data-head=\"id\">{{ item.id }}</td>\n          <td data-head=\"Organization\">\n            <span class=\"cursor-pointer custom-break-word\"\n              [pTooltip]=\"item.organisation\"\n            tooltipPosition=\"top\">{{ item.organisation | textTruncate: 20 }}</span>\n          </td>\n          <td data-head=\"ContactName\" class=\"custom-break-word\">\n            <span [pTooltip]=\"item.contact_name\" tooltipPosition=\"top\">{{ item.contact_name | textTruncate: 20 }}</span>\n          </td>\n          <td data-head=\"ContactEmail\">\n            <span [pTooltip]=\"item.contact_email\" tooltipPosition=\"top\">{{ item.contact_email | textTruncate: 20 }}</span>\n          </td>\n          <td data-head=\"Name\">\n            <span class=\"cursor-pointer custom-break-word\"\n              [pTooltip]=\"item.productName\"\n            tooltipPosition=\"top\">{{ item.productName | textTruncate: 20 }}</span>\n          </td>\n          <td data-head=\"Currency\">\n            <span [appDynamicBadge]=\"{ itemsArray: currency, item: item.currency }\"\n              color=\"blue-grey\"\n            class=\"badge\">{{ item.currency }}</span>\n          </td>\n          <td data-head=\"Price/M\">\n            <span>{{ (item.price / 100).toFixed(2) | currency:item.currency }}\n              @if (item?.discount && objectKeys(item?.discount)?.length) {\n                <i\n                  class=\"far fa-info-circle text-muted\"\n                  aria-hidden=\"true\"\n                  [pTooltip]=\"item?.discount | json\"\n                  tooltipPosition=\"top\"\n                ></i>\n              }\n            </span>\n          </td>\n          <td data-head=\"Paid\">\n            @if (item?.unsubscribed_at) {\n              <span class=\"badge bg-warning d-inline-flex align-items-center\">\n                Unsub\n                @if (item?.reason_to_cancel) {\n                  <i class=\"far fa-info-circle ms-2 text-muted\"\n                    [pTooltip]=\"item.reason_to_cancel\"\n                    tooltipPosition=\"top\"\n                  aria-hidden=\"true\"></i>\n                }\n              </span>\n            }\n            @if (!item?.unsubscribed_at) {\n              @if ((item?.stripe_customer_id || item?.external_payment) && item?.signed_up_at) {\n                <span class=\"badge bg-success\">Yes</span>\n              } @else {\n                <span class=\"badge bg-blue-grey\">No</span>\n              }\n            }\n            @if (item?.pause_collection && objectKeys(item?.pause_collection)?.length) {\n              <span\n                class=\"ms-2\"\n                [pTooltip]=\"item?.pause_collection | json\"\n                tooltipPosition=\"top\">\n                <i class=\"fas fa-exclamation-triangle text-warning\"></i>\n              </span>\n            }\n          </td>\n          <td data-head=\"Billing\">\n            <span class=\"badge\"\n              [appDynamicBadge]=\"{\n                              itemsArray: billingFrequency,\n                              item: item?.billingFrequency\n                          }\"\n            color=\"blue-grey\">{{ item.billingFrequency }}</span>\n          </td>\n          <td data-head=\"Expires\">\n            <span [ngClass]=\"getExpiresAtColor(item)\">{{item?.expires_at | dateFormat}}</span>\n            <span>&nbsp;({{item?.created_at | sinceAgo:true}})</span>\n          </td>\n          <td data-head=\"S#\">{{ item?.sessions_total }}</td>\n          <td data-head=\"S/m #\">\n            <span [ngClass]=\"{\n                              'text-danger fw-bold': item?.sessions_last_month < 3\n                          }\">{{ item?.sessions_last_month }}</span>\n          </td>\n          <td data-head=\"Deleted\">\n            @if (item?.deleted_at) {\n              <span\n              class=\"badge bg-danger\">Yes</span>\n            }\n            @if (!item?.deleted_at) {\n              <span\n              class=\"badge bg-blue-grey\">No</span>\n            }\n          </td>\n          <td data-head=\"Action\">\n            <ul class=\"list-unstyled list-inline list-action\">\n              <li ngbTooltip=\"Edit\"\n                class=\"me-2 me-sm-3\"\n                [routerLink]=\"[routers.subscriptionDetails, item.id]\">\n                <i class=\"fa fa-edit edit-icon\" aria-hidden=\"true\"></i>\n              </li>\n              @if (item.deleted) {\n                <li ngbTooltip=\"Reactivate subscription\"\n                  class=\"me-2 me-sm-3\"\n                  *rbacAllow=\"'Pages.Alpha'\"\n                  (keydown.enter)=\"openRecoverSubscriptionModal(item)\"\n                  (click)=\"openRecoverSubscriptionModal(item)\">\n                  <i class=\"fa fa-trash delete-icon text-success\" aria-hidden=\"true\"></i>\n                </li>\n              } @else {\n                <li ngbTooltip=\"Delete\"\n                  class=\"me-2 me-sm-3\"\n                  *rbacAllow=\"'Pages.Admin.Subscription.Delete'\"\n                  (keydown.enter)=\"onDelete(item)\"\n                  (click)=\"onDelete(item)\">\n                  <i class=\"fa fa-trash delete-icon\" aria-hidden=\"true\"></i>\n                </li>\n              }\n            </ul>\n          </td>\n        </tr>\n      </ng-template>\n    </p-table>\n    @if (totalRecords === 0 && totalRecordsUnFiltered !== 0) {\n      <div>\n        <pw-no-data [withImage]=\"true\" [message]=\"'Search.NoDataMessage' | transloco\" [description]=\"'Search.NoDataDescription' | transloco\" >\n        </pw-no-data>\n      </div>\n    }\n    @if (totalRecords !== 0) {\n      <pw-records-summary [showing]=\"dt?.value?.length ?? 0\" [total]=\"totalRecords\" />\n    }\n  </div>\n</div>\n@if (totalRecordsUnFiltered === 0 && isLoaded) {\n  <pw-no-data [withImage]=\"true\" [message]=\"'Admin.Subscriptions.NoSubscriptionMessage' | transloco\">\n  </pw-no-data>\n}\n<pw-password-validation\n  #recoverSubscriptionPasswordModal\n  (successEvent)=\"onRecoverConfirmed()\">\n</pw-password-validation>\n\n", styles: ["@charset \"UTF-8\";:root{--first: rgb(23 105 225);--second: rgb(54 194 131);--third: rgb(255 171 0);--text: rgb(34 34 34);--tabs_bg: rgb(23 105 225);--tabs_sub_bg: rgb(70, 136, 236);--tabs_text: rgb(255 255 255);--titles: rgb(34 34 34);--sidebar_bg: rgb(0, 48, 63);--sidebar_text: rgb(255 255 255)}.table-responsive td{padding:6px 10px!important;font-size:12px!important;line-height:1.35;vertical-align:top;word-break:break-word}.table-responsive th{font-size:12px!important;vertical-align:bottom}.table-responsive td[data-head=Organization],.table-responsive td[data-head=Name],.table-responsive td[data-head=ContactName],.table-responsive td[data-head=ContactEmail],.table-responsive td[data-head=id],.table-responsive td[data-head=\"Price/M\"],.table-responsive td[data-head=\"S#\"],.table-responsive td[data-head=\"S/m #\"]{white-space:nowrap}.table-responsive td[data-head=id]{font-variant-numeric:tabular-nums;color:#7c8696}.table-responsive td[data-head=\"Price/M\"],.table-responsive td[data-head=\"S#\"],.table-responsive td[data-head=\"S/m #\"]{font-variant-numeric:tabular-nums;text-align:right}.table-responsive th:nth-child(7),.table-responsive th:nth-child(11),.table-responsive th:nth-child(12){text-align:right}.table-responsive .badge{font-size:11px;font-weight:600;padding:2px 8px;border-radius:4px;letter-spacing:.01em}.table-responsive .badge[class*=bg-success]{background-color:#e6f4ec!important;color:#0f6b3a!important}.table-responsive .badge[class*=bg-danger]{background-color:#fbeae8!important;color:#c0392b!important}.table-responsive .badge[class*=bg-warning]{background-color:#fbf1e3!important;color:#8a5a00!important}.table-responsive .badge.bg-blue-grey{background-color:#eef0f3!important;color:#5a6473!important}.table-responsive .badge.bg-blue-grey-1{background-color:#e9e6ef!important;color:#473172!important}.table-responsive .badge.bg-blue-grey-2{background-color:#efe6ef!important;color:#723172!important}.table-responsive .badge.bg-blue-grey-3{background-color:#efe6e9!important;color:#723147!important}.table-responsive .badge.bg-blue-grey-4{background-color:#efe9e6!important;color:#724731!important}.table-responsive .badge.bg-blue-grey-5{background-color:#efefe6!important;color:#727231!important}.table-responsive .badge.bg-blue-grey-6{background-color:#e9efe6!important;color:#477231!important}.table-responsive .badge.bg-blue-grey-7{background-color:#e6efe9!important;color:#317247!important}.table-responsive .badge.bg-blue-grey-8{background-color:#e6efef!important;color:#317272!important}.table-responsive .badge.bg-blue-grey-9{background-color:#e6e9ef!important;color:#314772!important}.table-responsive .badge.bg-blue-grey-10{background-color:#e9e6ef!important;color:#473172!important}.table-responsive .badge.bg-blue-grey-11{background-color:#efe6ef!important;color:#723172!important}.table-responsive .badge.bg-blue-grey-12{background-color:#efe6e9!important;color:#723147!important}.table-responsive .badge.bg-blue-grey-13{background-color:#efe9e6!important;color:#724731!important}.table-responsive .badge.bg-blue-grey-14{background-color:#efefe6!important;color:#727231!important}.table-responsive .badge.bg-blue-grey-15{background-color:#e9efe6!important;color:#477231!important}.table-responsive .badge.bg-blue-grey-16{background-color:#e6efe9!important;color:#317247!important}.table-responsive .badge.bg-blue-grey-17{background-color:#e6efef!important;color:#317272!important}.table-responsive .badge.bg-blue-grey-18{background-color:#e6e9ef!important;color:#314772!important}.table-responsive .badge.bg-blue-grey-19{background-color:#e9e6ef!important;color:#473172!important}.table-responsive .badge.bg-blue-grey-20{background-color:#efe6ef!important;color:#723172!important}.table-responsive .badge.bg-blue-grey-21{background-color:#efe6e9!important;color:#723147!important}.table-responsive .badge.bg-blue-grey-22{background-color:#efe9e6!important;color:#724731!important}.table-responsive .badge.bg-blue-grey-23{background-color:#efefe6!important;color:#727231!important}.table-responsive .badge.bg-blue-grey-24{background-color:#e9efe6!important;color:#477231!important}.table-responsive .badge[class*=bg-success]:before,.table-responsive .badge[class*=bg-danger]:before,.table-responsive .badge[class*=bg-warning]:before{content:\"\";display:inline-block;width:6px;height:6px;margin-right:6px;border-radius:50%;background-color:currentColor;vertical-align:middle}.table-responsive tbody tr:hover{background-color:#f5f7fa}.table-responsive td[data-head=Organization] span,.table-responsive td[data-head=Name] span{font-weight:600;color:#1a1d21}.table-responsive td[data-head=Expires] span~span{font-weight:600}.table-responsive .list-action .edit-icon{color:#5a6473}.table-responsive .list-action .delete-icon{color:#c0392b!important}.table-responsive .list-action .delete-icon.text-success{color:#0f6b3a!important}@media(max-width:1199.98px){.table-responsive td,.table-responsive th{white-space:nowrap;word-break:normal}}.expires-at-width{width:8%}.custom-break-word{word-break:break-word!important}.summary{display:flex}.summary .card{width:100%;margin-top:0;margin-bottom:0;padding-bottom:0!important;border:1px solid #e2e5ea;border-radius:8px;box-shadow:none!important;background-color:#fff;transition:background-color .12s ease,border-color .12s ease}.summary .card:hover{background-color:#fafbfc;border-color:#cfd4dc}.summary .card-body{display:flex;flex-direction:column;padding:2px 0}.summary .kpi{display:grid;grid-template-columns:auto minmax(0,1fr);column-gap:12px;align-items:baseline;padding:10px 16px}.summary .kpi+.kpi{border-top:1px solid #eef0f3}.summary .kpi-label{grid-column:1/-1;margin:0 0 4px;font-size:10px;font-weight:600;line-height:1.3;letter-spacing:.05em;text-transform:uppercase;color:#5a6473}.summary .kpi-label .fa-info-circle{margin-left:4px;font-size:15px;color:#a8afbc}.summary .kpi-value{grid-column:1;font-size:18px;font-weight:700;line-height:1.1;color:#1a1d21;font-variant-numeric:tabular-nums}.summary .kpi-comp{grid-column:2;text-align:right;font-size:12px;color:#7c8696;font-variant-numeric:tabular-nums;white-space:normal}.summary .kpi-comp:before{content:\"\\b7\";margin-right:4px;color:#a8afbc}.summary .kpi-comp b{font-weight:600;color:#5a6473}@media(min-width:320px)and (max-width:720px){.primeng-datatable-container .search-filter{display:flex;flex-direction:column;gap:.5rem;justify-content:space-between}}\n"], dependencies: [{ kind: "component", type: i2.Table, selector: "p-table", inputs: ["frozenColumns", "frozenValue", "styleClass", "tableStyle", "tableStyleClass", "paginator", "pageLinks", "rowsPerPageOptions", "alwaysShowPaginator", "paginatorPosition", "paginatorStyleClass", "paginatorDropdownAppendTo", "paginatorDropdownScrollHeight", "currentPageReportTemplate", "showCurrentPageReport", "showJumpToPageDropdown", "showJumpToPageInput", "showFirstLastIcon", "showPageLinks", "defaultSortOrder", "sortMode", "resetPageOnSort", "selectionMode", "selectionPageOnly", "contextMenuSelection", "contextMenuSelectionMode", "dataKey", "metaKeySelection", "rowSelectable", "rowTrackBy", "lazy", "lazyLoadOnInit", "compareSelectionBy", "csvSeparator", "exportFilename", "filters", "globalFilterFields", "filterDelay", "filterLocale", "expandedRowKeys", "editingRowKeys", "rowExpandMode", "scrollable", "rowGroupMode", "scrollHeight", "virtualScroll", "virtualScrollItemSize", "virtualScrollOptions", "virtualScrollDelay", "frozenWidth", "contextMenu", "resizableColumns", "columnResizeMode", "reorderableColumns", "loading", "loadingIcon", "showLoader", "rowHover", "customSort", "showInitialSortBadge", "exportFunction", "exportHeader", "stateKey", "stateStorage", "editMode", "groupRowsBy", "size", "showGridlines", "stripedRows", "groupRowsByOrder", "responsiveLayout", "breakpoint", "paginatorLocale", "value", "columns", "first", "rows", "totalRecords", "sortField", "sortOrder", "multiSortMeta", "selection", "selectAll"], outputs: ["contextMenuSelectionChange", "selectAllChange", "selectionChange", "onRowSelect", "onRowUnselect", "onPage", "onSort", "onFilter", "onLazyLoad", "onRowExpand", "onRowCollapse", "onContextMenuSelect", "onColResize", "onColReorder", "onRowReorder", "onEditInit", "onEditComplete", "onEditCancel", "onHeaderCheckboxToggle", "sortFunction", "firstChange", "rowsChange", "onStateSave", "onStateRestore"] }, { kind: "directive", type: i3$1.PrimeTemplate, selector: "[pTemplate]", inputs: ["type", "pTemplate"] }, { kind: "directive", type: i2.SortableColumn, selector: "[pSortableColumn]", inputs: ["pSortableColumn", "pSortableColumnDisabled"] }, { kind: "component", type: i2.SortIcon, selector: "p-sortIcon", inputs: ["field"] }, { kind: "directive", type: i6$1.Tooltip, selector: "[pTooltip]", inputs: ["tooltipPosition", "tooltipEvent", "positionStyle", "tooltipStyleClass", "tooltipZIndex", "escape", "showDelay", "hideDelay", "life", "positionTop", "positionLeft", "autoHide", "fitContent", "hideOnEscape", "pTooltip", "tooltipDisabled", "tooltipOptions", "appendTo", "ptTooltip", "pTooltipPT", "pTooltipUnstyled"] }, { kind: "component", type: i5.Select, selector: "p-select", inputs: ["id", "scrollHeight", "filter", "panelStyle", "styleClass", "panelStyleClass", "readonly", "editable", "tabindex", "placeholder", "loadingIcon", "filterPlaceholder", "filterLocale", "inputId", "dataKey", "filterBy", "filterFields", "autofocus", "resetFilterOnHide", "checkmark", "dropdownIcon", "loading", "optionLabel", "optionValue", "optionDisabled", "optionGroupLabel", "optionGroupChildren", "group", "showClear", "emptyFilterMessage", "emptyMessage", "lazy", "virtualScroll", "virtualScrollItemSize", "virtualScrollOptions", "overlayOptions", "ariaFilterLabel", "ariaLabel", "ariaLabelledBy", "filterMatchMode", "tooltip", "tooltipPosition", "tooltipPositionStyle", "tooltipStyleClass", "focusOnHover", "selectOnFocus", "autoOptionFocus", "autofocusFilter", "filterValue", "options", "appendTo", "motionOptions"], outputs: ["onChange", "onFilter", "onFocus", "onBlur", "onClick", "onShow", "onHide", "onClear", "onLazyLoad"] }, { kind: "component", type: i6$2.MultiSelect, selector: "p-multiSelect, p-multiselect, p-multi-select", inputs: ["id", "ariaLabel", "styleClass", "panelStyle", "panelStyleClass", "inputId", "readonly", "group", "filter", "filterPlaceHolder", "filterLocale", "overlayVisible", "tabindex", "dataKey", "ariaLabelledBy", "displaySelectedLabel", "maxSelectedLabels", "selectionLimit", "selectedItemsLabel", "showToggleAll", "emptyFilterMessage", "emptyMessage", "resetFilterOnHide", "dropdownIcon", "chipIcon", "optionLabel", "optionValue", "optionDisabled", "optionGroupLabel", "optionGroupChildren", "showHeader", "filterBy", "scrollHeight", "lazy", "virtualScroll", "loading", "virtualScrollItemSize", "loadingIcon", "virtualScrollOptions", "overlayOptions", "ariaFilterLabel", "filterMatchMode", "tooltip", "tooltipPosition", "tooltipPositionStyle", "tooltipStyleClass", "autofocusFilter", "display", "autocomplete", "showClear", "autofocus", "placeholder", "options", "filterValue", "selectAll", "focusOnHover", "filterFields", "selectOnFocus", "autoOptionFocus", "highlightOnSelect", "size", "variant", "fluid", "appendTo", "motionOptions"], outputs: ["onChange", "onFilter", "onFocus", "onBlur", "onClick", "onClear", "onPanelShow", "onPanelHide", "onLazyLoad", "onRemove", "onSelectAllChange"] }, { kind: "directive", type: i4$1.InputText, selector: "[pInputText]", inputs: ["hostName", "ptInputText", "pInputTextPT", "pInputTextUnstyled", "pSize", "variant", "fluid", "invalid"] }, { kind: "component", type: i5$1.IconField, selector: "p-iconfield, p-iconField, p-icon-field", inputs: ["hostName", "iconPosition", "styleClass"] }, { kind: "component", type: i6.InputIcon, selector: "p-inputicon, p-inputIcon", inputs: ["hostName", "styleClass"] }, { kind: "directive", type: i2$1.NgbTooltip, selector: "[ngbTooltip]", inputs: ["animation", "autoClose", "placement", "popperOptions", "triggers", "positionTarget", "container", "disableTooltip", "tooltipClass", "tooltipContext", "openDelay", "closeDelay", "ngbTooltip"], outputs: ["shown", "hidden"], exportAs: ["ngbTooltip"] }, { kind: "directive", type: i3.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i9.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { kind: "directive", type: i9.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i9.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "component", type: i10$1.PasswordValidationComponent, selector: "pw-password-validation", inputs: ["confirmMessage"], outputs: ["successEvent"] }, { kind: "component", type: i4.ProgressSpinner, selector: "p-progressSpinner, p-progress-spinner, p-progressspinner", inputs: ["styleClass", "strokeWidth", "fill", "animationDuration", "ariaLabel"] }, { kind: "component", type: i10$1.NoDataComponent, selector: "pw-no-data", inputs: ["message", "description", "withImage"] }, { kind: "component", type: i10$1.RecordsSummaryComponent, selector: "pw-records-summary", inputs: ["showing", "total"] }, { kind: "directive", type: i11.DynamicBadgeDirective, selector: "[appDynamicBadge]", inputs: ["appDynamicBadge", "color", "colorByName", "dataName"] }, { kind: "directive", type: i11.RbacAllowDirective, selector: "[rbacAllow]", inputs: ["rbacAllow"] }, { kind: "directive", type: i12.RouterLink, selector: "[routerLink]", inputs: ["target", "queryParams", "fragment", "queryParamsHandling", "state", "info", "relativeTo", "preserveFragment", "skipLocationChange", "replaceUrl", "routerLink"] }, { kind: "pipe", type: i3.JsonPipe, name: "json" }, { kind: "pipe", type: i3.CurrencyPipe, name: "currency" }, { kind: "pipe", type: i13.TranslocoPipe, name: "transloco" }, { kind: "pipe", type: i17.DateFormatPipe, name: "dateFormat" }, { kind: "pipe", type: i17.SinceAgoPipe, name: "sinceAgo" }, { kind: "pipe", type: i17.TextTruncatePipe, name: "textTruncate" }, { kind: "pipe", type: KpiInsightPipe, name: "kpiInsight" }] }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.6", type: SubscriptionsListComponent, isStandalone: false, selector: "pw-subscriptions-list", viewQueries: [{ propertyName: "refProduct", first: true, predicate: ["refProduct"], descendants: true }, { propertyName: "recoverSubscriptionPasswordModal", first: true, predicate: ["recoverSubscriptionPasswordModal"], descendants: true }], usesInheritance: true, ngImport: i0, template: "<div class=\"row\">\n  <div\n    class=\"col-12 d-flex justify-content-between align-items-center\">\n    <h2 class=\"card-title p-0 float-start\">Subscriptions</h2>\n    <a class=\"btn btn-sm btn-outline-primary float-end\"\n      id=\"btn-create\"\n      [routerLink]=\"[routers.inviteUsers]\">\n      <i class=\"fa fa-plus-circle\" aria-hidden=\"true\"></i> Invite a User to a Trial\n    </a>\n  </div>\n</div>\n<div class=\"p-2 mt-2\">\n  <div class=\"w-100 text-center\">\n    @if (!isLoaded) {\n      <p-progressSpinner> </p-progressSpinner>\n    }\n  </div>\n  <div class=\"primeng-datatable-container actions-collapsed table-responsive mt-0\"\n    [class.hideTable]=\"totalRecordsUnFiltered === 0\">\n    <p-table #dt\n      [value]=\"subscriptions\"\n      [paginator]=\"totalRecords !== 0\"\n      [rows]=\"PAGE_SIZE\"\n      [lazy]=\"true\"\n      [totalRecords]=\"totalRecords\"\n      [loading]=\"loading\"\n      [filterDelay]=\"1000\"\n      (onLazyLoad)=\"onLazyLoad($event)\"\n      [customSort]=\"true\">\n      <ng-template pTemplate=\"caption\">\n        @if (subscriptionInsights) {\n          <div class=\"row mb-4\">\n            @for (temp of objectKeys(subscriptionInsights); track temp) {\n              <div class=\"col-12 col-lg-3 summary\">\n                <div class=\"card\">\n                  <div class=\"card-body\">\n                    @for (item of subscriptionInsights[temp]; track item) {\n                      @let k = item | kpiInsight;\n                      <div class=\"kpi\">\n                        <p class=\"kpi-label\">{{ k.name }}@if (item?.info) {<span [pTooltip]=\"item?.info\"><i class=\"far fa-info-circle text-muted\"></i></span>}</p>\n                        <div class=\"kpi-value\">{{ k.primary }}</div>\n                        @if (k.secondary) {<div class=\"kpi-comp\">{{ k.comp }} <b>{{ k.secondary }}</b></div>}\n                      </div>\n                    }\n                  </div>\n                </div>\n              </div>\n            }\n          </div>\n        }\n        <div class=\"search-filter\">\n          <div class=\"col-12 col-sm-4\">\n            <p-multiSelect inputId=\"subscriptions-list-feature-keys\"\n              placeholder=\"Filter by feature keys\"\n              [showToggleAll]=\"true\"\n              [showHeader]=\"true\"\n              [maxSelectedLabels]=\"2\"\n              selectedItemsLabel=\"{0} feature keys selected\"\n              [(ngModel)]=\"selectedFeatureKeys\"\n              [options]=\"searchOptions\"\n              (onChange)=\"onSearchOptionChange($event)\"\n              appendTo=\"body\">\n            </p-multiSelect>\n          </div>\n          <div class=\"col-12 col-sm-4\">\n            <p-select\n              inputId=\"subscriptions-list-status\"\n              [options]=\"subscriptionStatus\"\n              [placeholder]=\"'Filter by status'\"\n              (onChange)=\"filterByStatus($event.value)\"\n              [(ngModel)]=\"status\"\n              appendTo=\"body\">\n            </p-select>\n          </div>\n          <div class=\"text-end\">\n            <label for=\"subscriptions-list-search\" class=\"visually-hidden\">Search Subscription</label>\n            <p-iconfield iconPosition=\"left\">\n              <p-inputicon><i class=\"fa fa-search\" aria-hidden=\"true\"></i></p-inputicon>\n              <input type=\"text\"\n                id=\"subscriptions-list-search\"\n                name=\"subscriptions-list-search\"\n                [(ngModel)]=\"searchText\"\n                pInputText\n                placeholder=\"Search Subscription...\"\n                (input)=\"dt.filterGlobal($event.target.value, 'contains')\" />\n            </p-iconfield>\n          </div>\n        </div>\n      </ng-template>\n      <ng-template pTemplate=\"header\">\n        <tr>\n          <th scope=\"true\"\n            pSortableColumn=\"id\">\n            {{ 'Admin.Subscriptions.Id' | transloco }}\n            <p-sortIcon field=\"id\"></p-sortIcon>\n          </th>\n          <th scope=\"true\"\n            pSortableColumn=\"organisation\">\n            {{ 'Admin.Subscriptions.Organization' | transloco }}\n            <p-sortIcon field=\"organisation\"></p-sortIcon>\n          </th>\n          <th scope=\"true\"\n            pSortableColumn=\"contact_name\">\n            {{ 'Admin.Subscriptions.ContactName' | transloco }}\n            <p-sortIcon field=\"contact_name\"></p-sortIcon>\n          </th>\n          <th scope=\"true\"\n            pSortableColumn=\"contact_email\">\n            {{ 'Admin.Subscriptions.ContactEmail' | transloco }}\n            <p-sortIcon field=\"contact_email\"></p-sortIcon>\n          </th>\n          <th scope=\"true\">{{ 'Admin.Subscriptions.Product' | transloco }}</th>\n          <th scope=\"true\">{{ 'Admin.Subscriptions.Currency' | transloco }}</th>\n          <th scope=\"true\">{{ 'Admin.Subscriptions.PricePerMonth' | transloco }}</th>\n          <th scope=\"true\"\n            pSortableColumn=\"stripe_customer_id\">\n            {{ 'Admin.Subscriptions.Paid' | transloco }}\n            <p-sortIcon field=\"stripe_customer_id\"></p-sortIcon>\n          </th>\n          <th scope=\"true\">{{ 'Admin.Subscriptions.Billing' | transloco }}</th>\n          <th scope=\"true\"\n            class=\"expires-at-width\">\n            {{ 'Admin.Subscriptions.ExpiresAt' | transloco }}\n          </th>\n          <th scope=\"true\"\n            pSortableColumn=\"sessions_total\">\n            {{ 'Admin.Subscriptions.SessionsTotal' | transloco }}\n            <p-sortIcon field=\"sessions_total\"></p-sortIcon>\n          </th>\n          <th scope=\"true\"\n            pSortableColumn=\"sessions_last_month\">\n            {{ 'Admin.Subscriptions.SessionsTotalLastMonth' | transloco }}\n            <p-sortIcon field=\"sessions_last_month\"></p-sortIcon>\n          </th>\n          <th scope=\"true\"\n            pSortableColumn=\"deleted_at\">\n            {{ 'Admin.Subscriptions.Deleted' | transloco }}\n            <p-sortIcon field=\"deleted_at\"></p-sortIcon>\n          </th>\n          <th class=\"actions-list-two\"\n          scope=\"true\">{{ 'Label.Actions' | transloco }}</th>\n        </tr>\n      </ng-template>\n      <ng-template pTemplate=\"body\"\n        let-item>\n        <tr>\n          <td data-head=\"id\">{{ item.id }}</td>\n          <td data-head=\"Organization\">\n            <span class=\"cursor-pointer custom-break-word\"\n              [pTooltip]=\"item.organisation\"\n            tooltipPosition=\"top\">{{ item.organisation | textTruncate: 20 }}</span>\n          </td>\n          <td data-head=\"ContactName\" class=\"custom-break-word\">\n            <span [pTooltip]=\"item.contact_name\" tooltipPosition=\"top\">{{ item.contact_name | textTruncate: 20 }}</span>\n          </td>\n          <td data-head=\"ContactEmail\">\n            <span [pTooltip]=\"item.contact_email\" tooltipPosition=\"top\">{{ item.contact_email | textTruncate: 20 }}</span>\n          </td>\n          <td data-head=\"Name\">\n            <span class=\"cursor-pointer custom-break-word\"\n              [pTooltip]=\"item.productName\"\n            tooltipPosition=\"top\">{{ item.productName | textTruncate: 20 }}</span>\n          </td>\n          <td data-head=\"Currency\">\n            <span [appDynamicBadge]=\"{ itemsArray: currency, item: item.currency }\"\n              color=\"blue-grey\"\n            class=\"badge\">{{ item.currency }}</span>\n          </td>\n          <td data-head=\"Price/M\">\n            <span>{{ (item.price / 100).toFixed(2) | currency:item.currency }}\n              @if (item?.discount && objectKeys(item?.discount)?.length) {\n                <i\n                  class=\"far fa-info-circle text-muted\"\n                  aria-hidden=\"true\"\n                  [pTooltip]=\"item?.discount | json\"\n                  tooltipPosition=\"top\"\n                ></i>\n              }\n            </span>\n          </td>\n          <td data-head=\"Paid\">\n            @if (item?.unsubscribed_at) {\n              <span class=\"badge bg-warning d-inline-flex align-items-center\">\n                Unsub\n                @if (item?.reason_to_cancel) {\n                  <i class=\"far fa-info-circle ms-2 text-muted\"\n                    [pTooltip]=\"item.reason_to_cancel\"\n                    tooltipPosition=\"top\"\n                  aria-hidden=\"true\"></i>\n                }\n              </span>\n            }\n            @if (!item?.unsubscribed_at) {\n              @if ((item?.stripe_customer_id || item?.external_payment) && item?.signed_up_at) {\n                <span class=\"badge bg-success\">Yes</span>\n              } @else {\n                <span class=\"badge bg-blue-grey\">No</span>\n              }\n            }\n            @if (item?.pause_collection && objectKeys(item?.pause_collection)?.length) {\n              <span\n                class=\"ms-2\"\n                [pTooltip]=\"item?.pause_collection | json\"\n                tooltipPosition=\"top\">\n                <i class=\"fas fa-exclamation-triangle text-warning\"></i>\n              </span>\n            }\n          </td>\n          <td data-head=\"Billing\">\n            <span class=\"badge\"\n              [appDynamicBadge]=\"{\n                              itemsArray: billingFrequency,\n                              item: item?.billingFrequency\n                          }\"\n            color=\"blue-grey\">{{ item.billingFrequency }}</span>\n          </td>\n          <td data-head=\"Expires\">\n            <span [ngClass]=\"getExpiresAtColor(item)\">{{item?.expires_at | dateFormat}}</span>\n            <span>&nbsp;({{item?.created_at | sinceAgo:true}})</span>\n          </td>\n          <td data-head=\"S#\">{{ item?.sessions_total }}</td>\n          <td data-head=\"S/m #\">\n            <span [ngClass]=\"{\n                              'text-danger fw-bold': item?.sessions_last_month < 3\n                          }\">{{ item?.sessions_last_month }}</span>\n          </td>\n          <td data-head=\"Deleted\">\n            @if (item?.deleted_at) {\n              <span\n              class=\"badge bg-danger\">Yes</span>\n            }\n            @if (!item?.deleted_at) {\n              <span\n              class=\"badge bg-blue-grey\">No</span>\n            }\n          </td>\n          <td data-head=\"Action\">\n            <ul class=\"list-unstyled list-inline list-action\">\n              <li ngbTooltip=\"Edit\"\n                class=\"me-2 me-sm-3\"\n                [routerLink]=\"[routers.subscriptionDetails, item.id]\">\n                <i class=\"fa fa-edit edit-icon\" aria-hidden=\"true\"></i>\n              </li>\n              @if (item.deleted) {\n                <li ngbTooltip=\"Reactivate subscription\"\n                  class=\"me-2 me-sm-3\"\n                  *rbacAllow=\"'Pages.Alpha'\"\n                  (keydown.enter)=\"openRecoverSubscriptionModal(item)\"\n                  (click)=\"openRecoverSubscriptionModal(item)\">\n                  <i class=\"fa fa-trash delete-icon text-success\" aria-hidden=\"true\"></i>\n                </li>\n              } @else {\n                <li ngbTooltip=\"Delete\"\n                  class=\"me-2 me-sm-3\"\n                  *rbacAllow=\"'Pages.Admin.Subscription.Delete'\"\n                  (keydown.enter)=\"onDelete(item)\"\n                  (click)=\"onDelete(item)\">\n                  <i class=\"fa fa-trash delete-icon\" aria-hidden=\"true\"></i>\n                </li>\n              }\n            </ul>\n          </td>\n        </tr>\n      </ng-template>\n    </p-table>\n    @if (totalRecords === 0 && totalRecordsUnFiltered !== 0) {\n      <div>\n        <pw-no-data [withImage]=\"true\" [message]=\"'Search.NoDataMessage' | transloco\" [description]=\"'Search.NoDataDescription' | transloco\" >\n        </pw-no-data>\n      </div>\n    }\n    @if (totalRecords !== 0) {\n      <pw-records-summary [showing]=\"dt?.value?.length ?? 0\" [total]=\"totalRecords\" />\n    }\n  </div>\n</div>\n@if (totalRecordsUnFiltered === 0 && isLoaded) {\n  <pw-no-data [withImage]=\"true\" [message]=\"'Admin.Subscriptions.NoSubscriptionMessage' | transloco\">\n  </pw-no-data>\n}\n<pw-password-validation\n  #recoverSubscriptionPasswordModal\n  (successEvent)=\"onRecoverConfirmed()\">\n</pw-password-validation>\n\n", styles: ["@charset \"UTF-8\";:root{--first: rgb(23 105 225);--second: rgb(54 194 131);--third: rgb(255 171 0);--text: rgb(34 34 34);--tabs_bg: rgb(23 105 225);--tabs_sub_bg: rgb(70, 136, 236);--tabs_text: rgb(255 255 255);--titles: rgb(34 34 34);--sidebar_bg: rgb(0, 48, 63);--sidebar_text: rgb(255 255 255)}.table-responsive td{padding:6px 10px!important;font-size:12px!important;line-height:1.35;vertical-align:top;word-break:break-word}.table-responsive th{font-size:12px!important;vertical-align:bottom}.table-responsive td[data-head=Organization],.table-responsive td[data-head=Name],.table-responsive td[data-head=ContactName],.table-responsive td[data-head=ContactEmail],.table-responsive td[data-head=id],.table-responsive td[data-head=\"Price/M\"],.table-responsive td[data-head=\"S#\"],.table-responsive td[data-head=\"S/m #\"]{white-space:nowrap}.table-responsive td[data-head=id]{font-variant-numeric:tabular-nums;color:#7c8696}.table-responsive td[data-head=\"Price/M\"],.table-responsive td[data-head=\"S#\"],.table-responsive td[data-head=\"S/m #\"]{font-variant-numeric:tabular-nums;text-align:right}.table-responsive th:nth-child(7),.table-responsive th:nth-child(11),.table-responsive th:nth-child(12){text-align:right}.table-responsive .badge{font-size:11px;font-weight:600;padding:2px 8px;border-radius:4px;letter-spacing:.01em}.table-responsive .badge[class*=bg-success]{background-color:#e6f4ec!important;color:#0f6b3a!important}.table-responsive .badge[class*=bg-danger]{background-color:#fbeae8!important;color:#c0392b!important}.table-responsive .badge[class*=bg-warning]{background-color:#fbf1e3!important;color:#8a5a00!important}.table-responsive .badge.bg-blue-grey{background-color:#eef0f3!important;color:#5a6473!important}.table-responsive .badge.bg-blue-grey-1{background-color:#e9e6ef!important;color:#473172!important}.table-responsive .badge.bg-blue-grey-2{background-color:#efe6ef!important;color:#723172!important}.table-responsive .badge.bg-blue-grey-3{background-color:#efe6e9!important;color:#723147!important}.table-responsive .badge.bg-blue-grey-4{background-color:#efe9e6!important;color:#724731!important}.table-responsive .badge.bg-blue-grey-5{background-color:#efefe6!important;color:#727231!important}.table-responsive .badge.bg-blue-grey-6{background-color:#e9efe6!important;color:#477231!important}.table-responsive .badge.bg-blue-grey-7{background-color:#e6efe9!important;color:#317247!important}.table-responsive .badge.bg-blue-grey-8{background-color:#e6efef!important;color:#317272!important}.table-responsive .badge.bg-blue-grey-9{background-color:#e6e9ef!important;color:#314772!important}.table-responsive .badge.bg-blue-grey-10{background-color:#e9e6ef!important;color:#473172!important}.table-responsive .badge.bg-blue-grey-11{background-color:#efe6ef!important;color:#723172!important}.table-responsive .badge.bg-blue-grey-12{background-color:#efe6e9!important;color:#723147!important}.table-responsive .badge.bg-blue-grey-13{background-color:#efe9e6!important;color:#724731!important}.table-responsive .badge.bg-blue-grey-14{background-color:#efefe6!important;color:#727231!important}.table-responsive .badge.bg-blue-grey-15{background-color:#e9efe6!important;color:#477231!important}.table-responsive .badge.bg-blue-grey-16{background-color:#e6efe9!important;color:#317247!important}.table-responsive .badge.bg-blue-grey-17{background-color:#e6efef!important;color:#317272!important}.table-responsive .badge.bg-blue-grey-18{background-color:#e6e9ef!important;color:#314772!important}.table-responsive .badge.bg-blue-grey-19{background-color:#e9e6ef!important;color:#473172!important}.table-responsive .badge.bg-blue-grey-20{background-color:#efe6ef!important;color:#723172!important}.table-responsive .badge.bg-blue-grey-21{background-color:#efe6e9!important;color:#723147!important}.table-responsive .badge.bg-blue-grey-22{background-color:#efe9e6!important;color:#724731!important}.table-responsive .badge.bg-blue-grey-23{background-color:#efefe6!important;color:#727231!important}.table-responsive .badge.bg-blue-grey-24{background-color:#e9efe6!important;color:#477231!important}.table-responsive .badge[class*=bg-success]:before,.table-responsive .badge[class*=bg-danger]:before,.table-responsive .badge[class*=bg-warning]:before{content:\"\";display:inline-block;width:6px;height:6px;margin-right:6px;border-radius:50%;background-color:currentColor;vertical-align:middle}.table-responsive tbody tr:hover{background-color:#f5f7fa}.table-responsive td[data-head=Organization] span,.table-responsive td[data-head=Name] span{font-weight:600;color:#1a1d21}.table-responsive td[data-head=Expires] span~span{font-weight:600}.table-responsive .list-action .edit-icon{color:#5a6473}.table-responsive .list-action .delete-icon{color:#c0392b!important}.table-responsive .list-action .delete-icon.text-success{color:#0f6b3a!important}@media(max-width:1199.98px){.table-responsive td,.table-responsive th{white-space:nowrap;word-break:normal}}.expires-at-width{width:8%}.custom-break-word{word-break:break-word!important}.summary{display:flex}.summary .card{width:100%;margin-top:0;margin-bottom:0;padding-bottom:0!important;border:1px solid #e2e5ea;border-radius:8px;box-shadow:none!important;background-color:#fff;transition:background-color .12s ease,border-color .12s ease}.summary .card:hover{background-color:#fafbfc;border-color:#cfd4dc}.summary .card-body{display:flex;flex-direction:column;padding:2px 0}.summary .kpi{display:grid;grid-template-columns:auto minmax(0,1fr);column-gap:12px;align-items:baseline;padding:10px 16px}.summary .kpi+.kpi{border-top:1px solid #eef0f3}.summary .kpi-label{grid-column:1/-1;margin:0 0 4px;font-size:10px;font-weight:600;line-height:1.3;letter-spacing:.05em;text-transform:uppercase;color:#5a6473}.summary .kpi-label .fa-info-circle{margin-left:4px;font-size:15px;color:#a8afbc}.summary .kpi-value{grid-column:1;font-size:18px;font-weight:700;line-height:1.1;color:#1a1d21;font-variant-numeric:tabular-nums}.summary .kpi-comp{grid-column:2;text-align:right;font-size:12px;color:#7c8696;font-variant-numeric:tabular-nums;white-space:normal}.summary .kpi-comp:before{content:\"\\b7\";margin-right:4px;color:#a8afbc}.summary .kpi-comp b{font-weight:600;color:#5a6473}@media(min-width:320px)and (max-width:720px){.primeng-datatable-container .search-filter{display:flex;flex-direction:column;gap:.5rem;justify-content:space-between}}\n"], dependencies: [{ kind: "component", type: i2.Table, selector: "p-table", inputs: ["frozenColumns", "frozenValue", "styleClass", "tableStyle", "tableStyleClass", "paginator", "pageLinks", "rowsPerPageOptions", "alwaysShowPaginator", "paginatorPosition", "paginatorStyleClass", "paginatorDropdownAppendTo", "paginatorDropdownScrollHeight", "currentPageReportTemplate", "showCurrentPageReport", "showJumpToPageDropdown", "showJumpToPageInput", "showFirstLastIcon", "showPageLinks", "defaultSortOrder", "sortMode", "resetPageOnSort", "selectionMode", "selectionPageOnly", "contextMenuSelection", "contextMenuSelectionMode", "dataKey", "metaKeySelection", "rowSelectable", "rowTrackBy", "lazy", "lazyLoadOnInit", "compareSelectionBy", "csvSeparator", "exportFilename", "filters", "globalFilterFields", "filterDelay", "filterLocale", "expandedRowKeys", "editingRowKeys", "rowExpandMode", "scrollable", "rowGroupMode", "scrollHeight", "virtualScroll", "virtualScrollItemSize", "virtualScrollOptions", "virtualScrollDelay", "frozenWidth", "contextMenu", "resizableColumns", "columnResizeMode", "reorderableColumns", "loading", "loadingIcon", "showLoader", "rowHover", "customSort", "showInitialSortBadge", "exportFunction", "exportHeader", "stateKey", "stateStorage", "editMode", "groupRowsBy", "size", "showGridlines", "stripedRows", "groupRowsByOrder", "responsiveLayout", "breakpoint", "paginatorLocale", "value", "columns", "first", "rows", "totalRecords", "sortField", "sortOrder", "multiSortMeta", "selection", "selectAll"], outputs: ["contextMenuSelectionChange", "selectAllChange", "selectionChange", "onRowSelect", "onRowUnselect", "onPage", "onSort", "onFilter", "onLazyLoad", "onRowExpand", "onRowCollapse", "onContextMenuSelect", "onColResize", "onColReorder", "onRowReorder", "onEditInit", "onEditComplete", "onEditCancel", "onHeaderCheckboxToggle", "sortFunction", "firstChange", "rowsChange", "onStateSave", "onStateRestore"] }, { kind: "directive", type: i3$1.PrimeTemplate, selector: "[pTemplate]", inputs: ["type", "pTemplate"] }, { kind: "directive", type: i2.SortableColumn, selector: "[pSortableColumn]", inputs: ["pSortableColumn", "pSortableColumnDisabled"] }, { kind: "component", type: i2.SortIcon, selector: "p-sortIcon", inputs: ["field"] }, { kind: "directive", type: i6$1.Tooltip, selector: "[pTooltip]", inputs: ["tooltipPosition", "tooltipEvent", "positionStyle", "tooltipStyleClass", "tooltipZIndex", "escape", "showDelay", "hideDelay", "life", "positionTop", "positionLeft", "autoHide", "fitContent", "hideOnEscape", "pTooltip", "tooltipDisabled", "tooltipOptions", "appendTo", "ptTooltip", "pTooltipPT", "pTooltipUnstyled"] }, { kind: "component", type: i5.Select, selector: "p-select", inputs: ["id", "scrollHeight", "filter", "panelStyle", "styleClass", "panelStyleClass", "readonly", "editable", "tabindex", "placeholder", "loadingIcon", "filterPlaceholder", "filterLocale", "inputId", "dataKey", "filterBy", "filterFields", "autofocus", "resetFilterOnHide", "checkmark", "dropdownIcon", "loading", "optionLabel", "optionValue", "optionDisabled", "optionGroupLabel", "optionGroupChildren", "group", "showClear", "emptyFilterMessage", "emptyMessage", "lazy", "virtualScroll", "virtualScrollItemSize", "virtualScrollOptions", "overlayOptions", "ariaFilterLabel", "ariaLabel", "ariaLabelledBy", "filterMatchMode", "tooltip", "tooltipPosition", "tooltipPositionStyle", "tooltipStyleClass", "focusOnHover", "selectOnFocus", "autoOptionFocus", "autofocusFilter", "filterValue", "options", "appendTo", "motionOptions"], outputs: ["onChange", "onFilter", "onFocus", "onBlur", "onClick", "onShow", "onHide", "onClear", "onLazyLoad"] }, { kind: "component", type: i6$2.MultiSelect, selector: "p-multiSelect, p-multiselect, p-multi-select", inputs: ["id", "ariaLabel", "styleClass", "panelStyle", "panelStyleClass", "inputId", "readonly", "group", "filter", "filterPlaceHolder", "filterLocale", "overlayVisible", "tabindex", "dataKey", "ariaLabelledBy", "displaySelectedLabel", "maxSelectedLabels", "selectionLimit", "selectedItemsLabel", "showToggleAll", "emptyFilterMessage", "emptyMessage", "resetFilterOnHide", "dropdownIcon", "chipIcon", "optionLabel", "optionValue", "optionDisabled", "optionGroupLabel", "optionGroupChildren", "showHeader", "filterBy", "scrollHeight", "lazy", "virtualScroll", "loading", "virtualScrollItemSize", "loadingIcon", "virtualScrollOptions", "overlayOptions", "ariaFilterLabel", "filterMatchMode", "tooltip", "tooltipPosition", "tooltipPositionStyle", "tooltipStyleClass", "autofocusFilter", "display", "autocomplete", "showClear", "autofocus", "placeholder", "options", "filterValue", "selectAll", "focusOnHover", "filterFields", "selectOnFocus", "autoOptionFocus", "highlightOnSelect", "size", "variant", "fluid", "appendTo", "motionOptions"], outputs: ["onChange", "onFilter", "onFocus", "onBlur", "onClick", "onClear", "onPanelShow", "onPanelHide", "onLazyLoad", "onRemove", "onSelectAllChange"] }, { kind: "directive", type: i4$1.InputText, selector: "[pInputText]", inputs: ["hostName", "ptInputText", "pInputTextPT", "pInputTextUnstyled", "pSize", "variant", "fluid", "invalid"] }, { kind: "component", type: i5$1.IconField, selector: "p-iconfield, p-iconField, p-icon-field", inputs: ["hostName", "iconPosition", "styleClass"] }, { kind: "component", type: i6.InputIcon, selector: "p-inputicon, p-inputIcon", inputs: ["hostName", "styleClass"] }, { kind: "directive", type: i2$1.NgbTooltip, selector: "[ngbTooltip]", inputs: ["animation", "autoClose", "placement", "popperOptions", "triggers", "positionTarget", "container", "disableTooltip", "tooltipClass", "tooltipContext", "openDelay", "closeDelay", "ngbTooltip"], outputs: ["shown", "hidden"], exportAs: ["ngbTooltip"] }, { kind: "directive", type: i3.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i9.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { kind: "directive", type: i9.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i9.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "component", type: i10$1.PasswordValidationComponent, selector: "pw-password-validation", inputs: ["confirmMessage", "destructive"], outputs: ["successEvent"] }, { kind: "component", type: i4.ProgressSpinner, selector: "p-progressSpinner, p-progress-spinner, p-progressspinner", inputs: ["styleClass", "strokeWidth", "fill", "animationDuration", "ariaLabel"] }, { kind: "component", type: i10$1.NoDataComponent, selector: "pw-no-data", inputs: ["message", "description", "withImage"] }, { kind: "component", type: i10$1.RecordsSummaryComponent, selector: "pw-records-summary", inputs: ["showing", "total"] }, { kind: "directive", type: i11.DynamicBadgeDirective, selector: "[appDynamicBadge]", inputs: ["appDynamicBadge", "color", "colorByName", "dataName"] }, { kind: "directive", type: i11.RbacAllowDirective, selector: "[rbacAllow]", inputs: ["rbacAllow"] }, { kind: "directive", type: i12.RouterLink, selector: "[routerLink]", inputs: ["target", "queryParams", "fragment", "queryParamsHandling", "state", "info", "relativeTo", "preserveFragment", "skipLocationChange", "replaceUrl", "routerLink"] }, { kind: "pipe", type: i3.JsonPipe, name: "json" }, { kind: "pipe", type: i3.CurrencyPipe, name: "currency" }, { kind: "pipe", type: i13.TranslocoPipe, name: "transloco" }, { kind: "pipe", type: i17.DateFormatPipe, name: "dateFormat" }, { kind: "pipe", type: i17.SinceAgoPipe, name: "sinceAgo" }, { kind: "pipe", type: i17.TextTruncatePipe, name: "textTruncate" }, { kind: "pipe", type: KpiInsightPipe, name: "kpiInsight" }] }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.6", ngImport: i0, type: SubscriptionsListComponent, decorators: [{
             type: Component,
@@ -10684,11 +10681,11 @@ class UserListComponent extends UsersListBaseComponent {
         this.adminService.remove2fa(this.remove2faUserId, this.subscriptionId).subscribe();
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.6", ngImport: i0, type: UserListComponent, deps: [{ token: i1.AdminService }, { token: i1$1.CustomToastService }, { token: i1$1.ProductService }, { token: i0.Injector }, { token: i1$1.AuthService }, { token: i0.ChangeDetectorRef }, { token: i1$1.WindowService }, { token: i10$1.CollapsibleSidebarService }], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.6", type: UserListComponent, isStandalone: false, selector: "pw-admin-user-list", viewQueries: [{ propertyName: "passwordValidationModalForUserDelete", first: true, predicate: ["passwordValidationModalForUserDelete"], descendants: true }, { propertyName: "passwordValidationModalForImpersonate", first: true, predicate: ["passwordValidationModalForImpersonate"], descendants: true }, { propertyName: "passwordValidationModalForRemove2fa", first: true, predicate: ["passwordValidationModalForRemove2fa"], descendants: true }], usesInheritance: true, ngImport: i0, template: "<div class=\"row\">\n  <div class=\"col-12 d-flex justify-content-between align-items-center\">\n    <h2 class=\"card-title p-0 float-start\">Users</h2>\n    <a class=\"btn btn-sm btn-outline-primary float-end\"\n      id=\"btn-create\"\n      *rbacAllow=\"'SuperAdmin'\"\n      [routerLink]=\"[routers.usersDetails + 'add']\">\n      <i class=\"fa fa-plus-circle\" aria-hidden=\"true\"></i> Add User\n    </a>\n  </div>\n</div>\n<div class=\"w-100 text-center mt-3\">\n  @if (!isLoaded) {\n    <p-progressSpinner> </p-progressSpinner>\n  }\n</div>\n<div class=\"primeng-datatable-container actions-collapsed mt-0\" [class.hideTable]=\"totalRecordsUnFiltered === 0\">\n  <div class=\"user-management-table table-responsive\">\n    <p-table #dt\n      [value]=\"users\"\n      [paginator]=\"totalRecords !== 0\"\n      [lazy]=\"true\"\n      [rows]=\"PAGE_SIZE\"\n      [totalRecords]=\"totalRecords\"\n      [loading]=\"loading\"\n      [filterDelay]=\"1000\"\n      (onLazyLoad)=\"onLazyLoad($event)\"\n      [customSort]=\"true\">\n      <ng-template pTemplate=\"caption\">\n        <div class=\"search-filter\">\n          <div class=\"col-sm-4\">\n            <p-multiSelect inputId=\"users-list-filter-role-product\"\n              [options]=\"searchOptions\"\n              (onChange)=\"onSearchOptionChange($event)\"\n              placeholder=\"Filter users by role, product, or feature\"\n              [selectionLimit]=\"1\"\n              [(ngModel)]=\"filterSource\"\n              [showToggleAll]=\"true\"\n              [showHeader]=\"true\"\n              appendTo=\"body\">\n            </p-multiSelect>\n          </div>\n          @if (selectedOption) {\n            <div class=\"col-4\"\n              >\n              <p-multiSelect inputId=\"users-list-filter-criteria\"\n                [options]=\"searchDataSource\"\n                (onChange)=\"onSearchCriteria($event)\"\n                [showToggleAll]=\"true\"\n                [(ngModel)]=\"criteria\"\n                [showHeader]=\"true\"\n                placeholder=\"Filter by {{ selectedOption.value }}s\"\n                maxSelectedLabels=\"2\"\n                appendTo=\"body\">\n              </p-multiSelect>\n            </div>\n          }\n          <div class=\"text-end\">\n            <label for=\"users-list-search\" class=\"visually-hidden\">Search User</label>\n            <p-iconfield iconPosition=\"left\">\n              <p-inputicon><i class=\"fa fa-search\" aria-hidden=\"true\"></i></p-inputicon>\n              <input type=\"text\"\n                id=\"users-list-search\"\n                name=\"users-list-search\"\n                [(ngModel)]=\"searchText\"\n                pInputText\n                placeholder=\"Search User...\"\n                data-cy=\"user-search\"\n                (input)=\"dt.filterGlobal($event.target.value, 'contains')\"\n                class=\"wd-90\" />\n            </p-iconfield>\n          </div>\n        </div>\n      </ng-template>\n      <ng-template pTemplate=\"header\">\n        <tr>\n          <th scope=\"true\"\n            pSortableColumn=\"id\">\n            {{ 'Admin.Users.Id' | transloco }}\n            <p-sortIcon field=\"id\"></p-sortIcon>\n          </th>\n          <th scope=\"true\"\n            pSortableColumn=\"first_name\">\n            {{ 'Label.FirstName' | transloco }}\n            <p-sortIcon field=\"first_name\"></p-sortIcon>\n          </th>\n          <th scope=\"true\"\n            pSortableColumn=\"last_name\">\n            {{ 'Label.LastName' | transloco }}\n            <p-sortIcon field=\"last_name\"></p-sortIcon>\n          </th>\n          <th scope=\"true\"\n            pSortableColumn=\"email\">\n            {{ 'Label.Email' | transloco }}\n            <p-sortIcon field=\"email\"></p-sortIcon>\n          </th>\n          <th scope=\"true\"\n            pSortableColumn=\"slug\">\n            {{ 'Admin.Users.Slug' | transloco }}\n            <p-sortIcon field=\"slug\"></p-sortIcon>\n          </th>\n          <th scope=\"true\"\n            pSortableColumn=\"encrypted_password\">\n            {{ 'Admin.Users.EmailConfirm' | transloco }}\n            <p-sortIcon field=\"encrypted_password\"></p-sortIcon>\n          </th>\n\n          <th scope=\"true\"\n            pSortableColumn=\"sessions_last_month\">\n            {{ 'Admin.Subscriptions.SessionsTotalLastMonth' | transloco }}\n            <p-sortIcon field=\"sessions_last_month\"></p-sortIcon>\n          </th>\n          <th scope=\"true\"\n            pSortableColumn=\"last_sign_in_at\">\n            {{ 'Admin.Users.LastLogin' | transloco }}\n            <p-sortIcon field=\"last_sign_in_at\"></p-sortIcon>\n          </th>\n          <th scope=\"true\"\n            pSortableColumn=\"signed_up_at\">\n            {{ 'Admin.Users.RegisteredOn' | transloco }}\n            <p-sortIcon field=\"signed_up_at\"></p-sortIcon>\n          </th>\n          <th scope=\"true\"\n            class=\"actions-list-four\">\n            {{ 'Label.Actions' | transloco }}\n          </th>\n        </tr>\n      </ng-template>\n      <ng-template pTemplate=\"body\"\n        let-user>\n        <tr>\n          <td data-head=\"id\"> {{ user.id }}</td>\n          <td data-head=\"First Name\"><a [routerLink]=\"['/members', user.slug]\">{{ user.first_name }}</a></td>\n          <td data-head=\"Last Name\">{{ user.last_name }}\n            @if (user?.alpha) {\n              <span\n                [pTooltip]=\"'Admin.Users.Tooltip.AlphaIcon'|transloco\"\n                tooltipPosition=\"top\">\n                <i class=\"fa-regular fa-square-a alpha-beta text-warning\"></i>\n              </span>\n            }\n            @if (user?.beta) {\n              <span class=\"ms-2\"\n                [pTooltip]=\"'Admin.Users.Tooltip.BetaIcon'|transloco\"\n                tooltipPosition=\"top\">\n                <i class=\"fa-regular fa-square-b alpha-beta text-primary\" ></i>\n              </span>\n            }\n            @if (user?.cognito_sso_activated) {\n              <span\n                class=\"ms-2\"\n                [pTooltip]=\"'Admin.Users.Tooltip.Cognito' | transloco\"\n                tooltipPosition=\"top\">\n                <i class=\"fa fa-cloud success\" ></i>\n              </span>\n            }\n          </td>\n          <td data-head=\"Email\">{{ user.email }}</td>\n          <td data-head=\"Slug\">{{ user.slug }}</td>\n          <td data-head=\"Email Confirm\">\n            <span [appDynamicBadge]=\"{\n                                itemsArray: [true, false],\n                                item: user?.has_password\n                            }\"\n              color=\"success-danger\"\n            class=\"badge\">{{ user?.has_password ? 'Yes' : 'No' }}</span>\n            @if (user?.blocked) {\n              <span class=\"ms-2\" [pTooltip]=\"'This user has been blocked'\" tooltipPosition=\"top\">\n                <i class=\"fa-solid fa-hexagon-exclamation text-danger hexa-warning\"></i>\n              </span>\n            }\n          </td>\n          <td data-head=\"S/m #\">\n            <span [ngClass]=\"{\n                              'text-danger fw-bold': user?.sessions_last_month < 3\n                          }\">{{ user?.sessions_last_month }}</span>\n          </td>\n          <td data-head=\"Last Login\">\n            @if (user?.current_sign_in_at) {\n              <span>\n                {{ user.current_sign_in_at  | dateFormat }}\n              </span>\n            } @else {\n              {{ user.last_sign_in_at | dateFormat }}\n            }\n          </td>\n          <td data-head=\"Registered On\">{{ user.signed_up_at | dateFormat }}</td>\n          <td data-head=\"Action\">\n            <ul class=\"list-unstyled list-inline list-action\">\n              <li ngbTooltip=\"Impersonate this user\"\n                *rbacAllow=\"'Pages.Alpha'\"\n                class=\"me-2 me-sm-3\">\n                <i\n                  class=\"fas fa-people-arrows fa-lg\"\n                  (click)=\"onImpersonate(user)\"\n                  (keydown.enter)=\"onImpersonate(user)\"\n                  aria-hidden=\"true\"\n                ></i>\n              </li>\n              @if (user?.enable_two_factor_authenticator) {\n                <li ngbTooltip=\"Disable 2FA\"\n                  (click)=\"disable2fa(user?.id)\"\n                  (keydown.enter)=\"disable2fa(user?.id)\"\n                  *rbacAllow=\"'Pages.Alpha'\"\n                  class=\"me-2 me-sm-3\">\n                  <i class=\"fa fa-lock fa-lg success\" aria-hidden=\"true\"></i>\n                </li>\n              }\n              @if (currentUser && user.id !== currentUser.id) {\n                <li ngbTooltip=\"Message\"\n                  *rbacAllow=\"chatPermission\"\n                  class=\"me-2 me-sm-3\"\n                  [routerLink]=\"['/message']\"\n                  [fragment]=\"user.slug\">\n                  <i class=\"fa fa-comments cta1-icon\" aria-hidden=\"true\"></i>\n                </li>\n              }\n              <li ngbTooltip=\"Edit\"\n                *rbacAllow=\"'Pages.Admin.Users.Edit'\"\n                class=\"me-2 me-sm-3\"\n                [routerLink]=\"[routers.usersDetails + user.id]\">\n                <i class=\"fa fa-edit edit-icon\" aria-hidden=\"true\"></i>\n              </li>\n              <li ngbTooltip=\"Delete\"\n                *rbacAllow=\"'Pages.Admin.Users.Delete'\"\n                class=\"me-2 me-sm-3\">\n                <i\n                  class=\"fa fa-trash delete-icon\"\n                  (keydown.enter)=\"onDelete(user)\"\n                  (keydown.space)=\"onDelete(user)\"\n                  (click)=\"onDelete(user)\"\n                  aria-hidden=\"true\"\n                ></i>\n              </li>\n            </ul>\n          </td>\n        </tr>\n      </ng-template>\n    </p-table>\n    @if (totalRecords === 0 && totalRecordsUnFiltered !== 0) {\n      <div>\n        <pw-no-data [withImage]=\"true\" [message]=\"'Search.NoDataMessage' | transloco\" [description]=\"'Search.NoDataDescription' | transloco\">\n        </pw-no-data>\n      </div>\n    }\n    @if (totalRecords !== 0) {\n      <pw-records-summary [showing]=\"dt?.value?.length ?? 0\" [total]=\"totalRecords\" />\n    }\n  </div>\n</div>\n@if (!loading && totalRecordsUnFiltered === 0) {\n  <div>\n    <pw-no-data [withImage]=\"true\" [message]=\"'Admin.Users.NoDataMessage' | transloco\"> </pw-no-data>\n  </div>\n}\n<!-- password validation modal for delete user -->\n<pw-password-validation #passwordValidationModalForUserDelete\n  (successEvent)=\"deleteUser($event)\">\n  <div class=\"row\">\n    <div class=\"col-12\">\n      <p>{{ 'User.Account.Message.ActionCanNotUndone' | transloco }}</p>\n      <p>{{ 'User.Account.Message.ConfirmPassword' | transloco }}</p>\n    </div>\n  </div>\n</pw-password-validation>\n<!-- password validation modal for impersonate -->\n<pw-password-validation #passwordValidationModalForImpersonate\n  (successEvent)=\"onUserImpersonation($event)\">\n</pw-password-validation>\n<!-- password validation modal for remove2fa -->\n<pw-password-validation #passwordValidationModalForRemove2fa\n  (successEvent)=\"remove2fa($event)\">\n</pw-password-validation>\n", styles: ["@charset \"UTF-8\";:root{--first: rgb(23 105 225);--second: rgb(54 194 131);--third: rgb(255 171 0);--text: rgb(34 34 34);--tabs_bg: rgb(23 105 225);--tabs_sub_bg: rgb(70, 136, 236);--tabs_text: rgb(255 255 255);--titles: rgb(34 34 34);--sidebar_bg: rgb(0, 48, 63);--sidebar_text: rgb(255 255 255)}.search-input input{width:100%}.w-150{width:150px}.table-responsive td[data-head=id]{font-variant-numeric:tabular-nums;color:#7c8696}.hexa-warning{font-size:18px;vertical-align:middle}.alpha-beta{font-size:14px}\n"], dependencies: [{ kind: "component", type: i2.Table, selector: "p-table", inputs: ["frozenColumns", "frozenValue", "styleClass", "tableStyle", "tableStyleClass", "paginator", "pageLinks", "rowsPerPageOptions", "alwaysShowPaginator", "paginatorPosition", "paginatorStyleClass", "paginatorDropdownAppendTo", "paginatorDropdownScrollHeight", "currentPageReportTemplate", "showCurrentPageReport", "showJumpToPageDropdown", "showJumpToPageInput", "showFirstLastIcon", "showPageLinks", "defaultSortOrder", "sortMode", "resetPageOnSort", "selectionMode", "selectionPageOnly", "contextMenuSelection", "contextMenuSelectionMode", "dataKey", "metaKeySelection", "rowSelectable", "rowTrackBy", "lazy", "lazyLoadOnInit", "compareSelectionBy", "csvSeparator", "exportFilename", "filters", "globalFilterFields", "filterDelay", "filterLocale", "expandedRowKeys", "editingRowKeys", "rowExpandMode", "scrollable", "rowGroupMode", "scrollHeight", "virtualScroll", "virtualScrollItemSize", "virtualScrollOptions", "virtualScrollDelay", "frozenWidth", "contextMenu", "resizableColumns", "columnResizeMode", "reorderableColumns", "loading", "loadingIcon", "showLoader", "rowHover", "customSort", "showInitialSortBadge", "exportFunction", "exportHeader", "stateKey", "stateStorage", "editMode", "groupRowsBy", "size", "showGridlines", "stripedRows", "groupRowsByOrder", "responsiveLayout", "breakpoint", "paginatorLocale", "value", "columns", "first", "rows", "totalRecords", "sortField", "sortOrder", "multiSortMeta", "selection", "selectAll"], outputs: ["contextMenuSelectionChange", "selectAllChange", "selectionChange", "onRowSelect", "onRowUnselect", "onPage", "onSort", "onFilter", "onLazyLoad", "onRowExpand", "onRowCollapse", "onContextMenuSelect", "onColResize", "onColReorder", "onRowReorder", "onEditInit", "onEditComplete", "onEditCancel", "onHeaderCheckboxToggle", "sortFunction", "firstChange", "rowsChange", "onStateSave", "onStateRestore"] }, { kind: "directive", type: i3$1.PrimeTemplate, selector: "[pTemplate]", inputs: ["type", "pTemplate"] }, { kind: "directive", type: i2.SortableColumn, selector: "[pSortableColumn]", inputs: ["pSortableColumn", "pSortableColumnDisabled"] }, { kind: "component", type: i2.SortIcon, selector: "p-sortIcon", inputs: ["field"] }, { kind: "directive", type: i6$1.Tooltip, selector: "[pTooltip]", inputs: ["tooltipPosition", "tooltipEvent", "positionStyle", "tooltipStyleClass", "tooltipZIndex", "escape", "showDelay", "hideDelay", "life", "positionTop", "positionLeft", "autoHide", "fitContent", "hideOnEscape", "pTooltip", "tooltipDisabled", "tooltipOptions", "appendTo", "ptTooltip", "pTooltipPT", "pTooltipUnstyled"] }, { kind: "component", type: i6$2.MultiSelect, selector: "p-multiSelect, p-multiselect, p-multi-select", inputs: ["id", "ariaLabel", "styleClass", "panelStyle", "panelStyleClass", "inputId", "readonly", "group", "filter", "filterPlaceHolder", "filterLocale", "overlayVisible", "tabindex", "dataKey", "ariaLabelledBy", "displaySelectedLabel", "maxSelectedLabels", "selectionLimit", "selectedItemsLabel", "showToggleAll", "emptyFilterMessage", "emptyMessage", "resetFilterOnHide", "dropdownIcon", "chipIcon", "optionLabel", "optionValue", "optionDisabled", "optionGroupLabel", "optionGroupChildren", "showHeader", "filterBy", "scrollHeight", "lazy", "virtualScroll", "loading", "virtualScrollItemSize", "loadingIcon", "virtualScrollOptions", "overlayOptions", "ariaFilterLabel", "filterMatchMode", "tooltip", "tooltipPosition", "tooltipPositionStyle", "tooltipStyleClass", "autofocusFilter", "display", "autocomplete", "showClear", "autofocus", "placeholder", "options", "filterValue", "selectAll", "focusOnHover", "filterFields", "selectOnFocus", "autoOptionFocus", "highlightOnSelect", "size", "variant", "fluid", "appendTo", "motionOptions"], outputs: ["onChange", "onFilter", "onFocus", "onBlur", "onClick", "onClear", "onPanelShow", "onPanelHide", "onLazyLoad", "onRemove", "onSelectAllChange"] }, { kind: "directive", type: i4$1.InputText, selector: "[pInputText]", inputs: ["hostName", "ptInputText", "pInputTextPT", "pInputTextUnstyled", "pSize", "variant", "fluid", "invalid"] }, { kind: "component", type: i5$1.IconField, selector: "p-iconfield, p-iconField, p-icon-field", inputs: ["hostName", "iconPosition", "styleClass"] }, { kind: "component", type: i6.InputIcon, selector: "p-inputicon, p-inputIcon", inputs: ["hostName", "styleClass"] }, { kind: "directive", type: i2$1.NgbTooltip, selector: "[ngbTooltip]", inputs: ["animation", "autoClose", "placement", "popperOptions", "triggers", "positionTarget", "container", "disableTooltip", "tooltipClass", "tooltipContext", "openDelay", "closeDelay", "ngbTooltip"], outputs: ["shown", "hidden"], exportAs: ["ngbTooltip"] }, { kind: "directive", type: i3.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i9.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { kind: "directive", type: i9.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i9.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "component", type: i10$1.PasswordValidationComponent, selector: "pw-password-validation", inputs: ["confirmMessage"], outputs: ["successEvent"] }, { kind: "component", type: i4.ProgressSpinner, selector: "p-progressSpinner, p-progress-spinner, p-progressspinner", inputs: ["styleClass", "strokeWidth", "fill", "animationDuration", "ariaLabel"] }, { kind: "component", type: i10$1.NoDataComponent, selector: "pw-no-data", inputs: ["message", "description", "withImage"] }, { kind: "component", type: i10$1.RecordsSummaryComponent, selector: "pw-records-summary", inputs: ["showing", "total"] }, { kind: "directive", type: i11.DynamicBadgeDirective, selector: "[appDynamicBadge]", inputs: ["appDynamicBadge", "color", "colorByName", "dataName"] }, { kind: "directive", type: i11.RbacAllowDirective, selector: "[rbacAllow]", inputs: ["rbacAllow"] }, { kind: "directive", type: i12.RouterLink, selector: "[routerLink]", inputs: ["target", "queryParams", "fragment", "queryParamsHandling", "state", "info", "relativeTo", "preserveFragment", "skipLocationChange", "replaceUrl", "routerLink"] }, { kind: "pipe", type: i13.TranslocoPipe, name: "transloco" }, { kind: "pipe", type: i17.DateFormatPipe, name: "dateFormat" }] }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.6", type: UserListComponent, isStandalone: false, selector: "pw-admin-user-list", viewQueries: [{ propertyName: "passwordValidationModalForUserDelete", first: true, predicate: ["passwordValidationModalForUserDelete"], descendants: true }, { propertyName: "passwordValidationModalForImpersonate", first: true, predicate: ["passwordValidationModalForImpersonate"], descendants: true }, { propertyName: "passwordValidationModalForRemove2fa", first: true, predicate: ["passwordValidationModalForRemove2fa"], descendants: true }], usesInheritance: true, ngImport: i0, template: "<div class=\"row\">\n  <div class=\"col-12 d-flex justify-content-between align-items-center\">\n    <h2 class=\"card-title p-0 float-start\">Users</h2>\n    <a class=\"btn btn-sm btn-outline-primary float-end\"\n      id=\"btn-create\"\n      *rbacAllow=\"'SuperAdmin'\"\n      [routerLink]=\"[routers.usersDetails + 'add']\">\n      <i class=\"fa fa-plus-circle\" aria-hidden=\"true\"></i> Add User\n    </a>\n  </div>\n</div>\n<div class=\"w-100 text-center mt-3\">\n  @if (!isLoaded) {\n    <p-progressSpinner> </p-progressSpinner>\n  }\n</div>\n<div class=\"primeng-datatable-container actions-collapsed mt-0\" [class.hideTable]=\"totalRecordsUnFiltered === 0\">\n  <div class=\"user-management-table table-responsive\">\n    <p-table #dt\n      [value]=\"users\"\n      [paginator]=\"totalRecords !== 0\"\n      [lazy]=\"true\"\n      [rows]=\"PAGE_SIZE\"\n      [totalRecords]=\"totalRecords\"\n      [loading]=\"loading\"\n      [filterDelay]=\"1000\"\n      (onLazyLoad)=\"onLazyLoad($event)\"\n      [customSort]=\"true\">\n      <ng-template pTemplate=\"caption\">\n        <div class=\"search-filter\">\n          <div class=\"col-sm-4\">\n            <p-multiSelect inputId=\"users-list-filter-role-product\"\n              [options]=\"searchOptions\"\n              (onChange)=\"onSearchOptionChange($event)\"\n              placeholder=\"Filter users by role, product, or feature\"\n              [selectionLimit]=\"1\"\n              [(ngModel)]=\"filterSource\"\n              [showToggleAll]=\"true\"\n              [showHeader]=\"true\"\n              appendTo=\"body\">\n            </p-multiSelect>\n          </div>\n          @if (selectedOption) {\n            <div class=\"col-4\"\n              >\n              <p-multiSelect inputId=\"users-list-filter-criteria\"\n                [options]=\"searchDataSource\"\n                (onChange)=\"onSearchCriteria($event)\"\n                [showToggleAll]=\"true\"\n                [(ngModel)]=\"criteria\"\n                [showHeader]=\"true\"\n                placeholder=\"Filter by {{ selectedOption.value }}s\"\n                maxSelectedLabels=\"2\"\n                appendTo=\"body\">\n              </p-multiSelect>\n            </div>\n          }\n          <div class=\"text-end\">\n            <label for=\"users-list-search\" class=\"visually-hidden\">Search User</label>\n            <p-iconfield iconPosition=\"left\">\n              <p-inputicon><i class=\"fa fa-search\" aria-hidden=\"true\"></i></p-inputicon>\n              <input type=\"text\"\n                id=\"users-list-search\"\n                name=\"users-list-search\"\n                [(ngModel)]=\"searchText\"\n                pInputText\n                placeholder=\"Search User...\"\n                data-cy=\"user-search\"\n                (input)=\"dt.filterGlobal($event.target.value, 'contains')\"\n                class=\"wd-90\" />\n            </p-iconfield>\n          </div>\n        </div>\n      </ng-template>\n      <ng-template pTemplate=\"header\">\n        <tr>\n          <th scope=\"true\"\n            pSortableColumn=\"id\">\n            {{ 'Admin.Users.Id' | transloco }}\n            <p-sortIcon field=\"id\"></p-sortIcon>\n          </th>\n          <th scope=\"true\"\n            pSortableColumn=\"first_name\">\n            {{ 'Label.FirstName' | transloco }}\n            <p-sortIcon field=\"first_name\"></p-sortIcon>\n          </th>\n          <th scope=\"true\"\n            pSortableColumn=\"last_name\">\n            {{ 'Label.LastName' | transloco }}\n            <p-sortIcon field=\"last_name\"></p-sortIcon>\n          </th>\n          <th scope=\"true\"\n            pSortableColumn=\"email\">\n            {{ 'Label.Email' | transloco }}\n            <p-sortIcon field=\"email\"></p-sortIcon>\n          </th>\n          <th scope=\"true\"\n            pSortableColumn=\"slug\">\n            {{ 'Admin.Users.Slug' | transloco }}\n            <p-sortIcon field=\"slug\"></p-sortIcon>\n          </th>\n          <th scope=\"true\"\n            pSortableColumn=\"encrypted_password\">\n            {{ 'Admin.Users.EmailConfirm' | transloco }}\n            <p-sortIcon field=\"encrypted_password\"></p-sortIcon>\n          </th>\n\n          <th scope=\"true\"\n            pSortableColumn=\"sessions_last_month\">\n            {{ 'Admin.Subscriptions.SessionsTotalLastMonth' | transloco }}\n            <p-sortIcon field=\"sessions_last_month\"></p-sortIcon>\n          </th>\n          <th scope=\"true\"\n            pSortableColumn=\"last_sign_in_at\">\n            {{ 'Admin.Users.LastLogin' | transloco }}\n            <p-sortIcon field=\"last_sign_in_at\"></p-sortIcon>\n          </th>\n          <th scope=\"true\"\n            pSortableColumn=\"signed_up_at\">\n            {{ 'Admin.Users.RegisteredOn' | transloco }}\n            <p-sortIcon field=\"signed_up_at\"></p-sortIcon>\n          </th>\n          <th scope=\"true\"\n            class=\"actions-list-four\">\n            {{ 'Label.Actions' | transloco }}\n          </th>\n        </tr>\n      </ng-template>\n      <ng-template pTemplate=\"body\"\n        let-user>\n        <tr>\n          <td data-head=\"id\"> {{ user.id }}</td>\n          <td data-head=\"First Name\"><a [routerLink]=\"['/members', user.slug]\">{{ user.first_name }}</a></td>\n          <td data-head=\"Last Name\">{{ user.last_name }}\n            @if (user?.alpha) {\n              <span\n                [pTooltip]=\"'Admin.Users.Tooltip.AlphaIcon'|transloco\"\n                tooltipPosition=\"top\">\n                <i class=\"fa-regular fa-square-a alpha-beta text-warning\"></i>\n              </span>\n            }\n            @if (user?.beta) {\n              <span class=\"ms-2\"\n                [pTooltip]=\"'Admin.Users.Tooltip.BetaIcon'|transloco\"\n                tooltipPosition=\"top\">\n                <i class=\"fa-regular fa-square-b alpha-beta text-primary\" ></i>\n              </span>\n            }\n            @if (user?.cognito_sso_activated) {\n              <span\n                class=\"ms-2\"\n                [pTooltip]=\"'Admin.Users.Tooltip.Cognito' | transloco\"\n                tooltipPosition=\"top\">\n                <i class=\"fa fa-cloud success\" ></i>\n              </span>\n            }\n          </td>\n          <td data-head=\"Email\">{{ user.email }}</td>\n          <td data-head=\"Slug\">{{ user.slug }}</td>\n          <td data-head=\"Email Confirm\">\n            <span [appDynamicBadge]=\"{\n                                itemsArray: [true, false],\n                                item: user?.has_password\n                            }\"\n              color=\"success-danger\"\n            class=\"badge\">{{ user?.has_password ? 'Yes' : 'No' }}</span>\n            @if (user?.blocked) {\n              <span class=\"ms-2\" [pTooltip]=\"'This user has been blocked'\" tooltipPosition=\"top\">\n                <i class=\"fa-solid fa-hexagon-exclamation text-danger hexa-warning\"></i>\n              </span>\n            }\n          </td>\n          <td data-head=\"S/m #\">\n            <span [ngClass]=\"{\n                              'text-danger fw-bold': user?.sessions_last_month < 3\n                          }\">{{ user?.sessions_last_month }}</span>\n          </td>\n          <td data-head=\"Last Login\">\n            @if (user?.current_sign_in_at) {\n              <span>\n                {{ user.current_sign_in_at  | dateFormat }}\n              </span>\n            } @else {\n              {{ user.last_sign_in_at | dateFormat }}\n            }\n          </td>\n          <td data-head=\"Registered On\">{{ user.signed_up_at | dateFormat }}</td>\n          <td data-head=\"Action\">\n            <ul class=\"list-unstyled list-inline list-action\">\n              <li ngbTooltip=\"Impersonate this user\"\n                *rbacAllow=\"'Pages.Alpha'\"\n                class=\"me-2 me-sm-3\">\n                <i\n                  class=\"fas fa-people-arrows fa-lg\"\n                  (click)=\"onImpersonate(user)\"\n                  (keydown.enter)=\"onImpersonate(user)\"\n                  aria-hidden=\"true\"\n                ></i>\n              </li>\n              @if (user?.enable_two_factor_authenticator) {\n                <li ngbTooltip=\"Disable 2FA\"\n                  (click)=\"disable2fa(user?.id)\"\n                  (keydown.enter)=\"disable2fa(user?.id)\"\n                  *rbacAllow=\"'Pages.Alpha'\"\n                  class=\"me-2 me-sm-3\">\n                  <i class=\"fa fa-lock fa-lg success\" aria-hidden=\"true\"></i>\n                </li>\n              }\n              @if (currentUser && user.id !== currentUser.id) {\n                <li ngbTooltip=\"Message\"\n                  *rbacAllow=\"chatPermission\"\n                  class=\"me-2 me-sm-3\"\n                  [routerLink]=\"['/message']\"\n                  [fragment]=\"user.slug\">\n                  <i class=\"fa fa-comments cta1-icon\" aria-hidden=\"true\"></i>\n                </li>\n              }\n              <li ngbTooltip=\"Edit\"\n                *rbacAllow=\"'Pages.Admin.Users.Edit'\"\n                class=\"me-2 me-sm-3\"\n                [routerLink]=\"[routers.usersDetails + user.id]\">\n                <i class=\"fa fa-edit edit-icon\" aria-hidden=\"true\"></i>\n              </li>\n              <li ngbTooltip=\"Delete\"\n                *rbacAllow=\"'Pages.Admin.Users.Delete'\"\n                class=\"me-2 me-sm-3\">\n                <i\n                  class=\"fa fa-trash delete-icon\"\n                  (keydown.enter)=\"onDelete(user)\"\n                  (keydown.space)=\"onDelete(user)\"\n                  (click)=\"onDelete(user)\"\n                  aria-hidden=\"true\"\n                ></i>\n              </li>\n            </ul>\n          </td>\n        </tr>\n      </ng-template>\n    </p-table>\n    @if (totalRecords === 0 && totalRecordsUnFiltered !== 0) {\n      <div>\n        <pw-no-data [withImage]=\"true\" [message]=\"'Search.NoDataMessage' | transloco\" [description]=\"'Search.NoDataDescription' | transloco\">\n        </pw-no-data>\n      </div>\n    }\n    @if (totalRecords !== 0) {\n      <pw-records-summary [showing]=\"dt?.value?.length ?? 0\" [total]=\"totalRecords\" />\n    }\n  </div>\n</div>\n@if (!loading && totalRecordsUnFiltered === 0) {\n  <div>\n    <pw-no-data [withImage]=\"true\" [message]=\"'Admin.Users.NoDataMessage' | transloco\"> </pw-no-data>\n  </div>\n}\n<!-- password validation modal for delete user -->\n<pw-password-validation #passwordValidationModalForUserDelete\n  [destructive]=\"true\"\n  (successEvent)=\"deleteUser($event)\">\n</pw-password-validation>\n<!-- password validation modal for impersonate -->\n<pw-password-validation #passwordValidationModalForImpersonate\n  (successEvent)=\"onUserImpersonation($event)\">\n</pw-password-validation>\n<!-- password validation modal for remove2fa -->\n<pw-password-validation #passwordValidationModalForRemove2fa\n  (successEvent)=\"remove2fa($event)\">\n</pw-password-validation>\n", styles: ["@charset \"UTF-8\";:root{--first: rgb(23 105 225);--second: rgb(54 194 131);--third: rgb(255 171 0);--text: rgb(34 34 34);--tabs_bg: rgb(23 105 225);--tabs_sub_bg: rgb(70, 136, 236);--tabs_text: rgb(255 255 255);--titles: rgb(34 34 34);--sidebar_bg: rgb(0, 48, 63);--sidebar_text: rgb(255 255 255)}.search-input input{width:100%}.w-150{width:150px}.table-responsive td[data-head=id]{font-variant-numeric:tabular-nums;color:#7c8696}.hexa-warning{font-size:18px;vertical-align:middle}.alpha-beta{font-size:14px}\n"], dependencies: [{ kind: "component", type: i2.Table, selector: "p-table", inputs: ["frozenColumns", "frozenValue", "styleClass", "tableStyle", "tableStyleClass", "paginator", "pageLinks", "rowsPerPageOptions", "alwaysShowPaginator", "paginatorPosition", "paginatorStyleClass", "paginatorDropdownAppendTo", "paginatorDropdownScrollHeight", "currentPageReportTemplate", "showCurrentPageReport", "showJumpToPageDropdown", "showJumpToPageInput", "showFirstLastIcon", "showPageLinks", "defaultSortOrder", "sortMode", "resetPageOnSort", "selectionMode", "selectionPageOnly", "contextMenuSelection", "contextMenuSelectionMode", "dataKey", "metaKeySelection", "rowSelectable", "rowTrackBy", "lazy", "lazyLoadOnInit", "compareSelectionBy", "csvSeparator", "exportFilename", "filters", "globalFilterFields", "filterDelay", "filterLocale", "expandedRowKeys", "editingRowKeys", "rowExpandMode", "scrollable", "rowGroupMode", "scrollHeight", "virtualScroll", "virtualScrollItemSize", "virtualScrollOptions", "virtualScrollDelay", "frozenWidth", "contextMenu", "resizableColumns", "columnResizeMode", "reorderableColumns", "loading", "loadingIcon", "showLoader", "rowHover", "customSort", "showInitialSortBadge", "exportFunction", "exportHeader", "stateKey", "stateStorage", "editMode", "groupRowsBy", "size", "showGridlines", "stripedRows", "groupRowsByOrder", "responsiveLayout", "breakpoint", "paginatorLocale", "value", "columns", "first", "rows", "totalRecords", "sortField", "sortOrder", "multiSortMeta", "selection", "selectAll"], outputs: ["contextMenuSelectionChange", "selectAllChange", "selectionChange", "onRowSelect", "onRowUnselect", "onPage", "onSort", "onFilter", "onLazyLoad", "onRowExpand", "onRowCollapse", "onContextMenuSelect", "onColResize", "onColReorder", "onRowReorder", "onEditInit", "onEditComplete", "onEditCancel", "onHeaderCheckboxToggle", "sortFunction", "firstChange", "rowsChange", "onStateSave", "onStateRestore"] }, { kind: "directive", type: i3$1.PrimeTemplate, selector: "[pTemplate]", inputs: ["type", "pTemplate"] }, { kind: "directive", type: i2.SortableColumn, selector: "[pSortableColumn]", inputs: ["pSortableColumn", "pSortableColumnDisabled"] }, { kind: "component", type: i2.SortIcon, selector: "p-sortIcon", inputs: ["field"] }, { kind: "directive", type: i6$1.Tooltip, selector: "[pTooltip]", inputs: ["tooltipPosition", "tooltipEvent", "positionStyle", "tooltipStyleClass", "tooltipZIndex", "escape", "showDelay", "hideDelay", "life", "positionTop", "positionLeft", "autoHide", "fitContent", "hideOnEscape", "pTooltip", "tooltipDisabled", "tooltipOptions", "appendTo", "ptTooltip", "pTooltipPT", "pTooltipUnstyled"] }, { kind: "component", type: i6$2.MultiSelect, selector: "p-multiSelect, p-multiselect, p-multi-select", inputs: ["id", "ariaLabel", "styleClass", "panelStyle", "panelStyleClass", "inputId", "readonly", "group", "filter", "filterPlaceHolder", "filterLocale", "overlayVisible", "tabindex", "dataKey", "ariaLabelledBy", "displaySelectedLabel", "maxSelectedLabels", "selectionLimit", "selectedItemsLabel", "showToggleAll", "emptyFilterMessage", "emptyMessage", "resetFilterOnHide", "dropdownIcon", "chipIcon", "optionLabel", "optionValue", "optionDisabled", "optionGroupLabel", "optionGroupChildren", "showHeader", "filterBy", "scrollHeight", "lazy", "virtualScroll", "loading", "virtualScrollItemSize", "loadingIcon", "virtualScrollOptions", "overlayOptions", "ariaFilterLabel", "filterMatchMode", "tooltip", "tooltipPosition", "tooltipPositionStyle", "tooltipStyleClass", "autofocusFilter", "display", "autocomplete", "showClear", "autofocus", "placeholder", "options", "filterValue", "selectAll", "focusOnHover", "filterFields", "selectOnFocus", "autoOptionFocus", "highlightOnSelect", "size", "variant", "fluid", "appendTo", "motionOptions"], outputs: ["onChange", "onFilter", "onFocus", "onBlur", "onClick", "onClear", "onPanelShow", "onPanelHide", "onLazyLoad", "onRemove", "onSelectAllChange"] }, { kind: "directive", type: i4$1.InputText, selector: "[pInputText]", inputs: ["hostName", "ptInputText", "pInputTextPT", "pInputTextUnstyled", "pSize", "variant", "fluid", "invalid"] }, { kind: "component", type: i5$1.IconField, selector: "p-iconfield, p-iconField, p-icon-field", inputs: ["hostName", "iconPosition", "styleClass"] }, { kind: "component", type: i6.InputIcon, selector: "p-inputicon, p-inputIcon", inputs: ["hostName", "styleClass"] }, { kind: "directive", type: i2$1.NgbTooltip, selector: "[ngbTooltip]", inputs: ["animation", "autoClose", "placement", "popperOptions", "triggers", "positionTarget", "container", "disableTooltip", "tooltipClass", "tooltipContext", "openDelay", "closeDelay", "ngbTooltip"], outputs: ["shown", "hidden"], exportAs: ["ngbTooltip"] }, { kind: "directive", type: i3.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i9.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { kind: "directive", type: i9.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i9.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "component", type: i10$1.PasswordValidationComponent, selector: "pw-password-validation", inputs: ["confirmMessage", "destructive"], outputs: ["successEvent"] }, { kind: "component", type: i4.ProgressSpinner, selector: "p-progressSpinner, p-progress-spinner, p-progressspinner", inputs: ["styleClass", "strokeWidth", "fill", "animationDuration", "ariaLabel"] }, { kind: "component", type: i10$1.NoDataComponent, selector: "pw-no-data", inputs: ["message", "description", "withImage"] }, { kind: "component", type: i10$1.RecordsSummaryComponent, selector: "pw-records-summary", inputs: ["showing", "total"] }, { kind: "directive", type: i11.DynamicBadgeDirective, selector: "[appDynamicBadge]", inputs: ["appDynamicBadge", "color", "colorByName", "dataName"] }, { kind: "directive", type: i11.RbacAllowDirective, selector: "[rbacAllow]", inputs: ["rbacAllow"] }, { kind: "directive", type: i12.RouterLink, selector: "[routerLink]", inputs: ["target", "queryParams", "fragment", "queryParamsHandling", "state", "info", "relativeTo", "preserveFragment", "skipLocationChange", "replaceUrl", "routerLink"] }, { kind: "pipe", type: i13.TranslocoPipe, name: "transloco" }, { kind: "pipe", type: i17.DateFormatPipe, name: "dateFormat" }] }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.6", ngImport: i0, type: UserListComponent, decorators: [{
             type: Component,
-            args: [{ selector: 'pw-admin-user-list', standalone: false, template: "<div class=\"row\">\n  <div class=\"col-12 d-flex justify-content-between align-items-center\">\n    <h2 class=\"card-title p-0 float-start\">Users</h2>\n    <a class=\"btn btn-sm btn-outline-primary float-end\"\n      id=\"btn-create\"\n      *rbacAllow=\"'SuperAdmin'\"\n      [routerLink]=\"[routers.usersDetails + 'add']\">\n      <i class=\"fa fa-plus-circle\" aria-hidden=\"true\"></i> Add User\n    </a>\n  </div>\n</div>\n<div class=\"w-100 text-center mt-3\">\n  @if (!isLoaded) {\n    <p-progressSpinner> </p-progressSpinner>\n  }\n</div>\n<div class=\"primeng-datatable-container actions-collapsed mt-0\" [class.hideTable]=\"totalRecordsUnFiltered === 0\">\n  <div class=\"user-management-table table-responsive\">\n    <p-table #dt\n      [value]=\"users\"\n      [paginator]=\"totalRecords !== 0\"\n      [lazy]=\"true\"\n      [rows]=\"PAGE_SIZE\"\n      [totalRecords]=\"totalRecords\"\n      [loading]=\"loading\"\n      [filterDelay]=\"1000\"\n      (onLazyLoad)=\"onLazyLoad($event)\"\n      [customSort]=\"true\">\n      <ng-template pTemplate=\"caption\">\n        <div class=\"search-filter\">\n          <div class=\"col-sm-4\">\n            <p-multiSelect inputId=\"users-list-filter-role-product\"\n              [options]=\"searchOptions\"\n              (onChange)=\"onSearchOptionChange($event)\"\n              placeholder=\"Filter users by role, product, or feature\"\n              [selectionLimit]=\"1\"\n              [(ngModel)]=\"filterSource\"\n              [showToggleAll]=\"true\"\n              [showHeader]=\"true\"\n              appendTo=\"body\">\n            </p-multiSelect>\n          </div>\n          @if (selectedOption) {\n            <div class=\"col-4\"\n              >\n              <p-multiSelect inputId=\"users-list-filter-criteria\"\n                [options]=\"searchDataSource\"\n                (onChange)=\"onSearchCriteria($event)\"\n                [showToggleAll]=\"true\"\n                [(ngModel)]=\"criteria\"\n                [showHeader]=\"true\"\n                placeholder=\"Filter by {{ selectedOption.value }}s\"\n                maxSelectedLabels=\"2\"\n                appendTo=\"body\">\n              </p-multiSelect>\n            </div>\n          }\n          <div class=\"text-end\">\n            <label for=\"users-list-search\" class=\"visually-hidden\">Search User</label>\n            <p-iconfield iconPosition=\"left\">\n              <p-inputicon><i class=\"fa fa-search\" aria-hidden=\"true\"></i></p-inputicon>\n              <input type=\"text\"\n                id=\"users-list-search\"\n                name=\"users-list-search\"\n                [(ngModel)]=\"searchText\"\n                pInputText\n                placeholder=\"Search User...\"\n                data-cy=\"user-search\"\n                (input)=\"dt.filterGlobal($event.target.value, 'contains')\"\n                class=\"wd-90\" />\n            </p-iconfield>\n          </div>\n        </div>\n      </ng-template>\n      <ng-template pTemplate=\"header\">\n        <tr>\n          <th scope=\"true\"\n            pSortableColumn=\"id\">\n            {{ 'Admin.Users.Id' | transloco }}\n            <p-sortIcon field=\"id\"></p-sortIcon>\n          </th>\n          <th scope=\"true\"\n            pSortableColumn=\"first_name\">\n            {{ 'Label.FirstName' | transloco }}\n            <p-sortIcon field=\"first_name\"></p-sortIcon>\n          </th>\n          <th scope=\"true\"\n            pSortableColumn=\"last_name\">\n            {{ 'Label.LastName' | transloco }}\n            <p-sortIcon field=\"last_name\"></p-sortIcon>\n          </th>\n          <th scope=\"true\"\n            pSortableColumn=\"email\">\n            {{ 'Label.Email' | transloco }}\n            <p-sortIcon field=\"email\"></p-sortIcon>\n          </th>\n          <th scope=\"true\"\n            pSortableColumn=\"slug\">\n            {{ 'Admin.Users.Slug' | transloco }}\n            <p-sortIcon field=\"slug\"></p-sortIcon>\n          </th>\n          <th scope=\"true\"\n            pSortableColumn=\"encrypted_password\">\n            {{ 'Admin.Users.EmailConfirm' | transloco }}\n            <p-sortIcon field=\"encrypted_password\"></p-sortIcon>\n          </th>\n\n          <th scope=\"true\"\n            pSortableColumn=\"sessions_last_month\">\n            {{ 'Admin.Subscriptions.SessionsTotalLastMonth' | transloco }}\n            <p-sortIcon field=\"sessions_last_month\"></p-sortIcon>\n          </th>\n          <th scope=\"true\"\n            pSortableColumn=\"last_sign_in_at\">\n            {{ 'Admin.Users.LastLogin' | transloco }}\n            <p-sortIcon field=\"last_sign_in_at\"></p-sortIcon>\n          </th>\n          <th scope=\"true\"\n            pSortableColumn=\"signed_up_at\">\n            {{ 'Admin.Users.RegisteredOn' | transloco }}\n            <p-sortIcon field=\"signed_up_at\"></p-sortIcon>\n          </th>\n          <th scope=\"true\"\n            class=\"actions-list-four\">\n            {{ 'Label.Actions' | transloco }}\n          </th>\n        </tr>\n      </ng-template>\n      <ng-template pTemplate=\"body\"\n        let-user>\n        <tr>\n          <td data-head=\"id\"> {{ user.id }}</td>\n          <td data-head=\"First Name\"><a [routerLink]=\"['/members', user.slug]\">{{ user.first_name }}</a></td>\n          <td data-head=\"Last Name\">{{ user.last_name }}\n            @if (user?.alpha) {\n              <span\n                [pTooltip]=\"'Admin.Users.Tooltip.AlphaIcon'|transloco\"\n                tooltipPosition=\"top\">\n                <i class=\"fa-regular fa-square-a alpha-beta text-warning\"></i>\n              </span>\n            }\n            @if (user?.beta) {\n              <span class=\"ms-2\"\n                [pTooltip]=\"'Admin.Users.Tooltip.BetaIcon'|transloco\"\n                tooltipPosition=\"top\">\n                <i class=\"fa-regular fa-square-b alpha-beta text-primary\" ></i>\n              </span>\n            }\n            @if (user?.cognito_sso_activated) {\n              <span\n                class=\"ms-2\"\n                [pTooltip]=\"'Admin.Users.Tooltip.Cognito' | transloco\"\n                tooltipPosition=\"top\">\n                <i class=\"fa fa-cloud success\" ></i>\n              </span>\n            }\n          </td>\n          <td data-head=\"Email\">{{ user.email }}</td>\n          <td data-head=\"Slug\">{{ user.slug }}</td>\n          <td data-head=\"Email Confirm\">\n            <span [appDynamicBadge]=\"{\n                                itemsArray: [true, false],\n                                item: user?.has_password\n                            }\"\n              color=\"success-danger\"\n            class=\"badge\">{{ user?.has_password ? 'Yes' : 'No' }}</span>\n            @if (user?.blocked) {\n              <span class=\"ms-2\" [pTooltip]=\"'This user has been blocked'\" tooltipPosition=\"top\">\n                <i class=\"fa-solid fa-hexagon-exclamation text-danger hexa-warning\"></i>\n              </span>\n            }\n          </td>\n          <td data-head=\"S/m #\">\n            <span [ngClass]=\"{\n                              'text-danger fw-bold': user?.sessions_last_month < 3\n                          }\">{{ user?.sessions_last_month }}</span>\n          </td>\n          <td data-head=\"Last Login\">\n            @if (user?.current_sign_in_at) {\n              <span>\n                {{ user.current_sign_in_at  | dateFormat }}\n              </span>\n            } @else {\n              {{ user.last_sign_in_at | dateFormat }}\n            }\n          </td>\n          <td data-head=\"Registered On\">{{ user.signed_up_at | dateFormat }}</td>\n          <td data-head=\"Action\">\n            <ul class=\"list-unstyled list-inline list-action\">\n              <li ngbTooltip=\"Impersonate this user\"\n                *rbacAllow=\"'Pages.Alpha'\"\n                class=\"me-2 me-sm-3\">\n                <i\n                  class=\"fas fa-people-arrows fa-lg\"\n                  (click)=\"onImpersonate(user)\"\n                  (keydown.enter)=\"onImpersonate(user)\"\n                  aria-hidden=\"true\"\n                ></i>\n              </li>\n              @if (user?.enable_two_factor_authenticator) {\n                <li ngbTooltip=\"Disable 2FA\"\n                  (click)=\"disable2fa(user?.id)\"\n                  (keydown.enter)=\"disable2fa(user?.id)\"\n                  *rbacAllow=\"'Pages.Alpha'\"\n                  class=\"me-2 me-sm-3\">\n                  <i class=\"fa fa-lock fa-lg success\" aria-hidden=\"true\"></i>\n                </li>\n              }\n              @if (currentUser && user.id !== currentUser.id) {\n                <li ngbTooltip=\"Message\"\n                  *rbacAllow=\"chatPermission\"\n                  class=\"me-2 me-sm-3\"\n                  [routerLink]=\"['/message']\"\n                  [fragment]=\"user.slug\">\n                  <i class=\"fa fa-comments cta1-icon\" aria-hidden=\"true\"></i>\n                </li>\n              }\n              <li ngbTooltip=\"Edit\"\n                *rbacAllow=\"'Pages.Admin.Users.Edit'\"\n                class=\"me-2 me-sm-3\"\n                [routerLink]=\"[routers.usersDetails + user.id]\">\n                <i class=\"fa fa-edit edit-icon\" aria-hidden=\"true\"></i>\n              </li>\n              <li ngbTooltip=\"Delete\"\n                *rbacAllow=\"'Pages.Admin.Users.Delete'\"\n                class=\"me-2 me-sm-3\">\n                <i\n                  class=\"fa fa-trash delete-icon\"\n                  (keydown.enter)=\"onDelete(user)\"\n                  (keydown.space)=\"onDelete(user)\"\n                  (click)=\"onDelete(user)\"\n                  aria-hidden=\"true\"\n                ></i>\n              </li>\n            </ul>\n          </td>\n        </tr>\n      </ng-template>\n    </p-table>\n    @if (totalRecords === 0 && totalRecordsUnFiltered !== 0) {\n      <div>\n        <pw-no-data [withImage]=\"true\" [message]=\"'Search.NoDataMessage' | transloco\" [description]=\"'Search.NoDataDescription' | transloco\">\n        </pw-no-data>\n      </div>\n    }\n    @if (totalRecords !== 0) {\n      <pw-records-summary [showing]=\"dt?.value?.length ?? 0\" [total]=\"totalRecords\" />\n    }\n  </div>\n</div>\n@if (!loading && totalRecordsUnFiltered === 0) {\n  <div>\n    <pw-no-data [withImage]=\"true\" [message]=\"'Admin.Users.NoDataMessage' | transloco\"> </pw-no-data>\n  </div>\n}\n<!-- password validation modal for delete user -->\n<pw-password-validation #passwordValidationModalForUserDelete\n  (successEvent)=\"deleteUser($event)\">\n  <div class=\"row\">\n    <div class=\"col-12\">\n      <p>{{ 'User.Account.Message.ActionCanNotUndone' | transloco }}</p>\n      <p>{{ 'User.Account.Message.ConfirmPassword' | transloco }}</p>\n    </div>\n  </div>\n</pw-password-validation>\n<!-- password validation modal for impersonate -->\n<pw-password-validation #passwordValidationModalForImpersonate\n  (successEvent)=\"onUserImpersonation($event)\">\n</pw-password-validation>\n<!-- password validation modal for remove2fa -->\n<pw-password-validation #passwordValidationModalForRemove2fa\n  (successEvent)=\"remove2fa($event)\">\n</pw-password-validation>\n", styles: ["@charset \"UTF-8\";:root{--first: rgb(23 105 225);--second: rgb(54 194 131);--third: rgb(255 171 0);--text: rgb(34 34 34);--tabs_bg: rgb(23 105 225);--tabs_sub_bg: rgb(70, 136, 236);--tabs_text: rgb(255 255 255);--titles: rgb(34 34 34);--sidebar_bg: rgb(0, 48, 63);--sidebar_text: rgb(255 255 255)}.search-input input{width:100%}.w-150{width:150px}.table-responsive td[data-head=id]{font-variant-numeric:tabular-nums;color:#7c8696}.hexa-warning{font-size:18px;vertical-align:middle}.alpha-beta{font-size:14px}\n"] }]
+            args: [{ selector: 'pw-admin-user-list', standalone: false, template: "<div class=\"row\">\n  <div class=\"col-12 d-flex justify-content-between align-items-center\">\n    <h2 class=\"card-title p-0 float-start\">Users</h2>\n    <a class=\"btn btn-sm btn-outline-primary float-end\"\n      id=\"btn-create\"\n      *rbacAllow=\"'SuperAdmin'\"\n      [routerLink]=\"[routers.usersDetails + 'add']\">\n      <i class=\"fa fa-plus-circle\" aria-hidden=\"true\"></i> Add User\n    </a>\n  </div>\n</div>\n<div class=\"w-100 text-center mt-3\">\n  @if (!isLoaded) {\n    <p-progressSpinner> </p-progressSpinner>\n  }\n</div>\n<div class=\"primeng-datatable-container actions-collapsed mt-0\" [class.hideTable]=\"totalRecordsUnFiltered === 0\">\n  <div class=\"user-management-table table-responsive\">\n    <p-table #dt\n      [value]=\"users\"\n      [paginator]=\"totalRecords !== 0\"\n      [lazy]=\"true\"\n      [rows]=\"PAGE_SIZE\"\n      [totalRecords]=\"totalRecords\"\n      [loading]=\"loading\"\n      [filterDelay]=\"1000\"\n      (onLazyLoad)=\"onLazyLoad($event)\"\n      [customSort]=\"true\">\n      <ng-template pTemplate=\"caption\">\n        <div class=\"search-filter\">\n          <div class=\"col-sm-4\">\n            <p-multiSelect inputId=\"users-list-filter-role-product\"\n              [options]=\"searchOptions\"\n              (onChange)=\"onSearchOptionChange($event)\"\n              placeholder=\"Filter users by role, product, or feature\"\n              [selectionLimit]=\"1\"\n              [(ngModel)]=\"filterSource\"\n              [showToggleAll]=\"true\"\n              [showHeader]=\"true\"\n              appendTo=\"body\">\n            </p-multiSelect>\n          </div>\n          @if (selectedOption) {\n            <div class=\"col-4\"\n              >\n              <p-multiSelect inputId=\"users-list-filter-criteria\"\n                [options]=\"searchDataSource\"\n                (onChange)=\"onSearchCriteria($event)\"\n                [showToggleAll]=\"true\"\n                [(ngModel)]=\"criteria\"\n                [showHeader]=\"true\"\n                placeholder=\"Filter by {{ selectedOption.value }}s\"\n                maxSelectedLabels=\"2\"\n                appendTo=\"body\">\n              </p-multiSelect>\n            </div>\n          }\n          <div class=\"text-end\">\n            <label for=\"users-list-search\" class=\"visually-hidden\">Search User</label>\n            <p-iconfield iconPosition=\"left\">\n              <p-inputicon><i class=\"fa fa-search\" aria-hidden=\"true\"></i></p-inputicon>\n              <input type=\"text\"\n                id=\"users-list-search\"\n                name=\"users-list-search\"\n                [(ngModel)]=\"searchText\"\n                pInputText\n                placeholder=\"Search User...\"\n                data-cy=\"user-search\"\n                (input)=\"dt.filterGlobal($event.target.value, 'contains')\"\n                class=\"wd-90\" />\n            </p-iconfield>\n          </div>\n        </div>\n      </ng-template>\n      <ng-template pTemplate=\"header\">\n        <tr>\n          <th scope=\"true\"\n            pSortableColumn=\"id\">\n            {{ 'Admin.Users.Id' | transloco }}\n            <p-sortIcon field=\"id\"></p-sortIcon>\n          </th>\n          <th scope=\"true\"\n            pSortableColumn=\"first_name\">\n            {{ 'Label.FirstName' | transloco }}\n            <p-sortIcon field=\"first_name\"></p-sortIcon>\n          </th>\n          <th scope=\"true\"\n            pSortableColumn=\"last_name\">\n            {{ 'Label.LastName' | transloco }}\n            <p-sortIcon field=\"last_name\"></p-sortIcon>\n          </th>\n          <th scope=\"true\"\n            pSortableColumn=\"email\">\n            {{ 'Label.Email' | transloco }}\n            <p-sortIcon field=\"email\"></p-sortIcon>\n          </th>\n          <th scope=\"true\"\n            pSortableColumn=\"slug\">\n            {{ 'Admin.Users.Slug' | transloco }}\n            <p-sortIcon field=\"slug\"></p-sortIcon>\n          </th>\n          <th scope=\"true\"\n            pSortableColumn=\"encrypted_password\">\n            {{ 'Admin.Users.EmailConfirm' | transloco }}\n            <p-sortIcon field=\"encrypted_password\"></p-sortIcon>\n          </th>\n\n          <th scope=\"true\"\n            pSortableColumn=\"sessions_last_month\">\n            {{ 'Admin.Subscriptions.SessionsTotalLastMonth' | transloco }}\n            <p-sortIcon field=\"sessions_last_month\"></p-sortIcon>\n          </th>\n          <th scope=\"true\"\n            pSortableColumn=\"last_sign_in_at\">\n            {{ 'Admin.Users.LastLogin' | transloco }}\n            <p-sortIcon field=\"last_sign_in_at\"></p-sortIcon>\n          </th>\n          <th scope=\"true\"\n            pSortableColumn=\"signed_up_at\">\n            {{ 'Admin.Users.RegisteredOn' | transloco }}\n            <p-sortIcon field=\"signed_up_at\"></p-sortIcon>\n          </th>\n          <th scope=\"true\"\n            class=\"actions-list-four\">\n            {{ 'Label.Actions' | transloco }}\n          </th>\n        </tr>\n      </ng-template>\n      <ng-template pTemplate=\"body\"\n        let-user>\n        <tr>\n          <td data-head=\"id\"> {{ user.id }}</td>\n          <td data-head=\"First Name\"><a [routerLink]=\"['/members', user.slug]\">{{ user.first_name }}</a></td>\n          <td data-head=\"Last Name\">{{ user.last_name }}\n            @if (user?.alpha) {\n              <span\n                [pTooltip]=\"'Admin.Users.Tooltip.AlphaIcon'|transloco\"\n                tooltipPosition=\"top\">\n                <i class=\"fa-regular fa-square-a alpha-beta text-warning\"></i>\n              </span>\n            }\n            @if (user?.beta) {\n              <span class=\"ms-2\"\n                [pTooltip]=\"'Admin.Users.Tooltip.BetaIcon'|transloco\"\n                tooltipPosition=\"top\">\n                <i class=\"fa-regular fa-square-b alpha-beta text-primary\" ></i>\n              </span>\n            }\n            @if (user?.cognito_sso_activated) {\n              <span\n                class=\"ms-2\"\n                [pTooltip]=\"'Admin.Users.Tooltip.Cognito' | transloco\"\n                tooltipPosition=\"top\">\n                <i class=\"fa fa-cloud success\" ></i>\n              </span>\n            }\n          </td>\n          <td data-head=\"Email\">{{ user.email }}</td>\n          <td data-head=\"Slug\">{{ user.slug }}</td>\n          <td data-head=\"Email Confirm\">\n            <span [appDynamicBadge]=\"{\n                                itemsArray: [true, false],\n                                item: user?.has_password\n                            }\"\n              color=\"success-danger\"\n            class=\"badge\">{{ user?.has_password ? 'Yes' : 'No' }}</span>\n            @if (user?.blocked) {\n              <span class=\"ms-2\" [pTooltip]=\"'This user has been blocked'\" tooltipPosition=\"top\">\n                <i class=\"fa-solid fa-hexagon-exclamation text-danger hexa-warning\"></i>\n              </span>\n            }\n          </td>\n          <td data-head=\"S/m #\">\n            <span [ngClass]=\"{\n                              'text-danger fw-bold': user?.sessions_last_month < 3\n                          }\">{{ user?.sessions_last_month }}</span>\n          </td>\n          <td data-head=\"Last Login\">\n            @if (user?.current_sign_in_at) {\n              <span>\n                {{ user.current_sign_in_at  | dateFormat }}\n              </span>\n            } @else {\n              {{ user.last_sign_in_at | dateFormat }}\n            }\n          </td>\n          <td data-head=\"Registered On\">{{ user.signed_up_at | dateFormat }}</td>\n          <td data-head=\"Action\">\n            <ul class=\"list-unstyled list-inline list-action\">\n              <li ngbTooltip=\"Impersonate this user\"\n                *rbacAllow=\"'Pages.Alpha'\"\n                class=\"me-2 me-sm-3\">\n                <i\n                  class=\"fas fa-people-arrows fa-lg\"\n                  (click)=\"onImpersonate(user)\"\n                  (keydown.enter)=\"onImpersonate(user)\"\n                  aria-hidden=\"true\"\n                ></i>\n              </li>\n              @if (user?.enable_two_factor_authenticator) {\n                <li ngbTooltip=\"Disable 2FA\"\n                  (click)=\"disable2fa(user?.id)\"\n                  (keydown.enter)=\"disable2fa(user?.id)\"\n                  *rbacAllow=\"'Pages.Alpha'\"\n                  class=\"me-2 me-sm-3\">\n                  <i class=\"fa fa-lock fa-lg success\" aria-hidden=\"true\"></i>\n                </li>\n              }\n              @if (currentUser && user.id !== currentUser.id) {\n                <li ngbTooltip=\"Message\"\n                  *rbacAllow=\"chatPermission\"\n                  class=\"me-2 me-sm-3\"\n                  [routerLink]=\"['/message']\"\n                  [fragment]=\"user.slug\">\n                  <i class=\"fa fa-comments cta1-icon\" aria-hidden=\"true\"></i>\n                </li>\n              }\n              <li ngbTooltip=\"Edit\"\n                *rbacAllow=\"'Pages.Admin.Users.Edit'\"\n                class=\"me-2 me-sm-3\"\n                [routerLink]=\"[routers.usersDetails + user.id]\">\n                <i class=\"fa fa-edit edit-icon\" aria-hidden=\"true\"></i>\n              </li>\n              <li ngbTooltip=\"Delete\"\n                *rbacAllow=\"'Pages.Admin.Users.Delete'\"\n                class=\"me-2 me-sm-3\">\n                <i\n                  class=\"fa fa-trash delete-icon\"\n                  (keydown.enter)=\"onDelete(user)\"\n                  (keydown.space)=\"onDelete(user)\"\n                  (click)=\"onDelete(user)\"\n                  aria-hidden=\"true\"\n                ></i>\n              </li>\n            </ul>\n          </td>\n        </tr>\n      </ng-template>\n    </p-table>\n    @if (totalRecords === 0 && totalRecordsUnFiltered !== 0) {\n      <div>\n        <pw-no-data [withImage]=\"true\" [message]=\"'Search.NoDataMessage' | transloco\" [description]=\"'Search.NoDataDescription' | transloco\">\n        </pw-no-data>\n      </div>\n    }\n    @if (totalRecords !== 0) {\n      <pw-records-summary [showing]=\"dt?.value?.length ?? 0\" [total]=\"totalRecords\" />\n    }\n  </div>\n</div>\n@if (!loading && totalRecordsUnFiltered === 0) {\n  <div>\n    <pw-no-data [withImage]=\"true\" [message]=\"'Admin.Users.NoDataMessage' | transloco\"> </pw-no-data>\n  </div>\n}\n<!-- password validation modal for delete user -->\n<pw-password-validation #passwordValidationModalForUserDelete\n  [destructive]=\"true\"\n  (successEvent)=\"deleteUser($event)\">\n</pw-password-validation>\n<!-- password validation modal for impersonate -->\n<pw-password-validation #passwordValidationModalForImpersonate\n  (successEvent)=\"onUserImpersonation($event)\">\n</pw-password-validation>\n<!-- password validation modal for remove2fa -->\n<pw-password-validation #passwordValidationModalForRemove2fa\n  (successEvent)=\"remove2fa($event)\">\n</pw-password-validation>\n", styles: ["@charset \"UTF-8\";:root{--first: rgb(23 105 225);--second: rgb(54 194 131);--third: rgb(255 171 0);--text: rgb(34 34 34);--tabs_bg: rgb(23 105 225);--tabs_sub_bg: rgb(70, 136, 236);--tabs_text: rgb(255 255 255);--titles: rgb(34 34 34);--sidebar_bg: rgb(0, 48, 63);--sidebar_text: rgb(255 255 255)}.search-input input{width:100%}.w-150{width:150px}.table-responsive td[data-head=id]{font-variant-numeric:tabular-nums;color:#7c8696}.hexa-warning{font-size:18px;vertical-align:middle}.alpha-beta{font-size:14px}\n"] }]
         }], ctorParameters: () => [{ type: i1.AdminService }, { type: i1$1.CustomToastService }, { type: i1$1.ProductService }, { type: i0.Injector }, { type: i1$1.AuthService }, { type: i0.ChangeDetectorRef }, { type: i1$1.WindowService }, { type: i10$1.CollapsibleSidebarService }], propDecorators: { passwordValidationModalForUserDelete: [{
                 type: ViewChild,
                 args: ['passwordValidationModalForUserDelete', { static: false }]