@posiwise/admin-module 0.0.203 → 0.0.204

package/fesm2022/posiwise-admin-module.mjs

@@ -172,6 +172,9 @@ const ROUTERS = {
     loginNotifications: `${baseUrl}/login-notifications/`,
     incidentConfig: `${baseUrl}/incident/list/`,
     incidentDetails: `${baseUrl}/incident/`,
+    featureFlagsConfig: `${baseUrl}/feature-flags/list/`,
+    featureFlagsDetails: `${baseUrl}/feature-flags/`,
+    featureFlagRules: `${baseUrl}/feature-flags/rules/`,
     faqConfig: `${baseUrl}/faq/list/`,
     faqDetails: `${baseUrl}/faq/`,
     inviteUsers: `${baseUrl}/subscriptions/invite-user/`,
@@ -352,11 +355,11 @@ class ContactUsListComponent extends AppBaseComponent {
         super.ngOnDestroy();
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.6", ngImport: i0, type: ContactUsListComponent, 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: ContactUsListComponent, isStandalone: false, selector: "pw-contact-us-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\">Contact Us</h2>\n  </div>\n  <div class=\"col-12 mb-3\">\n    <p>The <strong>Contact US</strong> module shows all submissions from the contact forms embedded on select landing pages.<br/>\n  It\u2019s your central hub to track and follow up with interested users or potential leads.</p>\n</div>\n</div>\n@if (!isLoaded) {\n  <div class=\"w-100 text-center mt-3\">\n    <p-progressSpinner strokeWidth=\"2\"> </p-progressSpinner>\n  </div>\n}\n<div class=\"primeng-datatable-container table-responsive mt-0\"\n  [class.hideTable]=\"data.unfiltered_count === 0\">\n  <p-table #tt\n    [value]=\"data.contact_request\"\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=\"search-contact\">\n        <div class=\"col-12 col-sm-3\">\n          <p-select\n            [options]=\"[\n              { label: 'Select status', value: null },\n              { label: 'Open', value: false },\n              { label: 'Closed', value: true }\n            ]\"\n            placeholder=\"Select status\"\n            (onChange)=\"filterClosed($event.value)\">\n          </p-select>\n        </div>\n        <div class=\"text-end ms-auto\">\n          <i class=\"fa fa-search mt-2 me-2\" aria-hidden=\"true\"></i>\n          <label for=\"contact-us-list-search\" class=\"visually-hidden\">Search</label>\n          <input type=\"text\"\n            id=\"contact-us-list-search\"\n            name=\"contact-us-list-search\"\n            pInputText\n            size=\"50\"\n            placeholder=\"Search\"\n            [(ngModel)]=\"searchText\"\n            (input)=\"tt.filterGlobal($event.target.value, 'contains')\" />\n        </div>\n      </div>\n    </ng-template>\n\n    <!-- Column Header -->\n    <ng-template pTemplate=\"header\">\n      <tr>\n        <th scope=\"true\"\n          pSortableColumn=\"created_at\">\n          {{ 'Admin.ContactUs.CreatedAt' | transloco }}\n          <p-sortIcon field=\"created_at\"></p-sortIcon>\n        </th>\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=\"email\">\n          {{ 'Label.Email' | transloco }}\n          <p-sortIcon field=\"email\"></p-sortIcon>\n        </th>\n        <th scope=\"true\"\n          pSortableColumn=\"subject\">\n          {{ 'Admin.ContactUs.Subject' | transloco }}\n          <p-sortIcon field=\"subject\"></p-sortIcon>\n        </th>\n        <th scope=\"true\"\n          pSortableColumn=\"message\">\n          {{ 'Admin.ContactUs.Message' | transloco }}\n          <p-sortIcon field=\"message\"></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=\"created_at\">{{ item?.created_at | dateFormat }}</td>\n        <td data-head=\"name\">{{ item?.name }}</td>\n        <td data-head=\"email\">\n          <a href=\"mailto:{{ item?.email }}\">{{ item?.email }}</a>\n        </td>\n        <td data-head=\"subject\">{{ item?.subject }}</td>\n        <td data-head=\"message\">\n          <span\n            [ngbTooltip]=\"item?.message\"\n            container=\"body\"\n            tooltipClass=\"custom-tooltip\"\n            placement=\"bottom\"\n            >\n            {{ item?.message | textTruncate: 200 }}\n          </span>\n        </td>\n        <td data-head=\"Action\">\n          <ul class=\"list-unstyled list-inline list-action\">\n            @if (!item.closed) {\n              <li\n                ngbTooltip=\"Close\"\n                class=\"me-2 me-sm-3\"\n                (keydown.enter)=\"toggleRecord(item.id, true)\"\n                (click)=\"toggleRecord(item.id, true)\">\n                <i class=\"fa fa-times delete-icon\" aria-hidden=\"true\"></i>\n              </li>\n            }\n            @if (item.closed) {\n              <li\n                ngbTooltip=\"Re Open\"\n                class=\"me-2 me-sm-3\"\n                (keydown.enter)=\"onKeyDown($event, item.id)\"\n                (click)=\"toggleRecord(item.id, false)\">\n                <i class=\"fa fa-retweet edit-icon\" aria-hidden=\"true\"></i>\n              </li>\n            }\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    <span class=\"total-records-count\" >Total: {{ data.object_count }}</span>\n  }\n</div>\n@if (data.unfiltered_count === 0 && isLoaded) {\n  <div>\n    <pw-no-data [withImage]=\"true\" message=\"No Contact Requests\"> </pw-no-data>\n  </div>\n}\n", styles: [".search-contact{display:flex;justify-content:space-between}@media(min-width:320px)and (max-width:720px){.search-contact{display:block}}\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$2.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: i3.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: "directive", type: i4$1.InputText, selector: "[pInputText]", inputs: ["hostName", "ptInputText", "pInputTextPT", "pInputTextUnstyled", "pSize", "variant", "fluid", "invalid"] }, { 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: i6.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: i6.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i6.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: i1$1.NoDataComponent, selector: "pw-no-data", inputs: ["message", "description", "withImage"] }, { kind: "pipe", type: i11.TranslocoPipe, name: "transloco" }, { kind: "pipe", type: i15.DateFormatPipe, name: "dateFormat" }, { kind: "pipe", type: i15.TextTruncatePipe, name: "textTruncate" }] }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.6", type: ContactUsListComponent, isStandalone: false, selector: "pw-contact-us-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\">Contact Us</h2>\n  </div>\n  <div class=\"col-12 mb-3\">\n    <p>The <strong>Contact US</strong> module shows all submissions from the contact forms embedded on select landing pages.<br/>\n  It\u2019s your central hub to track and follow up with interested users or potential leads.</p>\n</div>\n</div>\n@if (!isLoaded) {\n  <div class=\"w-100 text-center mt-3\">\n    <p-progressSpinner strokeWidth=\"2\"> </p-progressSpinner>\n  </div>\n}\n<div class=\"primeng-datatable-container table-responsive mt-0\"\n  [class.hideTable]=\"data.unfiltered_count === 0\">\n  <p-table #tt\n    [value]=\"data.contact_request\"\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=\"search-contact\">\n        <div class=\"col-12 col-sm-3\">\n          <p-select\n            [options]=\"[\n              { label: 'Select status', value: null },\n              { label: 'Open', value: false },\n              { label: 'Closed', value: true }\n            ]\"\n            placeholder=\"Select status\"\n            (onChange)=\"filterClosed($event.value)\"\n            appendTo=\"body\">\n          </p-select>\n        </div>\n        <div class=\"text-end ms-auto\">\n          <i class=\"fa fa-search mt-2 me-2\" aria-hidden=\"true\"></i>\n          <label for=\"contact-us-list-search\" class=\"visually-hidden\">Search</label>\n          <input type=\"text\"\n            id=\"contact-us-list-search\"\n            name=\"contact-us-list-search\"\n            pInputText\n            size=\"50\"\n            placeholder=\"Search\"\n            [(ngModel)]=\"searchText\"\n            (input)=\"tt.filterGlobal($event.target.value, 'contains')\" />\n        </div>\n      </div>\n    </ng-template>\n\n    <!-- Column Header -->\n    <ng-template pTemplate=\"header\">\n      <tr>\n        <th scope=\"true\"\n          pSortableColumn=\"created_at\">\n          {{ 'Admin.ContactUs.CreatedAt' | transloco }}\n          <p-sortIcon field=\"created_at\"></p-sortIcon>\n        </th>\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=\"email\">\n          {{ 'Label.Email' | transloco }}\n          <p-sortIcon field=\"email\"></p-sortIcon>\n        </th>\n        <th scope=\"true\"\n          pSortableColumn=\"subject\">\n          {{ 'Admin.ContactUs.Subject' | transloco }}\n          <p-sortIcon field=\"subject\"></p-sortIcon>\n        </th>\n        <th scope=\"true\"\n          pSortableColumn=\"message\">\n          {{ 'Admin.ContactUs.Message' | transloco }}\n          <p-sortIcon field=\"message\"></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=\"created_at\">{{ item?.created_at | dateFormat }}</td>\n        <td data-head=\"name\">{{ item?.name }}</td>\n        <td data-head=\"email\">\n          <a href=\"mailto:{{ item?.email }}\">{{ item?.email }}</a>\n        </td>\n        <td data-head=\"subject\">{{ item?.subject }}</td>\n        <td data-head=\"message\">\n          <span\n            [ngbTooltip]=\"item?.message\"\n            container=\"body\"\n            tooltipClass=\"custom-tooltip\"\n            placement=\"bottom\"\n            >\n            {{ item?.message | textTruncate: 200 }}\n          </span>\n        </td>\n        <td data-head=\"Action\">\n          <ul class=\"list-unstyled list-inline list-action\">\n            @if (!item.closed) {\n              <li\n                ngbTooltip=\"Close\"\n                class=\"me-2 me-sm-3\"\n                (keydown.enter)=\"toggleRecord(item.id, true)\"\n                (click)=\"toggleRecord(item.id, true)\">\n                <i class=\"fa fa-times delete-icon\" aria-hidden=\"true\"></i>\n              </li>\n            }\n            @if (item.closed) {\n              <li\n                ngbTooltip=\"Re Open\"\n                class=\"me-2 me-sm-3\"\n                (keydown.enter)=\"onKeyDown($event, item.id)\"\n                (click)=\"toggleRecord(item.id, false)\">\n                <i class=\"fa fa-retweet edit-icon\" aria-hidden=\"true\"></i>\n              </li>\n            }\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    <span class=\"total-records-count\" >Total: {{ data.object_count }}</span>\n  }\n</div>\n@if (data.unfiltered_count === 0 && isLoaded) {\n  <div>\n    <pw-no-data [withImage]=\"true\" message=\"No Contact Requests\"> </pw-no-data>\n  </div>\n}\n", styles: [".search-contact{display:flex;justify-content:space-between}@media(min-width:320px)and (max-width:720px){.search-contact{display:block}}\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$2.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: i3.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: "directive", type: i4$1.InputText, selector: "[pInputText]", inputs: ["hostName", "ptInputText", "pInputTextPT", "pInputTextUnstyled", "pSize", "variant", "fluid", "invalid"] }, { 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: i6.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: i6.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i6.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: i1$1.NoDataComponent, selector: "pw-no-data", inputs: ["message", "description", "withImage"] }, { kind: "pipe", type: i11.TranslocoPipe, name: "transloco" }, { kind: "pipe", type: i15.DateFormatPipe, name: "dateFormat" }, { kind: "pipe", type: i15.TextTruncatePipe, name: "textTruncate" }] }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.6", ngImport: i0, type: ContactUsListComponent, decorators: [{
             type: Component,
-            args: [{ selector: 'pw-contact-us-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\">Contact Us</h2>\n  </div>\n  <div class=\"col-12 mb-3\">\n    <p>The <strong>Contact US</strong> module shows all submissions from the contact forms embedded on select landing pages.<br/>\n  It\u2019s your central hub to track and follow up with interested users or potential leads.</p>\n</div>\n</div>\n@if (!isLoaded) {\n  <div class=\"w-100 text-center mt-3\">\n    <p-progressSpinner strokeWidth=\"2\"> </p-progressSpinner>\n  </div>\n}\n<div class=\"primeng-datatable-container table-responsive mt-0\"\n  [class.hideTable]=\"data.unfiltered_count === 0\">\n  <p-table #tt\n    [value]=\"data.contact_request\"\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=\"search-contact\">\n        <div class=\"col-12 col-sm-3\">\n          <p-select\n            [options]=\"[\n              { label: 'Select status', value: null },\n              { label: 'Open', value: false },\n              { label: 'Closed', value: true }\n            ]\"\n            placeholder=\"Select status\"\n            (onChange)=\"filterClosed($event.value)\">\n          </p-select>\n        </div>\n        <div class=\"text-end ms-auto\">\n          <i class=\"fa fa-search mt-2 me-2\" aria-hidden=\"true\"></i>\n          <label for=\"contact-us-list-search\" class=\"visually-hidden\">Search</label>\n          <input type=\"text\"\n            id=\"contact-us-list-search\"\n            name=\"contact-us-list-search\"\n            pInputText\n            size=\"50\"\n            placeholder=\"Search\"\n            [(ngModel)]=\"searchText\"\n            (input)=\"tt.filterGlobal($event.target.value, 'contains')\" />\n        </div>\n      </div>\n    </ng-template>\n\n    <!-- Column Header -->\n    <ng-template pTemplate=\"header\">\n      <tr>\n        <th scope=\"true\"\n          pSortableColumn=\"created_at\">\n          {{ 'Admin.ContactUs.CreatedAt' | transloco }}\n          <p-sortIcon field=\"created_at\"></p-sortIcon>\n        </th>\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=\"email\">\n          {{ 'Label.Email' | transloco }}\n          <p-sortIcon field=\"email\"></p-sortIcon>\n        </th>\n        <th scope=\"true\"\n          pSortableColumn=\"subject\">\n          {{ 'Admin.ContactUs.Subject' | transloco }}\n          <p-sortIcon field=\"subject\"></p-sortIcon>\n        </th>\n        <th scope=\"true\"\n          pSortableColumn=\"message\">\n          {{ 'Admin.ContactUs.Message' | transloco }}\n          <p-sortIcon field=\"message\"></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=\"created_at\">{{ item?.created_at | dateFormat }}</td>\n        <td data-head=\"name\">{{ item?.name }}</td>\n        <td data-head=\"email\">\n          <a href=\"mailto:{{ item?.email }}\">{{ item?.email }}</a>\n        </td>\n        <td data-head=\"subject\">{{ item?.subject }}</td>\n        <td data-head=\"message\">\n          <span\n            [ngbTooltip]=\"item?.message\"\n            container=\"body\"\n            tooltipClass=\"custom-tooltip\"\n            placement=\"bottom\"\n            >\n            {{ item?.message | textTruncate: 200 }}\n          </span>\n        </td>\n        <td data-head=\"Action\">\n          <ul class=\"list-unstyled list-inline list-action\">\n            @if (!item.closed) {\n              <li\n                ngbTooltip=\"Close\"\n                class=\"me-2 me-sm-3\"\n                (keydown.enter)=\"toggleRecord(item.id, true)\"\n                (click)=\"toggleRecord(item.id, true)\">\n                <i class=\"fa fa-times delete-icon\" aria-hidden=\"true\"></i>\n              </li>\n            }\n            @if (item.closed) {\n              <li\n                ngbTooltip=\"Re Open\"\n                class=\"me-2 me-sm-3\"\n                (keydown.enter)=\"onKeyDown($event, item.id)\"\n                (click)=\"toggleRecord(item.id, false)\">\n                <i class=\"fa fa-retweet edit-icon\" aria-hidden=\"true\"></i>\n              </li>\n            }\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    <span class=\"total-records-count\" >Total: {{ data.object_count }}</span>\n  }\n</div>\n@if (data.unfiltered_count === 0 && isLoaded) {\n  <div>\n    <pw-no-data [withImage]=\"true\" message=\"No Contact Requests\"> </pw-no-data>\n  </div>\n}\n", styles: [".search-contact{display:flex;justify-content:space-between}@media(min-width:320px)and (max-width:720px){.search-contact{display:block}}\n"] }]
+            args: [{ selector: 'pw-contact-us-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\">Contact Us</h2>\n  </div>\n  <div class=\"col-12 mb-3\">\n    <p>The <strong>Contact US</strong> module shows all submissions from the contact forms embedded on select landing pages.<br/>\n  It\u2019s your central hub to track and follow up with interested users or potential leads.</p>\n</div>\n</div>\n@if (!isLoaded) {\n  <div class=\"w-100 text-center mt-3\">\n    <p-progressSpinner strokeWidth=\"2\"> </p-progressSpinner>\n  </div>\n}\n<div class=\"primeng-datatable-container table-responsive mt-0\"\n  [class.hideTable]=\"data.unfiltered_count === 0\">\n  <p-table #tt\n    [value]=\"data.contact_request\"\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=\"search-contact\">\n        <div class=\"col-12 col-sm-3\">\n          <p-select\n            [options]=\"[\n              { label: 'Select status', value: null },\n              { label: 'Open', value: false },\n              { label: 'Closed', value: true }\n            ]\"\n            placeholder=\"Select status\"\n            (onChange)=\"filterClosed($event.value)\"\n            appendTo=\"body\">\n          </p-select>\n        </div>\n        <div class=\"text-end ms-auto\">\n          <i class=\"fa fa-search mt-2 me-2\" aria-hidden=\"true\"></i>\n          <label for=\"contact-us-list-search\" class=\"visually-hidden\">Search</label>\n          <input type=\"text\"\n            id=\"contact-us-list-search\"\n            name=\"contact-us-list-search\"\n            pInputText\n            size=\"50\"\n            placeholder=\"Search\"\n            [(ngModel)]=\"searchText\"\n            (input)=\"tt.filterGlobal($event.target.value, 'contains')\" />\n        </div>\n      </div>\n    </ng-template>\n\n    <!-- Column Header -->\n    <ng-template pTemplate=\"header\">\n      <tr>\n        <th scope=\"true\"\n          pSortableColumn=\"created_at\">\n          {{ 'Admin.ContactUs.CreatedAt' | transloco }}\n          <p-sortIcon field=\"created_at\"></p-sortIcon>\n        </th>\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=\"email\">\n          {{ 'Label.Email' | transloco }}\n          <p-sortIcon field=\"email\"></p-sortIcon>\n        </th>\n        <th scope=\"true\"\n          pSortableColumn=\"subject\">\n          {{ 'Admin.ContactUs.Subject' | transloco }}\n          <p-sortIcon field=\"subject\"></p-sortIcon>\n        </th>\n        <th scope=\"true\"\n          pSortableColumn=\"message\">\n          {{ 'Admin.ContactUs.Message' | transloco }}\n          <p-sortIcon field=\"message\"></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=\"created_at\">{{ item?.created_at | dateFormat }}</td>\n        <td data-head=\"name\">{{ item?.name }}</td>\n        <td data-head=\"email\">\n          <a href=\"mailto:{{ item?.email }}\">{{ item?.email }}</a>\n        </td>\n        <td data-head=\"subject\">{{ item?.subject }}</td>\n        <td data-head=\"message\">\n          <span\n            [ngbTooltip]=\"item?.message\"\n            container=\"body\"\n            tooltipClass=\"custom-tooltip\"\n            placement=\"bottom\"\n            >\n            {{ item?.message | textTruncate: 200 }}\n          </span>\n        </td>\n        <td data-head=\"Action\">\n          <ul class=\"list-unstyled list-inline list-action\">\n            @if (!item.closed) {\n              <li\n                ngbTooltip=\"Close\"\n                class=\"me-2 me-sm-3\"\n                (keydown.enter)=\"toggleRecord(item.id, true)\"\n                (click)=\"toggleRecord(item.id, true)\">\n                <i class=\"fa fa-times delete-icon\" aria-hidden=\"true\"></i>\n              </li>\n            }\n            @if (item.closed) {\n              <li\n                ngbTooltip=\"Re Open\"\n                class=\"me-2 me-sm-3\"\n                (keydown.enter)=\"onKeyDown($event, item.id)\"\n                (click)=\"toggleRecord(item.id, false)\">\n                <i class=\"fa fa-retweet edit-icon\" aria-hidden=\"true\"></i>\n              </li>\n            }\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    <span class=\"total-records-count\" >Total: {{ data.object_count }}</span>\n  }\n</div>\n@if (data.unfiltered_count === 0 && isLoaded) {\n  <div>\n    <pw-no-data [withImage]=\"true\" message=\"No Contact Requests\"> </pw-no-data>\n  </div>\n}\n", styles: [".search-contact{display:flex;justify-content:space-between}@media(min-width:320px)and (max-width:720px){.search-contact{display:block}}\n"] }]
         }], ctorParameters: () => [{ type: i0.Injector }, { type: i1.AdminService }, { type: i0.ChangeDetectorRef }] });
 
 class ContactUsTabsComponent {
@@ -2713,6 +2716,371 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.6", ngImpor
                 }]
         }] });
 
+class FeatureFlagDetailsComponent extends AppBaseComponent {
+    constructor(injector, adminService) {
+        super(injector);
+        this.adminService = adminService;
+        this.form = AppAdmin.getFeatureFlagForm();
+        this.routers = ROUTERS;
+        this.id = 0;
+        this.isLoading = true;
+        this.submitted = false;
+        this.buttonBusy = false;
+        this.flagTypeOptions = [];
+        this.statusOptions = [];
+        this.allUsers = [];
+        this.filteredUsers = [];
+    }
+    ngOnInit() {
+        this.subscriptionId = PermissionService.selectedSubscription?.id;
+        this.loadSupportedOptions();
+        this.loadOwners();
+        this.route.params.subscribe(params => {
+            this.id = +params['id'] || 0;
+            if (this.id) {
+                this.getFeatureFlag();
+            }
+            else {
+                this.isLoading = false;
+            }
+        });
+    }
+    loadSupportedOptions() {
+        this.adminService.getSupportedFeatureFlagOptions().subscribe(response => {
+            this.flagTypeOptions = (response.flag_types || []).map(option => ({
+                label: option,
+                value: option
+            }));
+            this.statusOptions = (response.statuses || []).map(option => ({
+                label: option,
+                value: option
+            }));
+        });
+    }
+    loadOwners() {
+        this.adminService
+            .getUsers({}, { subscription_id: this.subscriptionId })
+            .subscribe(response => {
+            this.allUsers = response.users || [];
+            this.allUsers.forEach(user => {
+                const firstName = user.first_name ?? '';
+                const lastName = user.last_name ?? '';
+                user.displayName = `${firstName} ${lastName} ${user.email}`.trim();
+            });
+        });
+    }
+    searchOwners(event) {
+        const query = event.query?.toLowerCase() || '';
+        this.filteredUsers = !query
+            ? [...this.allUsers]
+            : this.allUsers.filter(user => user.displayName.toLowerCase().includes(query));
+    }
+    get f() {
+        return this.form.controls;
+    }
+    getFeatureFlag() {
+        this.adminService.getFeatureFlagById(this.id).subscribe({
+            next: response => {
+                this.form.patchValue({
+                    id: response.id,
+                    key: response.key,
+                    name: response.name,
+                    description: response.description,
+                    flag_type: response.flag_type,
+                    status: response.status,
+                    owner: this.allUsers.find(user => user.email === response.owner) || response.owner,
+                    expires_at: response.expires_at ? new Date(response.expires_at) : null
+                });
+            },
+            complete: () => {
+                this.isLoading = false;
+            }
+        });
+    }
+    onSubmit() {
+        this.form.markAllAsTouched();
+        this.submitted = true;
+        if (!this.form.valid) {
+            return;
+        }
+        this.buttonBusy = true;
+        const formValue = this.form.value;
+        const payload = {
+            ...formValue,
+            owner: typeof formValue.owner === 'string' ? formValue.owner : formValue.owner?.email
+        };
+        const request$ = this.id
+            ? this.adminService.updateFeatureFlag(this.id, payload)
+            : this.adminService.createFeatureFlag(payload);
+        request$.subscribe({
+            next: () => {
+                this.toast.success(this.id
+                    ? 'Feature flag updated successfully.'
+                    : 'Feature flag created successfully.');
+                this.router.navigate([this.routers.featureFlagsConfig]);
+            },
+            complete: () => {
+                this.buttonBusy = false;
+            }
+        });
+    }
+    onCancel() {
+        this.router.navigate([this.routers.featureFlagsConfig]);
+    }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.6", ngImport: i0, type: FeatureFlagDetailsComponent, deps: [{ token: i0.Injector }, { token: i1.AdminService }], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.6", type: FeatureFlagDetailsComponent, isStandalone: false, selector: "pw-feature-flag-details", usesInheritance: true, ngImport: i0, template: "<div class=\"container-fluid pw-tab\">\n  <div class=\"dashboard\">\n    <div class=\"dashboard-body\">\n      <div class=\"me-auto col-xs-6 mt-4\">\n        <a routerLink=\"/admin/feature-flags/list\" class=\"previous\"><i class=\"fa fa-arrow-alt-circle-left\" aria-hidden=\"true\"></i></a>\n        <h3 class=\"mt-3\">{{ id ? 'Edit' : 'Add New' }} Feature Flag</h3>\n      </div>\n\n      @if (isLoading) {\n        <div class=\"w-100 text-center mt-3\">\n          <p-progressSpinner strokeWidth=\"2\"></p-progressSpinner>\n        </div>\n      }\n\n      <div class=\"p-2 mt-3\">\n        @if (!isLoading) {\n        <form (ngSubmit)=\"onSubmit()\" [formGroup]=\"form\">\n          <div class=\"row\">\n            <pw-input-container class=\"col-lg-6\" label=\"Key\" name=\"key\" controlId=\"feature-flag-key\" errorMsg=\"Key is required\"\n              [showTooltip]=\"true\" [tooltipText]=\"'FeatureFlag.Tooltip.Key' | transloco\">\n              <input type=\"text\" id=\"feature-flag-key\" formControlName=\"key\" class=\"form-control\" [ngClass]=\"{ 'is-invalid': submitted && f['key'].errors }\" />\n            </pw-input-container>\n\n            <pw-input-container class=\"col-lg-6\" label=\"Name\" name=\"name\" controlId=\"feature-flag-name\" errorMsg=\"Name is required\"\n              [showTooltip]=\"true\" [tooltipText]=\"'FeatureFlag.Tooltip.Name' | transloco\">\n              <input type=\"text\" id=\"feature-flag-name\" formControlName=\"name\" class=\"form-control\" [ngClass]=\"{ 'is-invalid': submitted && f['name'].errors }\" />\n            </pw-input-container>\n\n            <pw-input-container class=\"col-lg-12\" label=\"Description\" name=\"description\" controlId=\"feature-flag-description\">\n              <textarea id=\"feature-flag-description\" formControlName=\"description\" rows=\"4\" class=\"form-control\"></textarea>\n            </pw-input-container>\n\n            <pw-input-container class=\"col-lg-3\" label=\"Type\" name=\"flag_type\" controlId=\"feature-flag-type\" [useAriaLabelledbyOnly]=\"true\">\n              <p-select [options]=\"flagTypeOptions\" [attr.aria-labelledby]=\"'feature-flag-type-label'\" formControlName=\"flag_type\" class=\"dropdown-bg-transparent\" placeholder=\"Select type\"></p-select>\n            </pw-input-container>\n\n            <pw-input-container class=\"col-lg-3\" label=\"Status\" name=\"status\" controlId=\"feature-flag-status\" [useAriaLabelledbyOnly]=\"true\">\n              <p-select [options]=\"statusOptions\" [attr.aria-labelledby]=\"'feature-flag-status-label'\" formControlName=\"status\" class=\"dropdown-bg-transparent\" placeholder=\"Select status\"></p-select>\n            </pw-input-container>\n\n            <pw-input-container class=\"col-lg-3\" label=\"Owner\" name=\"owner\" controlId=\"feature-flag-owner\" [useAriaLabelledbyOnly]=\"true\">\n              <p-autoComplete\n                [suggestions]=\"filteredUsers\"\n                [attr.aria-labelledby]=\"'feature-flag-owner-label'\"\n                formControlName=\"owner\"\n                dataKey=\"id\"\n                field=\"displayName\"\n                [dropdown]=\"true\"\n                (completeMethod)=\"searchOwners($event)\"\n                styleClass=\"w-100\"\n                placeholder=\"Search owner\"\n                [multiple]=\"false\"\n                autocomplete=\"off\">\n              </p-autoComplete>\n            </pw-input-container>\n\n            <pw-input-container class=\"col-lg-3\" label=\"Expires At\" name=\"expires_at\" controlId=\"feature-flag-expires_at\" [useAriaLabelledbyOnly]=\"true\">\n              <p-calendar inputId=\"feature-flag-expires_at\" formControlName=\"expires_at\" [showIcon]=\"true\" [showTime]=\"true\" [appendTo]=\"'body'\" dateFormat=\"dd-M-yy\"></p-calendar>\n            </pw-input-container>\n          </div>\n\n          <div class=\"row\">\n            <div class=\"col-12 mt-4\">\n              <div class=\"mb-3 text-end\">\n                <button type=\"button\" class=\"btn btn-outline-default me-2\" (click)=\"onCancel()\">{{ 'Button.Cancel' | transloco }}</button>\n                <button class=\"btn btn-primary\" [buttonBusy]=\"buttonBusy\">{{ 'Button.Save' | transloco }}</button>\n              </div>\n            </div>\n          </div>\n        </form>\n        }\n      </div>\n    </div>\n  </div>\n</div>", dependencies: [{ kind: "component", type: i5.AutoComplete, selector: "p-autoComplete, p-autocomplete, p-auto-complete", inputs: ["minLength", "minQueryLength", "delay", "panelStyle", "styleClass", "panelStyleClass", "inputStyle", "inputId", "inputStyleClass", "placeholder", "readonly", "scrollHeight", "lazy", "virtualScroll", "virtualScrollItemSize", "virtualScrollOptions", "autoHighlight", "forceSelection", "type", "autoZIndex", "baseZIndex", "ariaLabel", "dropdownAriaLabel", "ariaLabelledBy", "dropdownIcon", "unique", "group", "completeOnFocus", "showClear", "dropdown", "showEmptyMessage", "dropdownMode", "multiple", "addOnTab", "tabindex", "dataKey", "emptyMessage", "showTransitionOptions", "hideTransitionOptions", "autofocus", "autocomplete", "optionGroupChildren", "optionGroupLabel", "overlayOptions", "suggestions", "optionLabel", "optionValue", "id", "searchMessage", "emptySelectionMessage", "selectionMessage", "autoOptionFocus", "selectOnFocus", "searchLocale", "optionDisabled", "focusOnHover", "typeahead", "addOnBlur", "separator", "appendTo", "motionOptions"], outputs: ["completeMethod", "onSelect", "onUnselect", "onAdd", "onFocus", "onBlur", "onDropdownClick", "onClear", "onInputKeydown", "onKeyUp", "onShow", "onHide", "onLazyLoad"] }, { kind: "component", type: i3.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: "directive", type: i3$1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i6.ɵNgNoValidate, selector: "form:not([ngNoForm]):not([ngNativeValidate])" }, { kind: "directive", type: i6.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: i6.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i6.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],[formArray],form:not([ngNoForm]),[ngForm]" }, { kind: "component", type: i4.ProgressSpinner, selector: "p-progressSpinner, p-progress-spinner, p-progressspinner", inputs: ["styleClass", "strokeWidth", "fill", "animationDuration", "ariaLabel"] }, { kind: "component", type: i1$1.InputContainerComponent, selector: "pw-input-container", inputs: ["name", "controlId", "useAriaLabelledbyOnly", "label", "labelClass", "tooltipPosition", "required", "errorMsg", "isReadOnly", "showTooltip", "tooltipText", "showTriangle", "afterLabel", "showAfterLabel", "showTriangleText", "isLeftTooltip"] }, { kind: "directive", type: i9.ButtonBusyDirective, selector: "[buttonBusy]", inputs: ["buttonBusy", "busyText"] }, { kind: "directive", type: i10.RouterLink, selector: "[routerLink]", inputs: ["target", "queryParams", "fragment", "queryParamsHandling", "state", "info", "relativeTo", "preserveFragment", "skipLocationChange", "replaceUrl", "routerLink"] }, { kind: "directive", type: i6.FormGroupDirective, selector: "[formGroup]", inputs: ["formGroup"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { kind: "directive", type: i6.FormControlName, selector: "[formControlName]", inputs: ["formControlName", "disabled", "ngModel"], outputs: ["ngModelChange"] }, { kind: "pipe", type: i11.TranslocoPipe, name: "transloco" }] }); }
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.6", ngImport: i0, type: FeatureFlagDetailsComponent, decorators: [{
+            type: Component,
+            args: [{ selector: 'pw-feature-flag-details', standalone: false, template: "<div class=\"container-fluid pw-tab\">\n  <div class=\"dashboard\">\n    <div class=\"dashboard-body\">\n      <div class=\"me-auto col-xs-6 mt-4\">\n        <a routerLink=\"/admin/feature-flags/list\" class=\"previous\"><i class=\"fa fa-arrow-alt-circle-left\" aria-hidden=\"true\"></i></a>\n        <h3 class=\"mt-3\">{{ id ? 'Edit' : 'Add New' }} Feature Flag</h3>\n      </div>\n\n      @if (isLoading) {\n        <div class=\"w-100 text-center mt-3\">\n          <p-progressSpinner strokeWidth=\"2\"></p-progressSpinner>\n        </div>\n      }\n\n      <div class=\"p-2 mt-3\">\n        @if (!isLoading) {\n        <form (ngSubmit)=\"onSubmit()\" [formGroup]=\"form\">\n          <div class=\"row\">\n            <pw-input-container class=\"col-lg-6\" label=\"Key\" name=\"key\" controlId=\"feature-flag-key\" errorMsg=\"Key is required\"\n              [showTooltip]=\"true\" [tooltipText]=\"'FeatureFlag.Tooltip.Key' | transloco\">\n              <input type=\"text\" id=\"feature-flag-key\" formControlName=\"key\" class=\"form-control\" [ngClass]=\"{ 'is-invalid': submitted && f['key'].errors }\" />\n            </pw-input-container>\n\n            <pw-input-container class=\"col-lg-6\" label=\"Name\" name=\"name\" controlId=\"feature-flag-name\" errorMsg=\"Name is required\"\n              [showTooltip]=\"true\" [tooltipText]=\"'FeatureFlag.Tooltip.Name' | transloco\">\n              <input type=\"text\" id=\"feature-flag-name\" formControlName=\"name\" class=\"form-control\" [ngClass]=\"{ 'is-invalid': submitted && f['name'].errors }\" />\n            </pw-input-container>\n\n            <pw-input-container class=\"col-lg-12\" label=\"Description\" name=\"description\" controlId=\"feature-flag-description\">\n              <textarea id=\"feature-flag-description\" formControlName=\"description\" rows=\"4\" class=\"form-control\"></textarea>\n            </pw-input-container>\n\n            <pw-input-container class=\"col-lg-3\" label=\"Type\" name=\"flag_type\" controlId=\"feature-flag-type\" [useAriaLabelledbyOnly]=\"true\">\n              <p-select [options]=\"flagTypeOptions\" [attr.aria-labelledby]=\"'feature-flag-type-label'\" formControlName=\"flag_type\" class=\"dropdown-bg-transparent\" placeholder=\"Select type\"></p-select>\n            </pw-input-container>\n\n            <pw-input-container class=\"col-lg-3\" label=\"Status\" name=\"status\" controlId=\"feature-flag-status\" [useAriaLabelledbyOnly]=\"true\">\n              <p-select [options]=\"statusOptions\" [attr.aria-labelledby]=\"'feature-flag-status-label'\" formControlName=\"status\" class=\"dropdown-bg-transparent\" placeholder=\"Select status\"></p-select>\n            </pw-input-container>\n\n            <pw-input-container class=\"col-lg-3\" label=\"Owner\" name=\"owner\" controlId=\"feature-flag-owner\" [useAriaLabelledbyOnly]=\"true\">\n              <p-autoComplete\n                [suggestions]=\"filteredUsers\"\n                [attr.aria-labelledby]=\"'feature-flag-owner-label'\"\n                formControlName=\"owner\"\n                dataKey=\"id\"\n                field=\"displayName\"\n                [dropdown]=\"true\"\n                (completeMethod)=\"searchOwners($event)\"\n                styleClass=\"w-100\"\n                placeholder=\"Search owner\"\n                [multiple]=\"false\"\n                autocomplete=\"off\">\n              </p-autoComplete>\n            </pw-input-container>\n\n            <pw-input-container class=\"col-lg-3\" label=\"Expires At\" name=\"expires_at\" controlId=\"feature-flag-expires_at\" [useAriaLabelledbyOnly]=\"true\">\n              <p-calendar inputId=\"feature-flag-expires_at\" formControlName=\"expires_at\" [showIcon]=\"true\" [showTime]=\"true\" [appendTo]=\"'body'\" dateFormat=\"dd-M-yy\"></p-calendar>\n            </pw-input-container>\n          </div>\n\n          <div class=\"row\">\n            <div class=\"col-12 mt-4\">\n              <div class=\"mb-3 text-end\">\n                <button type=\"button\" class=\"btn btn-outline-default me-2\" (click)=\"onCancel()\">{{ 'Button.Cancel' | transloco }}</button>\n                <button class=\"btn btn-primary\" [buttonBusy]=\"buttonBusy\">{{ 'Button.Save' | transloco }}</button>\n              </div>\n            </div>\n          </div>\n        </form>\n        }\n      </div>\n    </div>\n  </div>\n</div>" }]
+        }], ctorParameters: () => [{ type: i0.Injector }, { type: i1.AdminService }] });
+
+class FeatureFlagRulesComponent extends AppBaseComponent {
+    constructor(injector, adminService) {
+        super(injector);
+        this.adminService = adminService;
+        this.routers = ROUTERS;
+        this.ruleForm = AppAdmin.getFeatureFlagRuleForm();
+        this.featureFlagId = 0;
+        this.featureFlagName = '';
+        this.isLoading = true;
+        this.ruleSubmitted = false;
+        this.ruleButtonBusy = false;
+        this.rules = [];
+        this.editingRuleId = null;
+        this.targetTypeOptions = [];
+        this.environmentOptions = [];
+        this.productFeatureKeyOptions = [];
+    }
+    ngOnInit() {
+        this.route.params.subscribe(params => {
+            this.featureFlagId = +params['id'] || 0;
+            this.loadPageData();
+        });
+    }
+    get rf() {
+        return this.ruleForm.controls;
+    }
+    loadPageData() {
+        if (!this.featureFlagId) {
+            this.isLoading = false;
+            return;
+        }
+        this.isLoading = true;
+        this.loadSupportedOptions();
+        this.loadFeatureFlag();
+        this.loadRules();
+    }
+    loadSupportedOptions() {
+        this.adminService.getSupportedFeatureFlagRuleOptions().subscribe(response => {
+            this.targetTypeOptions = (response.target_types || []).map(option => ({
+                label: option,
+                value: option
+            }));
+            this.environmentOptions = (response.environments || []).map(option => ({
+                label: option,
+                value: option
+            }));
+            this.productFeatureKeyOptions = (response.product_feature_keys || []).map(option => ({
+                label: option,
+                value: option
+            }));
+        });
+    }
+    loadFeatureFlag() {
+        this.adminService.getFeatureFlagById(this.featureFlagId).subscribe({
+            next: response => {
+                this.featureFlagName = response.name || response.key || 'Feature Flag';
+            },
+            complete: () => {
+                this.isLoading = false;
+            }
+        });
+    }
+    loadRules() {
+        this.adminService.getFeatureFlagRules(this.featureFlagId).subscribe(response => {
+            this.rules = response.feature_flag_rules || [];
+        });
+    }
+    editRule(rule) {
+        this.editingRuleId = rule.id;
+        this.ruleForm.patchValue({
+            environment: rule.environment,
+            product_feature_key: rule.product_feature_key,
+            target_type: rule.target_type,
+            target_value: rule.target_value,
+            enabled: rule.enabled,
+            priority: rule.priority,
+            rollout_percentage: rule.rollout_percentage
+        });
+    }
+    resetRuleForm() {
+        this.ruleForm.reset({
+            environment: null,
+            product_feature_key: null,
+            target_type: null,
+            target_value: '',
+            enabled: false,
+            priority: 0,
+            rollout_percentage: null
+        });
+        this.ruleSubmitted = false;
+        this.editingRuleId = null;
+    }
+    saveRule() {
+        this.ruleForm.markAllAsTouched();
+        this.ruleSubmitted = true;
+        if (!this.ruleForm.valid) {
+            return;
+        }
+        this.ruleButtonBusy = true;
+        const payload = this.ruleForm.value;
+        const request$ = this.editingRuleId
+            ? this.adminService.updateFeatureFlagRule(this.featureFlagId, this.editingRuleId, payload)
+            : this.adminService.createFeatureFlagRule(this.featureFlagId, payload);
+        request$.subscribe({
+            next: () => {
+                this.toast.success(this.editingRuleId
+                    ? 'Feature flag rule updated successfully.'
+                    : 'Feature flag rule created successfully.');
+                this.loadRules();
+                this.resetRuleForm();
+            },
+            complete: () => {
+                this.ruleButtonBusy = false;
+            }
+        });
+    }
+    deleteRule(rule) {
+        swal.fire({
+            title: 'Delete feature flag rule?',
+            text: `This will remove the rule with target type ${rule.target_type}.`,
+            icon: 'warning',
+            showCancelButton: true,
+            confirmButtonText: 'Delete'
+        }).then(result => {
+            if (!result.isConfirmed) {
+                return;
+            }
+            this.adminService.deleteFeatureFlagRule(this.featureFlagId, rule.id).subscribe(() => {
+                this.toast.success('Feature flag rule has been destroyed.');
+                this.loadRules();
+                if (this.editingRuleId === rule.id) {
+                    this.resetRuleForm();
+                }
+            });
+        });
+    }
+    backToFlags() {
+        this.router.navigate([this.routers.featureFlagsConfig]);
+    }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.6", ngImport: i0, type: FeatureFlagRulesComponent, deps: [{ token: i0.Injector }, { token: i1.AdminService }], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.6", type: FeatureFlagRulesComponent, isStandalone: false, selector: "pw-feature-flag-rules", usesInheritance: true, ngImport: i0, template: "<div class=\"container-fluid pw-tab\">\n  <div class=\"dashboard\">\n    <div class=\"dashboard-body\">\n      <div class=\"me-auto col-xs-6 mt-4\">\n        <a [routerLink]=\"routers.featureFlagsConfig\" class=\"previous\"><i class=\"fa fa-arrow-alt-circle-left\" aria-hidden=\"true\"></i></a>\n        <h3 class=\"mt-3\">Feature Flag Rules \u2014 {{ featureFlagName }}</h3>\n      </div>\n\n      @if (isLoading) {\n        <div class=\"w-100 text-center mt-3\">\n          <p-progressSpinner strokeWidth=\"2\"></p-progressSpinner>\n        </div>\n      }\n\n      @if (!isLoading) {\n      <div class=\"p-2 mt-3\">\n        <div class=\"d-flex justify-content-between align-items-center mb-3\">\n          <h4 class=\"mb-0\">Manage Rules</h4>\n        </div>\n\n        <form [formGroup]=\"ruleForm\" (ngSubmit)=\"saveRule()\" class=\"mb-4\">\n          <div class=\"row\">\n            <pw-input-container class=\"col-lg-4\" label=\"Environment\" name=\"environment\" controlId=\"feature-flag-rule-environment\" [useAriaLabelledbyOnly]=\"true\">\n              <p-select [options]=\"environmentOptions\" formControlName=\"environment\" class=\"dropdown-bg-transparent\" placeholder=\"Select environment\"></p-select>\n            </pw-input-container>\n\n            <pw-input-container class=\"col-lg-4\" label=\"Product Feature Key\" name=\"product_feature_key\" controlId=\"feature-flag-rule-product_feature_key\" [useAriaLabelledbyOnly]=\"true\">\n              <p-select [options]=\"productFeatureKeyOptions\" formControlName=\"product_feature_key\" class=\"dropdown-bg-transparent\" placeholder=\"Select product feature key\"></p-select>\n            </pw-input-container>\n\n            <pw-input-container class=\"col-lg-4\" label=\"Target Type\" name=\"target_type\" controlId=\"feature-flag-rule-target_type\" errorMsg=\"Target type is required\" [useAriaLabelledbyOnly]=\"true\">\n              <p-select [options]=\"targetTypeOptions\" formControlName=\"target_type\" class=\"dropdown-bg-transparent\" placeholder=\"Select target type\"></p-select>\n            </pw-input-container>\n\n            <pw-input-container class=\"col-lg-4\" label=\"Target Value\" name=\"target_value\" controlId=\"feature-flag-rule-target_value\"\n              [showTooltip]=\"true\" [tooltipText]=\"'FeatureFlag.Tooltip.TargetValue' | transloco\">\n              <input type=\"text\" id=\"feature-flag-rule-target_value\" formControlName=\"target_value\" class=\"form-control\" />\n            </pw-input-container>\n\n            <pw-input-container class=\"col-lg-4\" label=\"Priority\" name=\"priority\" controlId=\"feature-flag-rule-priority\" errorMsg=\"Priority is required\"\n              [showTooltip]=\"true\" [tooltipText]=\"'FeatureFlag.Tooltip.Priority' | transloco\">\n              <input type=\"number\" id=\"feature-flag-rule-priority\" formControlName=\"priority\" class=\"form-control\" [ngClass]=\"{ 'is-invalid': ruleSubmitted && rf['priority'].errors }\" />\n            </pw-input-container>\n\n            <pw-input-container class=\"col-lg-4\" label=\"Rollout Percentage\" name=\"rollout_percentage\" controlId=\"feature-flag-rule-rollout_percentage\"\n              [showTooltip]=\"true\" [tooltipText]=\"'FeatureFlag.Tooltip.RolloutPercentage' | transloco\">\n              <input type=\"number\" id=\"feature-flag-rule-rollout_percentage\" formControlName=\"rollout_percentage\" class=\"form-control\" min=\"0\" max=\"100\" />\n            </pw-input-container>\n\n            <div class=\"col-lg-3 d-flex align-items-end\">\n              <div>\n                <span id=\"feature-flag-rule-enabled-label\" class=\"pw-label-style\">Enabled</span><br />\n                <ui-switch formControlName=\"enabled\" [attr.aria-labelledby]=\"'feature-flag-rule-enabled-label'\"></ui-switch>\n              </div>\n            </div>\n\n            <div class=\"col-lg-9 d-flex align-items-end justify-content-end gap-2\">\n              @if (editingRuleId) {\n              <button type=\"button\" class=\"btn btn-outline-default\" (click)=\"resetRuleForm()\">\n                Cancel editing rule\n              </button>\n              }\n              <button type=\"submit\" class=\"btn btn-primary\" [buttonBusy]=\"ruleButtonBusy\">\n                {{ editingRuleId ? 'Update Rule' : 'Add Rule' }}\n              </button>\n            </div>\n          </div>\n        </form>\n\n        <div class=\"row primeng-datatable-container mt-0\">\n          <div class=\"col-12 px-0\">\n            <p-table [value]=\"rules\">\n              <ng-template pTemplate=\"header\">\n                <tr>\n                  <th>Environment</th>\n                  <th>Product Feature Key</th>\n                  <th>Target Type</th>\n                  <th>Target Value</th>\n                  <th>Enabled</th>\n                  <th>Priority</th>\n                  <th>Rollout %</th>\n                  <th class=\"actions-list-two\">{{ 'Label.Actions' | transloco }}</th>\n                </tr>\n              </ng-template>\n              <ng-template pTemplate=\"body\" let-rule>\n                <tr>\n                  <td>{{ rule.environment || '-' }}</td>\n                  <td>{{ rule.product_feature_key || '-' }}</td>\n                  <td>{{ rule.target_type }}</td>\n                  <td>{{ rule.target_value || '-' }}</td>\n                  <td><span class=\"badge\" [ngClass]=\"rule.enabled ? 'bg-success' : 'bg-secondary'\">{{ rule.enabled }}</span></td>\n                  <td>{{ rule.priority }}</td>\n                  <td>{{ rule.rollout_percentage ?? '-' }}</td>\n                  <td>\n                    <ul class=\"list-unstyled list-inline list-action\">\n                      <li ngbTooltip=\"Edit\" class=\"me-2 me-sm-2\">\n                        <i class=\"fa fa-edit edit-icon\" (click)=\"editRule(rule)\" aria-hidden=\"true\"></i>\n                      </li>\n                      <li ngbTooltip=\"Delete\" class=\"me-2 me-sm-2\">\n                        <i class=\"fa fa-trash delete-icon\" (click)=\"deleteRule(rule)\" aria-hidden=\"true\"></i>\n                      </li>\n                    </ul>\n                  </td>\n                </tr>\n              </ng-template>\n            </p-table>\n            @if (rules.length === 0) {\n            <pw-no-data [withImage]=\"true\" [message]=\"'No feature flag rules found'\"></pw-no-data>\n            }\n          </div>\n        </div>\n      </div>\n      }\n    </div>\n  </div>\n</div>", 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$2.PrimeTemplate, selector: "[pTemplate]", inputs: ["type", "pTemplate"] }, { kind: "component", type: i3.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: "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$1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i6.ɵNgNoValidate, selector: "form:not([ngNoForm]):not([ngNativeValidate])" }, { kind: "directive", type: i6.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: i6.NumberValueAccessor, selector: "input[type=number][formControlName],input[type=number][formControl],input[type=number][ngModel]" }, { kind: "directive", type: i6.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i6.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],[formArray],form:not([ngNoForm]),[ngForm]" }, { kind: "directive", type: i6.MinValidator, selector: "input[type=number][min][formControlName],input[type=number][min][formControl],input[type=number][min][ngModel]", inputs: ["min"] }, { kind: "directive", type: i6.MaxValidator, selector: "input[type=number][max][formControlName],input[type=number][max][formControl],input[type=number][max][ngModel]", inputs: ["max"] }, { kind: "component", type: i7.UiSwitchComponent, selector: "ui-switch", inputs: ["size", "color", "switchOffColor", "switchColor", "defaultBgColor", "defaultBoColor", "checkedLabel", "uncheckedLabel", "checkedTextColor", "uncheckedTextColor", "beforeChange", "ariaLabel", "checked", "disabled", "reverse", "loading"], outputs: ["change", "changeEvent", "valueChange"] }, { kind: "component", type: i4.ProgressSpinner, selector: "p-progressSpinner, p-progress-spinner, p-progressspinner", inputs: ["styleClass", "strokeWidth", "fill", "animationDuration", "ariaLabel"] }, { kind: "component", type: i1$1.InputContainerComponent, selector: "pw-input-container", inputs: ["name", "controlId", "useAriaLabelledbyOnly", "label", "labelClass", "tooltipPosition", "required", "errorMsg", "isReadOnly", "showTooltip", "tooltipText", "showTriangle", "afterLabel", "showAfterLabel", "showTriangleText", "isLeftTooltip"] }, { kind: "component", type: i1$1.NoDataComponent, selector: "pw-no-data", inputs: ["message", "description", "withImage"] }, { kind: "directive", type: i9.ButtonBusyDirective, selector: "[buttonBusy]", inputs: ["buttonBusy", "busyText"] }, { kind: "directive", type: i10.RouterLink, selector: "[routerLink]", inputs: ["target", "queryParams", "fragment", "queryParamsHandling", "state", "info", "relativeTo", "preserveFragment", "skipLocationChange", "replaceUrl", "routerLink"] }, { kind: "directive", type: i6.FormGroupDirective, selector: "[formGroup]", inputs: ["formGroup"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { kind: "directive", type: i6.FormControlName, selector: "[formControlName]", inputs: ["formControlName", "disabled", "ngModel"], outputs: ["ngModelChange"] }, { kind: "pipe", type: i11.TranslocoPipe, name: "transloco" }] }); }
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.6", ngImport: i0, type: FeatureFlagRulesComponent, decorators: [{
+            type: Component,
+            args: [{ selector: 'pw-feature-flag-rules', standalone: false, template: "<div class=\"container-fluid pw-tab\">\n  <div class=\"dashboard\">\n    <div class=\"dashboard-body\">\n      <div class=\"me-auto col-xs-6 mt-4\">\n        <a [routerLink]=\"routers.featureFlagsConfig\" class=\"previous\"><i class=\"fa fa-arrow-alt-circle-left\" aria-hidden=\"true\"></i></a>\n        <h3 class=\"mt-3\">Feature Flag Rules \u2014 {{ featureFlagName }}</h3>\n      </div>\n\n      @if (isLoading) {\n        <div class=\"w-100 text-center mt-3\">\n          <p-progressSpinner strokeWidth=\"2\"></p-progressSpinner>\n        </div>\n      }\n\n      @if (!isLoading) {\n      <div class=\"p-2 mt-3\">\n        <div class=\"d-flex justify-content-between align-items-center mb-3\">\n          <h4 class=\"mb-0\">Manage Rules</h4>\n        </div>\n\n        <form [formGroup]=\"ruleForm\" (ngSubmit)=\"saveRule()\" class=\"mb-4\">\n          <div class=\"row\">\n            <pw-input-container class=\"col-lg-4\" label=\"Environment\" name=\"environment\" controlId=\"feature-flag-rule-environment\" [useAriaLabelledbyOnly]=\"true\">\n              <p-select [options]=\"environmentOptions\" formControlName=\"environment\" class=\"dropdown-bg-transparent\" placeholder=\"Select environment\"></p-select>\n            </pw-input-container>\n\n            <pw-input-container class=\"col-lg-4\" label=\"Product Feature Key\" name=\"product_feature_key\" controlId=\"feature-flag-rule-product_feature_key\" [useAriaLabelledbyOnly]=\"true\">\n              <p-select [options]=\"productFeatureKeyOptions\" formControlName=\"product_feature_key\" class=\"dropdown-bg-transparent\" placeholder=\"Select product feature key\"></p-select>\n            </pw-input-container>\n\n            <pw-input-container class=\"col-lg-4\" label=\"Target Type\" name=\"target_type\" controlId=\"feature-flag-rule-target_type\" errorMsg=\"Target type is required\" [useAriaLabelledbyOnly]=\"true\">\n              <p-select [options]=\"targetTypeOptions\" formControlName=\"target_type\" class=\"dropdown-bg-transparent\" placeholder=\"Select target type\"></p-select>\n            </pw-input-container>\n\n            <pw-input-container class=\"col-lg-4\" label=\"Target Value\" name=\"target_value\" controlId=\"feature-flag-rule-target_value\"\n              [showTooltip]=\"true\" [tooltipText]=\"'FeatureFlag.Tooltip.TargetValue' | transloco\">\n              <input type=\"text\" id=\"feature-flag-rule-target_value\" formControlName=\"target_value\" class=\"form-control\" />\n            </pw-input-container>\n\n            <pw-input-container class=\"col-lg-4\" label=\"Priority\" name=\"priority\" controlId=\"feature-flag-rule-priority\" errorMsg=\"Priority is required\"\n              [showTooltip]=\"true\" [tooltipText]=\"'FeatureFlag.Tooltip.Priority' | transloco\">\n              <input type=\"number\" id=\"feature-flag-rule-priority\" formControlName=\"priority\" class=\"form-control\" [ngClass]=\"{ 'is-invalid': ruleSubmitted && rf['priority'].errors }\" />\n            </pw-input-container>\n\n            <pw-input-container class=\"col-lg-4\" label=\"Rollout Percentage\" name=\"rollout_percentage\" controlId=\"feature-flag-rule-rollout_percentage\"\n              [showTooltip]=\"true\" [tooltipText]=\"'FeatureFlag.Tooltip.RolloutPercentage' | transloco\">\n              <input type=\"number\" id=\"feature-flag-rule-rollout_percentage\" formControlName=\"rollout_percentage\" class=\"form-control\" min=\"0\" max=\"100\" />\n            </pw-input-container>\n\n            <div class=\"col-lg-3 d-flex align-items-end\">\n              <div>\n                <span id=\"feature-flag-rule-enabled-label\" class=\"pw-label-style\">Enabled</span><br />\n                <ui-switch formControlName=\"enabled\" [attr.aria-labelledby]=\"'feature-flag-rule-enabled-label'\"></ui-switch>\n              </div>\n            </div>\n\n            <div class=\"col-lg-9 d-flex align-items-end justify-content-end gap-2\">\n              @if (editingRuleId) {\n              <button type=\"button\" class=\"btn btn-outline-default\" (click)=\"resetRuleForm()\">\n                Cancel editing rule\n              </button>\n              }\n              <button type=\"submit\" class=\"btn btn-primary\" [buttonBusy]=\"ruleButtonBusy\">\n                {{ editingRuleId ? 'Update Rule' : 'Add Rule' }}\n              </button>\n            </div>\n          </div>\n        </form>\n\n        <div class=\"row primeng-datatable-container mt-0\">\n          <div class=\"col-12 px-0\">\n            <p-table [value]=\"rules\">\n              <ng-template pTemplate=\"header\">\n                <tr>\n                  <th>Environment</th>\n                  <th>Product Feature Key</th>\n                  <th>Target Type</th>\n                  <th>Target Value</th>\n                  <th>Enabled</th>\n                  <th>Priority</th>\n                  <th>Rollout %</th>\n                  <th class=\"actions-list-two\">{{ 'Label.Actions' | transloco }}</th>\n                </tr>\n              </ng-template>\n              <ng-template pTemplate=\"body\" let-rule>\n                <tr>\n                  <td>{{ rule.environment || '-' }}</td>\n                  <td>{{ rule.product_feature_key || '-' }}</td>\n                  <td>{{ rule.target_type }}</td>\n                  <td>{{ rule.target_value || '-' }}</td>\n                  <td><span class=\"badge\" [ngClass]=\"rule.enabled ? 'bg-success' : 'bg-secondary'\">{{ rule.enabled }}</span></td>\n                  <td>{{ rule.priority }}</td>\n                  <td>{{ rule.rollout_percentage ?? '-' }}</td>\n                  <td>\n                    <ul class=\"list-unstyled list-inline list-action\">\n                      <li ngbTooltip=\"Edit\" class=\"me-2 me-sm-2\">\n                        <i class=\"fa fa-edit edit-icon\" (click)=\"editRule(rule)\" aria-hidden=\"true\"></i>\n                      </li>\n                      <li ngbTooltip=\"Delete\" class=\"me-2 me-sm-2\">\n                        <i class=\"fa fa-trash delete-icon\" (click)=\"deleteRule(rule)\" aria-hidden=\"true\"></i>\n                      </li>\n                    </ul>\n                  </td>\n                </tr>\n              </ng-template>\n            </p-table>\n            @if (rules.length === 0) {\n            <pw-no-data [withImage]=\"true\" [message]=\"'No feature flag rules found'\"></pw-no-data>\n            }\n          </div>\n        </div>\n      </div>\n      }\n    </div>\n  </div>\n</div>" }]
+        }], ctorParameters: () => [{ type: i0.Injector }, { type: i1.AdminService }] });
+
+class FeatureFlagsListComponent extends AppBaseComponent {
+    constructor(injector, adminService) {
+        super(injector);
+        this.adminService = adminService;
+        this.PAGE_SIZE = PAGE_SIZE;
+        this.routers = ROUTERS;
+        this.buttonBusy = false;
+        this.isLoaded = true;
+        this.searchText = '';
+        this.featureFlags = [];
+        this.totalRecords = 0;
+        this.page = 1;
+    }
+    onLazyLoad(event) {
+        const pageDetails = HelperService.onTableLazyLoad(event);
+        this.page = pageDetails.page;
+        this.loadFeatureFlags({
+            page: pageDetails.page,
+            page_size: PAGE_SIZE,
+            order_by: pageDetails.sortField,
+            order_direction: pageDetails.sortOrder
+        });
+    }
+    loadFeatureFlags(paging) {
+        this.isLoaded = false;
+        this.adminService.getFeatureFlags(paging).subscribe({
+            next: response => {
+                this.featureFlags = response.feature_flags ?? [];
+                this.totalRecords = response.object_count ?? this.featureFlags.length;
+            },
+            complete: () => {
+                this.isLoaded = true;
+            }
+        });
+    }
+    navigateToEdit(item) {
+        this.router.navigate([this.routers.featureFlagsDetails + item.id], {
+            state: { data: item }
+        });
+    }
+    navigateToRules(item) {
+        this.router.navigate([this.routers.featureFlagRules + item.id], {
+            state: { data: item }
+        });
+    }
+    onDelete(item) {
+        swal.fire({
+            title: 'Delete feature flag?',
+            text: `This will remove ${item.name || item.key}.`,
+            icon: 'warning',
+            showCancelButton: true,
+            confirmButtonText: 'Delete'
+        }).then(result => {
+            if (!result.isConfirmed) {
+                return;
+            }
+            this.buttonBusy = true;
+            this.adminService.deleteFeatureFlag(item.id).subscribe({
+                next: () => {
+                    this.toast.success('Feature flag has been destroyed.');
+                    this.loadFeatureFlags({ page: 1, page_size: PAGE_SIZE });
+                },
+                complete: () => {
+                    this.buttonBusy = false;
+                }
+            });
+        });
+    }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.6", ngImport: i0, type: FeatureFlagsListComponent, deps: [{ token: i0.Injector }, { token: i1.AdminService }], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.6", type: FeatureFlagsListComponent, isStandalone: false, selector: "pw-feature-flags-list", usesInheritance: true, ngImport: i0, template: "<div class=\"row\" [class.custom-disable-wrapper]=\"buttonBusy\">\n  <div class=\"col-12 d-flex flex-wrap justify-content-between align-items-center\">\n    <h2 class=\"card-title p-0 float-start\">Feature Flags</h2>\n    <a [routerLink]=\"[routers.featureFlagsDetails + 'add']\" class=\"btn btn-sm btn-outline-primary float-end\">\n      <i class=\"fa fa-plus-circle\" aria-hidden=\"true\"></i> {{ 'Label.AddNew' | transloco }} Feature Flag\n    </a>\n  </div>\n  <div class=\"col-12 mb-3\">\n    <p>Manage feature flags for controlled rollout, testing, and admin-driven enablement.</p>\n  </div>\n</div>\n\n@if (!isLoaded) {\n<div class=\"w-100 text-center mt-3\">\n  <p-progressSpinner strokeWidth=\"2\"></p-progressSpinner>\n</div>\n}\n\n<div class=\"row primeng-datatable-container mt-0\" [class.custom-disable-wrapper]=\"buttonBusy\">\n  <div class=\"col-12 px-0\">\n    <p-table\n      [value]=\"featureFlags\"\n      [paginator]=\"totalRecords !== 0\"\n      [lazy]=\"true\"\n      [rows]=\"PAGE_SIZE\"\n      [totalRecords]=\"totalRecords\"\n      [filterDelay]=\"300\"\n      (onLazyLoad)=\"onLazyLoad($event)\">\n      <ng-template pTemplate=\"caption\">\n        <div class=\"text-end\">\n          <i class=\"fa fa-search mt-2 me-2\" aria-hidden=\"true\"></i>\n          <input type=\"text\" [(ngModel)]=\"searchText\" pInputText size=\"50\" placeholder=\"Search feature flags...\" class=\"mw-90\" />\n        </div>\n      </ng-template>\n      <ng-template pTemplate=\"header\">\n        <tr>\n          <th>Key</th>\n          <th>Name</th>\n          <th>Status</th>\n          <th>Type</th>\n          <th>Owner</th>\n          <th>Expires</th>\n          <th class=\"actions-list-two\">{{ 'Label.Actions' | transloco }}</th>\n        </tr>\n      </ng-template>\n      <ng-template pTemplate=\"body\" let-flag>\n        <tr>\n          <td>{{ flag.key }}</td>\n          <td>{{ flag.name }}</td>\n          <td><span class=\"badge bg-info\">{{ flag.status || 'draft' }}</span></td>\n          <td>{{ flag.flag_type || '-' }}</td>\n          <td>{{ flag.owner || '-' }}</td>\n          <td>{{ flag.expires_at ? (flag.expires_at | date:'dd-MMM-yyyy HH:mm') : '-' }}</td>\n          <td>\n            <ul class=\"list-unstyled list-inline list-action\">\n              <li ngbTooltip=\"Edit\" class=\"me-2 me-sm-2\">\n                <i class=\"fa fa-edit edit-icon\" (click)=\"navigateToEdit(flag)\" aria-hidden=\"true\"></i>\n              </li>\n              <li ngbTooltip=\"Rules\" class=\"me-2 me-sm-2\">\n                <i class=\"fa fa-list-ul edit-icon\" (click)=\"navigateToRules(flag)\" aria-hidden=\"true\"></i>\n              </li>\n              <li ngbTooltip=\"Delete\" class=\"me-2 me-sm-2\">\n                <i class=\"fa fa-trash delete-icon\" (click)=\"onDelete(flag)\" aria-hidden=\"true\"></i>\n              </li>\n            </ul>\n          </td>\n        </tr>\n      </ng-template>\n    </p-table>\n    @if (totalRecords === 0) {\n    <pw-no-data [withImage]=\"true\" [message]=\"'No feature flags found'\"></pw-no-data>\n    }\n  </div>\n</div>", 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$2.PrimeTemplate, selector: "[pTemplate]", inputs: ["type", "pTemplate"] }, { kind: "directive", type: i4$1.InputText, selector: "[pInputText]", inputs: ["hostName", "ptInputText", "pInputTextPT", "pInputTextUnstyled", "pSize", "variant", "fluid", "invalid"] }, { 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: i6.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: i6.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i6.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: i1$1.NoDataComponent, selector: "pw-no-data", inputs: ["message", "description", "withImage"] }, { kind: "directive", type: i10.RouterLink, selector: "[routerLink]", inputs: ["target", "queryParams", "fragment", "queryParamsHandling", "state", "info", "relativeTo", "preserveFragment", "skipLocationChange", "replaceUrl", "routerLink"] }, { kind: "pipe", type: i3$1.DatePipe, name: "date" }, { kind: "pipe", type: i11.TranslocoPipe, name: "transloco" }] }); }
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.6", ngImport: i0, type: FeatureFlagsListComponent, decorators: [{
+            type: Component,
+            args: [{ selector: 'pw-feature-flags-list', standalone: false, template: "<div class=\"row\" [class.custom-disable-wrapper]=\"buttonBusy\">\n  <div class=\"col-12 d-flex flex-wrap justify-content-between align-items-center\">\n    <h2 class=\"card-title p-0 float-start\">Feature Flags</h2>\n    <a [routerLink]=\"[routers.featureFlagsDetails + 'add']\" class=\"btn btn-sm btn-outline-primary float-end\">\n      <i class=\"fa fa-plus-circle\" aria-hidden=\"true\"></i> {{ 'Label.AddNew' | transloco }} Feature Flag\n    </a>\n  </div>\n  <div class=\"col-12 mb-3\">\n    <p>Manage feature flags for controlled rollout, testing, and admin-driven enablement.</p>\n  </div>\n</div>\n\n@if (!isLoaded) {\n<div class=\"w-100 text-center mt-3\">\n  <p-progressSpinner strokeWidth=\"2\"></p-progressSpinner>\n</div>\n}\n\n<div class=\"row primeng-datatable-container mt-0\" [class.custom-disable-wrapper]=\"buttonBusy\">\n  <div class=\"col-12 px-0\">\n    <p-table\n      [value]=\"featureFlags\"\n      [paginator]=\"totalRecords !== 0\"\n      [lazy]=\"true\"\n      [rows]=\"PAGE_SIZE\"\n      [totalRecords]=\"totalRecords\"\n      [filterDelay]=\"300\"\n      (onLazyLoad)=\"onLazyLoad($event)\">\n      <ng-template pTemplate=\"caption\">\n        <div class=\"text-end\">\n          <i class=\"fa fa-search mt-2 me-2\" aria-hidden=\"true\"></i>\n          <input type=\"text\" [(ngModel)]=\"searchText\" pInputText size=\"50\" placeholder=\"Search feature flags...\" class=\"mw-90\" />\n        </div>\n      </ng-template>\n      <ng-template pTemplate=\"header\">\n        <tr>\n          <th>Key</th>\n          <th>Name</th>\n          <th>Status</th>\n          <th>Type</th>\n          <th>Owner</th>\n          <th>Expires</th>\n          <th class=\"actions-list-two\">{{ 'Label.Actions' | transloco }}</th>\n        </tr>\n      </ng-template>\n      <ng-template pTemplate=\"body\" let-flag>\n        <tr>\n          <td>{{ flag.key }}</td>\n          <td>{{ flag.name }}</td>\n          <td><span class=\"badge bg-info\">{{ flag.status || 'draft' }}</span></td>\n          <td>{{ flag.flag_type || '-' }}</td>\n          <td>{{ flag.owner || '-' }}</td>\n          <td>{{ flag.expires_at ? (flag.expires_at | date:'dd-MMM-yyyy HH:mm') : '-' }}</td>\n          <td>\n            <ul class=\"list-unstyled list-inline list-action\">\n              <li ngbTooltip=\"Edit\" class=\"me-2 me-sm-2\">\n                <i class=\"fa fa-edit edit-icon\" (click)=\"navigateToEdit(flag)\" aria-hidden=\"true\"></i>\n              </li>\n              <li ngbTooltip=\"Rules\" class=\"me-2 me-sm-2\">\n                <i class=\"fa fa-list-ul edit-icon\" (click)=\"navigateToRules(flag)\" aria-hidden=\"true\"></i>\n              </li>\n              <li ngbTooltip=\"Delete\" class=\"me-2 me-sm-2\">\n                <i class=\"fa fa-trash delete-icon\" (click)=\"onDelete(flag)\" aria-hidden=\"true\"></i>\n              </li>\n            </ul>\n          </td>\n        </tr>\n      </ng-template>\n    </p-table>\n    @if (totalRecords === 0) {\n    <pw-no-data [withImage]=\"true\" [message]=\"'No feature flags found'\"></pw-no-data>\n    }\n  </div>\n</div>" }]
+        }], ctorParameters: () => [{ type: i0.Injector }, { type: i1.AdminService }] });
+
+class FeatureFlagsTabsComponent {
+    constructor() {
+        this.items = [
+            {
+                id: 'feature-flags',
+                label: 'Feature Flags',
+                icon: 'fa fa-fw fa-toggle-on',
+                routerLink: ['/admin/feature-flags/list']
+            }
+        ];
+    }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.6", ngImport: i0, type: FeatureFlagsTabsComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "21.2.6", type: FeatureFlagsTabsComponent, isStandalone: false, selector: "feature-flags-tabs", ngImport: i0, template: `<pw-tabs [items]="items"></pw-tabs>`, isInline: true, dependencies: [{ kind: "component", type: i1$1.PwTabsComponent, selector: "pw-tabs", inputs: ["items", "withSubscription"] }] }); }
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.6", ngImport: i0, type: FeatureFlagsTabsComponent, decorators: [{
+            type: Component,
+            args: [{
+                    selector: 'feature-flags-tabs',
+                    template: `<pw-tabs [items]="items"></pw-tabs>`,
+                    standalone: false
+                }]
+        }] });
+
 class FeedbackQuestionsDetailsComponent extends AppBaseComponent {
     constructor(injector, cdr, adminService, productService) {
         super(injector);
@@ -8075,11 +8443,11 @@ 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$2.ProductService }, { token: i1.AdminService }, { token: i6.UntypedFormBuilder }, { token: i0.Injector }, { token: i0.ChangeDetectorRef }, { token: i1$2.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-3\">\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 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 mt-2 summary\">\n                <div class=\"card\">\n                  <div class=\"card-body\">\n                    @for (item of subscriptionInsights[temp]; track item) {\n                      <div>\n                        <p class=\"mb-0 px-2\">{{ item?.title }}\n                          @if (item?.info) {\n                            <span\n                              [pTooltip]=\"item?.info\">\n                              <i class=\"fas fa-info-circle\"></i>\n                            </span>\n                          }\n                        </p>\n                        <h4 class=\"fw-bold mt-2 mb-2\">\n                          {{ item?.value }}\n                        </h4>\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=\"Select Feature Keys\"\n              [showToggleAll]=\"true\"\n              [showHeader]=\"true\"\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]=\"'Select status'\"\n              (onChange)=\"filterByStatus($event.value)\"\n              [(ngModel)]=\"status\">\n            </p-select>\n          </div>\n          <div class=\"text-end\">\n            <label for=\"subscriptions-list-search\" class=\"visually-hidden\">Search Subscription</label>\n            <i class=\"fa fa-search mt-2 me-2 d-none\" aria-hidden=\"true\"></i>\n            <input type=\"text\"\n              id=\"subscriptions-list-search\"\n              name=\"subscriptions-list-search\"\n              [(ngModel)]=\"searchText\"\n              pInputText\n              size=\"30\"\n              placeholder=\"Search Subscription...\"\n              class=\"mw-90\"\n              (input)=\"dt.filterGlobal($event.target.value, 'contains')\" />\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\"\n            class=\"custom-break-word\">\n            {{ item.contact_name }}\n          </td>\n          <td data-head=\"ContactEmail\">{{ item.contact_email }}</td>\n          <td data-head=\"Name\">\n            <span class=\"cursor-pointer custom-break-word\"\n              [pTooltip]=\"item.productName\"\n            tooltipPosition=\"top\">{{ item.productName }}</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=\"fa fa-info-circle\"\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=\"fa fa-info-circle ms-2\"\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><br />\n            <span>{{item?.created_at | sinceAgo}}</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      <span class=\"total-records-count\">{{ 'Label.Total' | transloco }}: {{ totalRecords }}</span>\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: [":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}}.expires-at-width{width:8%}.custom-break-word{word-break:break-word!important}.summary .card{padding-bottom:0}.summary .card .card-body{padding-top:20px;text-align:center}.summary .card .card-body p,.summary .card .card-body h4{font-size:14px}@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$2.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$2.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: i3.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: i7$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: "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$1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i6.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: i6.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i6.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "component", type: i1$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: i1$1.NoDataComponent, selector: "pw-no-data", inputs: ["message", "description", "withImage"] }, { kind: "directive", type: i9.DynamicBadgeDirective, selector: "[appDynamicBadge]", inputs: ["appDynamicBadge", "color", "colorByName", "dataName"] }, { kind: "directive", type: i9.RbacAllowDirective, selector: "[rbacAllow]", inputs: ["rbacAllow"] }, { kind: "directive", type: i10.RouterLink, selector: "[routerLink]", inputs: ["target", "queryParams", "fragment", "queryParamsHandling", "state", "info", "relativeTo", "preserveFragment", "skipLocationChange", "replaceUrl", "routerLink"] }, { kind: "pipe", type: i3$1.JsonPipe, name: "json" }, { kind: "pipe", type: i3$1.CurrencyPipe, name: "currency" }, { kind: "pipe", type: i11.TranslocoPipe, name: "transloco" }, { kind: "pipe", type: i15.DateFormatPipe, name: "dateFormat" }, { kind: "pipe", type: i15.SinceAgoPipe, name: "sinceAgo" }, { kind: "pipe", type: i15.TextTruncatePipe, name: "textTruncate" }] }); }
+    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-3\">\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 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 mt-2 summary\">\n                <div class=\"card\">\n                  <div class=\"card-body\">\n                    @for (item of subscriptionInsights[temp]; track item) {\n                      <div>\n                        <p class=\"mb-0 px-2\">{{ item?.title }}\n                          @if (item?.info) {\n                            <span\n                              [pTooltip]=\"item?.info\">\n                              <i class=\"fas fa-info-circle\"></i>\n                            </span>\n                          }\n                        </p>\n                        <h4 class=\"fw-bold mt-2 mb-2\">\n                          {{ item?.value }}\n                        </h4>\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=\"Select Feature Keys\"\n              [showToggleAll]=\"true\"\n              [showHeader]=\"true\"\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]=\"'Select 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            <i class=\"fa fa-search mt-2 me-2 d-none\" aria-hidden=\"true\"></i>\n            <input type=\"text\"\n              id=\"subscriptions-list-search\"\n              name=\"subscriptions-list-search\"\n              [(ngModel)]=\"searchText\"\n              pInputText\n              size=\"30\"\n              placeholder=\"Search Subscription...\"\n              class=\"mw-90\"\n              (input)=\"dt.filterGlobal($event.target.value, 'contains')\" />\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\"\n            class=\"custom-break-word\">\n            {{ item.contact_name }}\n          </td>\n          <td data-head=\"ContactEmail\">{{ item.contact_email }}</td>\n          <td data-head=\"Name\">\n            <span class=\"cursor-pointer custom-break-word\"\n              [pTooltip]=\"item.productName\"\n            tooltipPosition=\"top\">{{ item.productName }}</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=\"fa fa-info-circle\"\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=\"fa fa-info-circle ms-2\"\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><br />\n            <span>{{item?.created_at | sinceAgo}}</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      <span class=\"total-records-count\">{{ 'Label.Total' | transloco }}: {{ totalRecords }}</span>\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: [":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}}.expires-at-width{width:8%}.custom-break-word{word-break:break-word!important}.summary .card{padding-bottom:0}.summary .card .card-body{padding-top:20px;text-align:center}.summary .card .card-body p,.summary .card .card-body h4{font-size:14px}@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$2.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$2.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: i3.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: i7$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: "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$1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i6.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: i6.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i6.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "component", type: i1$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: i1$1.NoDataComponent, selector: "pw-no-data", inputs: ["message", "description", "withImage"] }, { kind: "directive", type: i9.DynamicBadgeDirective, selector: "[appDynamicBadge]", inputs: ["appDynamicBadge", "color", "colorByName", "dataName"] }, { kind: "directive", type: i9.RbacAllowDirective, selector: "[rbacAllow]", inputs: ["rbacAllow"] }, { kind: "directive", type: i10.RouterLink, selector: "[routerLink]", inputs: ["target", "queryParams", "fragment", "queryParamsHandling", "state", "info", "relativeTo", "preserveFragment", "skipLocationChange", "replaceUrl", "routerLink"] }, { kind: "pipe", type: i3$1.JsonPipe, name: "json" }, { kind: "pipe", type: i3$1.CurrencyPipe, name: "currency" }, { kind: "pipe", type: i11.TranslocoPipe, name: "transloco" }, { kind: "pipe", type: i15.DateFormatPipe, name: "dateFormat" }, { kind: "pipe", type: i15.SinceAgoPipe, name: "sinceAgo" }, { kind: "pipe", type: i15.TextTruncatePipe, name: "textTruncate" }] }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.6", ngImport: i0, type: SubscriptionsListComponent, decorators: [{
             type: Component,
-            args: [{ selector: 'pw-subscriptions-list', standalone: false, 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-3\">\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 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 mt-2 summary\">\n                <div class=\"card\">\n                  <div class=\"card-body\">\n                    @for (item of subscriptionInsights[temp]; track item) {\n                      <div>\n                        <p class=\"mb-0 px-2\">{{ item?.title }}\n                          @if (item?.info) {\n                            <span\n                              [pTooltip]=\"item?.info\">\n                              <i class=\"fas fa-info-circle\"></i>\n                            </span>\n                          }\n                        </p>\n                        <h4 class=\"fw-bold mt-2 mb-2\">\n                          {{ item?.value }}\n                        </h4>\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=\"Select Feature Keys\"\n              [showToggleAll]=\"true\"\n              [showHeader]=\"true\"\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]=\"'Select status'\"\n              (onChange)=\"filterByStatus($event.value)\"\n              [(ngModel)]=\"status\">\n            </p-select>\n          </div>\n          <div class=\"text-end\">\n            <label for=\"subscriptions-list-search\" class=\"visually-hidden\">Search Subscription</label>\n            <i class=\"fa fa-search mt-2 me-2 d-none\" aria-hidden=\"true\"></i>\n            <input type=\"text\"\n              id=\"subscriptions-list-search\"\n              name=\"subscriptions-list-search\"\n              [(ngModel)]=\"searchText\"\n              pInputText\n              size=\"30\"\n              placeholder=\"Search Subscription...\"\n              class=\"mw-90\"\n              (input)=\"dt.filterGlobal($event.target.value, 'contains')\" />\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\"\n            class=\"custom-break-word\">\n            {{ item.contact_name }}\n          </td>\n          <td data-head=\"ContactEmail\">{{ item.contact_email }}</td>\n          <td data-head=\"Name\">\n            <span class=\"cursor-pointer custom-break-word\"\n              [pTooltip]=\"item.productName\"\n            tooltipPosition=\"top\">{{ item.productName }}</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=\"fa fa-info-circle\"\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=\"fa fa-info-circle ms-2\"\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><br />\n            <span>{{item?.created_at | sinceAgo}}</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      <span class=\"total-records-count\">{{ 'Label.Total' | transloco }}: {{ totalRecords }}</span>\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: [":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}}.expires-at-width{width:8%}.custom-break-word{word-break:break-word!important}.summary .card{padding-bottom:0}.summary .card .card-body{padding-top:20px;text-align:center}.summary .card .card-body p,.summary .card .card-body h4{font-size:14px}@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"] }]
+            args: [{ selector: 'pw-subscriptions-list', standalone: false, 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-3\">\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 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 mt-2 summary\">\n                <div class=\"card\">\n                  <div class=\"card-body\">\n                    @for (item of subscriptionInsights[temp]; track item) {\n                      <div>\n                        <p class=\"mb-0 px-2\">{{ item?.title }}\n                          @if (item?.info) {\n                            <span\n                              [pTooltip]=\"item?.info\">\n                              <i class=\"fas fa-info-circle\"></i>\n                            </span>\n                          }\n                        </p>\n                        <h4 class=\"fw-bold mt-2 mb-2\">\n                          {{ item?.value }}\n                        </h4>\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=\"Select Feature Keys\"\n              [showToggleAll]=\"true\"\n              [showHeader]=\"true\"\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]=\"'Select 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            <i class=\"fa fa-search mt-2 me-2 d-none\" aria-hidden=\"true\"></i>\n            <input type=\"text\"\n              id=\"subscriptions-list-search\"\n              name=\"subscriptions-list-search\"\n              [(ngModel)]=\"searchText\"\n              pInputText\n              size=\"30\"\n              placeholder=\"Search Subscription...\"\n              class=\"mw-90\"\n              (input)=\"dt.filterGlobal($event.target.value, 'contains')\" />\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\"\n            class=\"custom-break-word\">\n            {{ item.contact_name }}\n          </td>\n          <td data-head=\"ContactEmail\">{{ item.contact_email }}</td>\n          <td data-head=\"Name\">\n            <span class=\"cursor-pointer custom-break-word\"\n              [pTooltip]=\"item.productName\"\n            tooltipPosition=\"top\">{{ item.productName }}</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=\"fa fa-info-circle\"\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=\"fa fa-info-circle ms-2\"\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><br />\n            <span>{{item?.created_at | sinceAgo}}</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      <span class=\"total-records-count\">{{ 'Label.Total' | transloco }}: {{ totalRecords }}</span>\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: [":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}}.expires-at-width{width:8%}.custom-break-word{word-break:break-word!important}.summary .card{padding-bottom:0}.summary .card .card-body{padding-top:20px;text-align:center}.summary .card .card-body p,.summary .card .card-body h4{font-size:14px}@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"] }]
         }], ctorParameters: () => [{ type: i1$2.ProductService }, { type: i1.AdminService }, { type: i6.UntypedFormBuilder }, { type: i0.Injector }, { type: i0.ChangeDetectorRef }, { type: i1$2.CommonService }], propDecorators: { refProduct: [{
                 type: ViewChild,
                 args: ['refProduct']
@@ -10427,6 +10795,54 @@ const routes = [
                     }
                 ]
             },
+            {
+                path: 'feature-flags',
+                data: {
+                    title: 'Feature Flags',
+                    permission: 'Pages.Admin'
+                },
+                children: [
+                    {
+                        path: '',
+                        component: FeatureFlagsTabsComponent,
+                        children: [
+                            {
+                                path: '',
+                                redirectTo: 'list',
+                                pathMatch: 'full'
+                            },
+                            {
+                                path: 'list',
+                                component: FeatureFlagsListComponent
+                            }
+                        ]
+                    },
+                    {
+                        path: 'add',
+                        component: FeatureFlagDetailsComponent,
+                        data: {
+                            title: 'Add Feature Flag',
+                            permission: 'Pages.Admin'
+                        }
+                    },
+                    {
+                        path: ':id',
+                        component: FeatureFlagDetailsComponent,
+                        data: {
+                            title: 'Edit Feature Flag',
+                            permission: 'Pages.Admin'
+                        }
+                    },
+                    {
+                        path: 'rules/:id',
+                        component: FeatureFlagRulesComponent,
+                        data: {
+                            title: 'Feature Flag Rules',
+                            permission: 'Pages.Admin'
+                        }
+                    }
+                ]
+            },
             {
                 path: 'faq',
                 data: {
@@ -11225,6 +11641,10 @@ class AdminModule {
             LoginNotificationDetailsComponent,
             FeedbackQuestionsListComponent,
             FeedbackQuestionsDetailsComponent,
+            FeatureFlagsListComponent,
+            FeatureFlagDetailsComponent,
+            FeatureFlagRulesComponent,
+            FeatureFlagsTabsComponent,
             UserDetailsComponent,
             ProductsTabComponent,
             SubscriptionDetailsComponent,
@@ -11404,6 +11824,10 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.6", ngImpor
                         LoginNotificationDetailsComponent,
                         FeedbackQuestionsListComponent,
                         FeedbackQuestionsDetailsComponent,
+                        FeatureFlagsListComponent,
+                        FeatureFlagDetailsComponent,
+                        FeatureFlagRulesComponent,
+                        FeatureFlagsTabsComponent,
                         UserDetailsComponent,
                         ProductsTabComponent,
                         SubscriptionDetailsComponent,
@@ -11543,13 +11967,15 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.6", ngImpor
         }] });
 
 class AdminGuardService {
-    constructor(userService, router, permissionService) {
+    constructor(userService, router, featureFlagService, permissionService) {
         this.userService = userService;
         this.router = router;
+        this.featureFlagService = featureFlagService;
         this.permissionService = permissionService;
     }
     canLoad(route) {
         return this.userService.getUserInfo().pipe(take(1), concatMap(user => {
+            this.featureFlagService.user = user;
             this.permissionService.user = user;
             if (route.data && this.permissionService.isGranted(route.data['permission'])) {
                 return of(true);
@@ -11570,12 +11996,12 @@ class AdminGuardService {
             return of(false);
         }));
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.6", ngImport: i0, type: AdminGuardService, deps: [{ token: i1$2.UserService }, { token: i10.Router }, { token: i1$2.PermissionService }], target: i0.ɵɵFactoryTarget.Injectable }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.6", ngImport: i0, type: AdminGuardService, deps: [{ token: i1$2.UserService }, { token: i10.Router }, { token: i1$2.FeatureFlagService }, { token: i1$2.PermissionService }], target: i0.ɵɵFactoryTarget.Injectable }); }
     static { this.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "21.2.6", ngImport: i0, type: AdminGuardService }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.6", ngImport: i0, type: AdminGuardService, decorators: [{
             type: Injectable
-        }], ctorParameters: () => [{ type: i1$2.UserService }, { type: i10.Router }, { type: i1$2.PermissionService }] });
+        }], ctorParameters: () => [{ type: i1$2.UserService }, { type: i10.Router }, { type: i1$2.FeatureFlagService }, { type: i1$2.PermissionService }] });
 
 // Admin