@posiwise/admin-module 0.0.157 → 0.0.158

package/fesm2022/posiwise-admin-module.mjs

@@ -1,7 +1,7 @@
 import * as i3$1 from '@angular/common';
 import { CommonModule, DatePipe } from '@angular/common';
 import * as i0 from '@angular/core';
-import { Component, ViewChildren, ViewChild, SecurityContext, ViewEncapsulation, NgModule, CUSTOM_ELEMENTS_SCHEMA, Injectable } from '@angular/core';
+import { Component, ViewChildren, ViewChild, SecurityContext, ViewEncapsulation, EventEmitter, Output, NgModule, CUSTOM_ELEMENTS_SCHEMA, Injectable } from '@angular/core';
 import * as i3$2 from '@angular/forms';
 import { Validators, FormsModule, ReactiveFormsModule } from '@angular/forms';
 import * as i15 from '@angular-magic/ngx-gp-autocomplete';
@@ -10,7 +10,7 @@ import * as i1 from '@posiwise/admin-module-utils';
 import { AppAdmin, AdminService, AdminDataService } from '@posiwise/admin-module-utils';
 import { AppConfigService } from '@posiwise/app-config-service';
 import * as i1$2 from '@posiwise/common-services';
-import { PermissionService, FormHelperService, PrimeNgHelper, SubscriptionService } from '@posiwise/common-services';
+import { PermissionService, ValidationService, FormHelperService, PrimeNgHelper, SubscriptionService } from '@posiwise/common-services';
 import { CoreTranslocoModule } from '@posiwise/core-transloco';
 import * as i10 from '@posiwise/directives';
 import { DirectivesModule } from '@posiwise/directives';
@@ -30,6 +30,8 @@ import * as i9$1 from 'ngx-quill';
 import { QuillModule } from 'ngx-quill';
 import * as i4 from 'ngx-ui-switch';
 import { UiSwitchModule } from 'ngx-ui-switch';
+import * as i3$5 from 'ngx-uploader';
+import { humanizeBytes, UploadStatus, NgxUploaderModule } from 'ngx-uploader';
 import * as i7$1 from 'primeng/accordion';
 import { AccordionModule } from 'primeng/accordion';
 import * as i4$3 from 'primeng/autocomplete';
@@ -38,6 +40,7 @@ import * as i8 from 'primeng/calendar';
 import { CalendarModule } from 'primeng/calendar';
 import * as i3 from 'primeng/dropdown';
 import { DropdownModule } from 'primeng/dropdown';
+import { FileUploadModule } from 'primeng/fileupload';
 import * as i4$1 from 'primeng/inputtext';
 import { InputTextModule } from 'primeng/inputtext';
 import * as i4$4 from 'primeng/multiselect';
@@ -55,7 +58,7 @@ import { PageAccessGuard } from '@posiwise/core-guards';
 import { AppBaseComponent } from '@posiwise/app-base-component';
 import * as i5 from 'primeng/progressspinner';
 import * as i12 from '@jsverse/transloco';
-import { PAGE_SIZE, TOKEN_KEY, TAG_ENTITY, PERMISSION_NAMES, SUBSCRIPTION_ANALYTICS_TYPES } from '@posiwise/common-utilities';
+import { PAGE_SIZE, TOKEN_KEY, TAG_ENTITY, PERMISSION_NAMES, TOKEN_HEADER_KEY, SUBSCRIPTION_ANALYTICS_TYPES } from '@posiwise/common-utilities';
 import { HelperService } from '@posiwise/helper-service';
 import * as i3$3 from 'primeng/api';
 import swal from 'sweetalert2';
@@ -66,6 +69,7 @@ import { groupBy as groupBy$1 } from 'lodash';
 import * as i3$4 from '@angular/platform-browser';
 import uniqBy from 'lodash/uniqBy';
 import moment from 'moment';
+import { StatusCodes } from 'http-status-codes';
 import { HttpParams } from '@angular/common/http';
 import { take, concatMap, map as map$1, catchError } from 'rxjs/operators';
 
@@ -750,12 +754,79 @@ class DomainConfigBuildComponent extends AppBaseComponent {
             video_url: ['']
         }));
     }
+    get guidesItems() {
+        return this.form.get('guides')?.get('items');
+    }
+    addGuideItem() {
+        this.guidesItems.push(this.fb.group({
+            title: [''],
+            description: [''],
+            button_text: [''],
+            image_url: [''],
+            guide_url: ['']
+        }));
+    }
+    removeGuideItem(index) {
+        this.guidesItems.removeAt(index);
+    }
     removeIntegrationItem(index) {
         this.integrationsItems.removeAt(index);
     }
     getQuestionOptions(questionIndex) {
         return this.contactUsQuestions.at(questionIndex).get('options');
     }
+    get footerLinksItems() {
+        return this.form.get('footer_links')?.get('items');
+    }
+    getFooterSubtitles(index) {
+        return this.footerLinksItems.at(index).get('subtitles');
+    }
+    addFooterLinkItem() {
+        this.footerLinksItems.push(this.fb.group({
+            title: [''],
+            path: [''],
+            subtitles: this.fb.array([])
+        }));
+    }
+    removeFooterLinkItem(index) {
+        this.footerLinksItems.removeAt(index);
+    }
+    addFooterSubtitle(linkIndex) {
+        const subtitles = this.footerLinksItems.at(linkIndex).get('subtitles');
+        subtitles.push(this.fb.group({ title: [''], path: [''] }));
+    }
+    removeFooterSubtitle(linkIndex, subIndex) {
+        const subtitles = this.footerLinksItems.at(linkIndex).get('subtitles');
+        subtitles.removeAt(subIndex);
+    }
+    get navbar() {
+        return this.form.get('navbar');
+    }
+    get navbarItems() {
+        return this.navbar.get('items');
+    }
+    getSubtitles(index) {
+        return this.navbarItems.at(index).get('subtitles');
+    }
+    getNavbarSubtitles(index) {
+        return this.navbarItems.at(index).get('subtitles');
+    }
+    addNavbarItem() {
+        this.navbarItems.push(this.fb.group({
+            title: [''],
+            path: [''],
+            subtitles: this.fb.array([])
+        }));
+    }
+    removeNavbarItem(index) {
+        this.navbarItems.removeAt(index);
+    }
+    addSubtitle(navIndex) {
+        this.getSubtitles(navIndex).push(this.fb.group({ title: [''], path: [''] }));
+    }
+    removeSubtitle(navIndex, subIndex) {
+        this.getSubtitles(navIndex).removeAt(subIndex);
+    }
     addContactUsOption(questionIndex) {
         this.getQuestionOptions(questionIndex).push(this.fb.group({
             option: ['']
@@ -811,6 +882,19 @@ class DomainConfigBuildComponent extends AppBaseComponent {
     get testimonialsItems() {
         return this.form.get('testimonials.items');
     }
+    get contactUsHubspotItems() {
+        return this.form.get('contact_us')?.get('hubspot');
+    }
+    addHubspotItem() {
+        this.contactUsHubspotItems.push(this.fb.group({
+            id: [''],
+            position: [''],
+            div: ['']
+        }));
+    }
+    removeHubspotItem(index) {
+        this.contactUsHubspotItems.removeAt(index);
+    }
     openPartnerImageCropper(index) {
         this.selectedPartnerIndex = index;
         this.modalService.open(this.partnerCropper, {
@@ -1000,6 +1084,18 @@ class DomainConfigBuildComponent extends AppBaseComponent {
                     video_url: [item?.video_url || '']
                 }));
             });
+            const guidesGroup = this.form.get('guides');
+            const guidesItems = guidesGroup.get('items');
+            guidesItems.clear();
+            (res.config?.guides?.items || []).forEach(item => {
+                guidesItems.push(this.fb.group({
+                    title: [item?.title || ''],
+                    description: [item?.description || ''],
+                    button_text: [item?.button_text || ''],
+                    image_url: [item?.image_url || ''],
+                    guide_url: [item?.guide_url || '']
+                }));
+            });
             const partnersGroup = this.form.get('partners');
             const partnersItems = partnersGroup.get('items');
             partnersGroup.patchValue({
@@ -1024,11 +1120,12 @@ class DomainConfigBuildComponent extends AppBaseComponent {
             });
             const contactUsGroup = this.form.get('contact_us');
             const questionsArray = contactUsGroup.get('questions');
+            const hubspotArray = contactUsGroup.get('hubspot');
             contactUsGroup.patchValue({
                 description: res.config?.contact_us?.description || ''
             });
             questionsArray.clear();
-            questionsArray.clear();
+            hubspotArray.clear();
             (res.config?.contact_us?.questions || []).forEach(q => {
                 questionsArray.push(this.fb.group({
                     question: [q?.question || ''],
@@ -1037,6 +1134,13 @@ class DomainConfigBuildComponent extends AppBaseComponent {
                     })))
                 }));
             });
+            (res.config?.contact_us?.hubspot || []).forEach(h => {
+                hubspotArray.push(this.fb.group({
+                    id: [h?.id || ''],
+                    position: [h?.position || ''],
+                    div: [h?.div || '']
+                }));
+            });
             const videosGroup = this.form.get('videos');
             const videosItems = videosGroup.get('items');
             videosGroup.patchValue({
@@ -1075,6 +1179,32 @@ class DomainConfigBuildComponent extends AppBaseComponent {
                 cs_product_id: this.productsList.find(x => x.id === this.data?.cs_product_id),
                 trial_product_id: this.productsList.find(x => x.id === this.data?.trial_product_id)
             });
+            const navbarGroup = this.form.get('navbar');
+            const navbarItems = navbarGroup.get('items');
+            navbarItems.clear();
+            (res.config?.navbar?.items || []).forEach(nav => {
+                navbarItems.push(this.fb.group({
+                    title: [nav.title || ''],
+                    path: [nav.path || ''],
+                    subtitles: this.fb.array((nav.subtitles || []).map(sub => this.fb.group({
+                        title: [sub.title || ''],
+                        path: [sub.path || '']
+                    })))
+                }));
+            });
+            const footerLinksGroup = this.form.get('footer_links');
+            const footerLinksItems = footerLinksGroup.get('items');
+            footerLinksItems.clear();
+            (res.config?.footer_links?.items || []).forEach(link => {
+                footerLinksItems.push(this.fb.group({
+                    title: [link?.title || ''],
+                    path: [link?.path || ''],
+                    subtitles: this.fb.array((link?.subtitles || []).map(sub => this.fb.group({
+                        title: [sub?.title || ''],
+                        path: [sub?.path || '']
+                    })))
+                }));
+            });
             if (res?.config?.cs_cta_iframe) {
                 this.form.patchValue({
                     cs_cta_iframe: JSON.parse(res?.config?.cs_cta_iframe)
@@ -1193,7 +1323,7 @@ class DomainConfigBuildComponent extends AppBaseComponent {
         });
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.11", ngImport: i0, type: DomainConfigBuildComponent, deps: [{ token: i0.Injector }, { token: i1.AdminService }, { token: i1$2.ProductService }, { token: i1$1.NgbModal }, { token: i3$2.FormBuilder }], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.3.11", type: DomainConfigBuildComponent, selector: "pw-domain-config-build", viewQueries: [{ propertyName: "partnerCropper", first: true, predicate: ["partnerCropper"], descendants: true }, { propertyName: "uploader", predicate: CustomUploaderComponent, descendants: true }], usesInheritance: true, ngImport: i0, template: "<h3>Public Pages Configuration</h3>\n<div class=\"mb-4\">\n  <p> The following parameters and settings will be applied to all public pages of this domain. </p>\n</div>\n<div class=\"w-100 text-center mt-3\"\n  *ngIf=\"isLoading\">\n  <p-progressSpinner strokeWidth=\"2\"> </p-progressSpinner>\n</div>\n<ng-container *ngIf=\"!isLoading && data?.host_name\">\n  <form [formGroup]=\"form\"\n    (ngSubmit)=\"onSave()\">\n    <div class=\"row\">\n      <div class=\"col-12 col-sm-3\">\n        <pw-input-container [label]=\"'Admin.DomainConfig.MasterSubscription' | transloco\"\n          name=\"master_subscription_id\"\n          [showTooltip]=\"true\"\n          [tooltipText]=\"'Admin.DomainConfig.Tooltip.MasterSubscription' | transloco\">\n          <p-dropdown\n          [options]=\"masterSubscriptionsList\"\n          formControlName=\"master_subscription_id\"\n          [ngClass]=\"{ 'is-invalid': submitted && f['master_subscription_id']?.errors }\"\n          placeholder=\"Select Master Subscription\">\n        </p-dropdown>\n        </pw-input-container>\n      </div>\n      <div class=\"col-12 col-sm-3\">\n        <pw-input-container [label]=\"'Admin.DomainConfig.MasterSubscriptionProduct' | transloco\"\n          [showTooltip]=\"true\"\n          [tooltipText]=\"\n                        'Admin.DomainConfig.Tooltip.MasterSubscriptionProduct' | transloco\n                    \"\n          name=\"master_subscription_product_id\">\n          <p-dropdown\n            [options]=\"masterSubscriptionProductList\"\n            formControlName=\"master_subscription_product_id\"\n            [ngClass]=\"{'is-invalid': submitted && f['master_subscription_product_id']?.errors}\"\n            [placeholder]=\"'Select Master Product'\"\n            optionValue=\"id\"\n            optionLabel=\"name\"\n            >\n          </p-dropdown>\n        </pw-input-container>\n      </div>\n      <div class=\"col-12 col-sm-3\">\n        <pw-input-container [label]=\"'Admin.DomainConfig.BlogFeatureKey' | transloco\"\n          name=\"blog_feature_key\"\n          [showTooltip]=\"true\"\n          [tooltipText]=\"'Admin.DomainConfig.Tooltip.BlogFeatureKey' | transloco\">\n          <input type=\"text\"\n            class=\"form-control\"\n            formControlName=\"blog_feature_key\"\n            [ngClass]=\"{ 'is-invalid': submitted && f['blog_feature_key'].errors }\" />\n        </pw-input-container>\n      </div>\n      <div class=\"col-12 col-sm-3\">\n        <pw-input-container [label]=\"'Admin.DomainConfig.MainTos' | transloco\"\n          name=\"main_tos_id\"\n          [showTooltip]=\"true\"\n          [tooltipText]=\"'Admin.DomainConfig.Tooltip.MainTos' | transloco\">\n          <p-dropdown\n          [options]=\"subscriptionTosList\"\n          formControlName=\"main_tos_id\"\n          [ngClass]=\"{ 'is-invalid': submitted && f['main_tos_id']?.errors }\"\n          [placeholder]=\"'Select Main TOS'\"\n          optionValue=\"id\">\n          <ng-template pTemplate=\"selectedItem\" let-item>\n            <span [innerHTML]=\"item.title\"></span>\n          </ng-template>\n          <ng-template pTemplate=\"item\" let-item>\n            <span [innerHTML]=\"item.title\"></span>\n          </ng-template>\n        </p-dropdown>\n\n        </pw-input-container>\n      </div>\n      <!-- crm subscription fields -->\n      <div class=\"col-12 col-sm-3\">\n        <pw-input-container [label]=\"'Admin.DomainConfig.CrmSubscription' | transloco\"\n          name=\"crm_subscription_id\"\n          [showTooltip]=\"true\"\n          [tooltipText]=\"'Admin.DomainConfig.Tooltip.CrmSubscription' | transloco\">\n          <p-dropdown\n            [options]=\"crmSubscriptionsList\"\n            formControlName=\"crm_subscription_id\"\n            [ngClass]=\"{ 'is-invalid': submitted && f['crm_subscription_id']?.errors }\"\n            [placeholder]=\"'Select CRM Subscription'\"\n            optionValue=\"id\">\n            <ng-template pTemplate=\"selectedItem\" let-item>\n              {{item?.organisation ? item?.organisation + ' - ' + item.contact_name : item?.contact_name}}\n            </ng-template>\n            <ng-template pTemplate=\"item\" let-item>\n              {{item?.organisation ? item?.organisation + ' - ' + item.contact_name : item?.contact_name}}\n            </ng-template>\n          </p-dropdown>\n\n        </pw-input-container>\n      </div>\n      <div class=\"col-12 col-sm-3\">\n        <pw-input-container [label]=\"'Admin.DomainConfig.CrmProduct' | transloco\"\n          name=\"crm_product_id\"\n          [showTooltip]=\"true\"\n          [tooltipText]=\"'Admin.DomainConfig.Tooltip.CrmProduct' | transloco\">\n          <p-dropdown\n            [options]=\"crmProductList\"\n            formControlName=\"crm_product_id\"\n            [ngClass]=\"{ 'is-invalid': submitted && f['crm_product_id']?.errors }\"\n            [placeholder]=\"'Select CRM Product'\"\n            optionValue=\"id\"\n            >\n            <ng-template pTemplate=\"selectedItem\" let-item>\n              {{item?.subscription_id ? item?.name  +' - SubscriptionID = '+ item.subscription_id : item?.name}}\n            </ng-template>\n            <ng-template pTemplate=\"item\" let-item>\n              {{item?.subscription_id ? item?.name  +' - SubscriptionID = '+ item.subscription_id : item?.name}}\n            </ng-template>\n          </p-dropdown>\n        </pw-input-container>\n      </div>\n      <div class=\"col-12 col-sm-3\">\n        <pw-input-container [label]=\"'Admin.DomainConfig.CrmSource' | transloco\"\n          name=\"crm_source_id\"\n          [showTooltip]=\"true\"\n          [tooltipText]=\"'Admin.DomainConfig.Tooltip.CrmSource' | transloco\">\n          <p-dropdown\n            [options]=\"crmSourcesList\"\n            formControlName=\"crm_source_id\"\n            [ngClass]=\"{ 'is-invalid': submitted && f['crm_source_id']?.errors }\"\n            [placeholder]=\"'Select CRM Source'\"\n            optionValue=\"id\"\n            optionLabel=\"name\"\n            >\n          </p-dropdown>\n        </pw-input-container>\n      </div>\n      <!-- crm subscription fields end-->\n      <div class=\"col-12 col-sm-3\">\n        <pw-input-container [label]=\"'Admin.DomainConfig.Active' | transloco\" [showTooltip]=\"true\"\n          [tooltipText]=\"'Admin.DomainConfig.Tooltip.Active' | transloco\" name=\"active\">\n          <ui-switch size=\"small\" uncheckedLabel=\"false\" checkedLabel=\"true\" formControlName=\"active\" name=\"active\"\n            [ngClass]=\"{ 'is-invalid': submitted && f['active'].errors }\">\n          </ui-switch>\n        </pw-input-container>\n      </div>\n      <div class=\"col-12 col-sm-3\">\n        <pw-input-container [label]=\"'Admin.DomainConfig.IsProductDomain' | transloco\"\n          [showTooltip]=\"true\"\n          [tooltipText]=\"'Admin.DomainConfig.Tooltip.IsProductDomain' | transloco\"\n          name=\"is_product_domain\">\n          <ui-switch size=\"small\"\n            uncheckedLabel=\"false\"\n            checkedLabel=\"true\"\n            formControlName=\"is_product_domain\"\n            name=\"is_product_domain\"\n            [ngClass]=\"{ 'is-invalid': submitted && f['is_product_domain'].errors }\">\n          </ui-switch>\n        </pw-input-container>\n      </div>\n      <div class=\"col-12 col-sm-3\">\n        <pw-input-container [label]=\"'Admin.DomainConfig.CanRegisterOnMainPage' | transloco\" [showTooltip]=\"true\"\n          [tooltipText]=\"'Admin.DomainConfig.Tooltip.CanRegisterOnMainPage' | transloco\"\n          name=\"can_register_through_main_page\">\n          <ui-switch size=\"small\" uncheckedLabel=\"false\" checkedLabel=\"true\" formControlName=\"can_register_through_main_page\"\n            name=\"can_register_through_main_page\" [ngClass]=\"{\n                                  'is-invalid': submitted && f['can_register_through_main_page'].errors\n                              }\">\n          </ui-switch>\n        </pw-input-container>\n      </div>\n      <div class=\"col-12 col-sm-3\">\n        <pw-input-container [label]=\"'Admin.DomainConfig.SocialLoginEnabled' | transloco\" [showTooltip]=\"true\"\n          [tooltipText]=\"'Admin.DomainConfig.Tooltip.SocialLoginEnable' | transloco\" name=\"social_login_enabled\">\n          <ui-switch size=\"small\" uncheckedLabel=\"false\" checkedLabel=\"true\" formControlName=\"social_login_enabled\"\n            name=\"social_login_enabled\" [ngClass]=\"{ 'is-invalid': submitted && f['social_login_enabled'].errors }\">\n          </ui-switch>\n        </pw-input-container>\n      </div>\n      <div class=\"col-12 col-sm-3\">\n        <pw-input-container [label]=\"'Admin.DomainConfig.NotifyLogins' | transloco\" [showTooltip]=\"true\"\n          [tooltipText]=\"'Admin.DomainConfig.Tooltip.NotifyLogins' | transloco\" name=\"notify_logins\">\n          <ui-switch size=\"small\" uncheckedLabel=\"false\" checkedLabel=\"true\" formControlName=\"notify_logins\"\n            name=\"notify_logins\" [ngClass]=\"{ 'is-invalid': submitted && f['notify_logins'].errors }\">\n          </ui-switch>\n        </pw-input-container>\n      </div>\n    </div>\n\n    <div class=\"my-5\" *rbacAllow=\"'Pages.SuperAdmin'\">\n      <h3>Pre-Built Landing Pages for User Onboarding</h3>\n\n      <p-accordion class=\"mt-5\">\n        <p-accordionTab [header]=\"'Instructions - README FIRST'\">\n          <div class=\"mb-3\">\n            <p>We\u2019ve built and maintain a collection of high-converting landing pages designed to help you quickly launch polished\n              UIs for onboarding users.</p>\n            <p><strong>Newsletter Subscription Pages:</strong><br> After configuring your domain, you can access pages like\n              <strong>/join/cs1, /join/cs2, /join/cs3, etc.</strong>, specifically designed for newsletter sign-ups. <br>\n              Subscribers from these pages will be listed in the <strong>SmartCRM module</strong>.</p>\n            <p><strong>Trial Product Sign-Up Pages:</strong><br> For users interested in trial products, utilize pages such as\n              <strong>/join/trial1, /join/trial2, /join/trial3, etc.</strong>.<br> Users registering through these pages will\n              appear in the <strong>Admin > Users section</strong>.</p>\n            <p>Once you\u2019ve selected the landing page you want to use <strong>(e.g., /join/trial3)</strong>, make sure to update\n              the <strong>Internal Path</strong> in the <strong>Core tab</strong> accordingly\u2014i.e., set it to\n              <strong>/join/trial3</strong>.</p>\n            <p>If you need assistance integrating these pages into your workflow or have further questions, feel free to reach\n              out.</p>\n          </div>\n        </p-accordionTab>\n\n        <p-accordionTab [header]=\"'Subscribe to Product/Newsletter Config'\">\n          <div class=\"mb-3\">\n            <p>Trial Pages will enable users to sign up to real products and are accessible at the path /join/trial1,\n              /join/trial2, etc.</p>\n            <p>ComingSoon Pages will enable users to subscribe to Newsletters and are accessible at the internal paths\n              /join/cs1, /join/cs2, etc.</p>\n          </div>\n          <!-- live page link -->\n          <div class=\"text-end\" *ngIf=\"shardUrl\">\n            <span>See the live page <span class=\"tooltip-wrap ms-1\" [appendTo]=\"'body'\"\n                [pTooltip]=\"'Admin.DomainConfig.Tooltip.SeeLiveTrial' | transloco\" tooltipPosition=\"top\">\n                <i class=\"fas fa-info-circle\"></i>\n              </span> : <a [href]=\"shardUrl + '/join/trial1'\" target=\"_blank\">{{ shardUrl }}/join/trial1</a></span>\n          </div>\n          <div class=\"row\">\n            <div class=\"col-sm-3\">\n              <pw-input-container [label]=\"'Admin.DomainConfig.TrialProduct' | transloco\" [showTooltip]=\"true\"\n                [tooltipText]=\"'Admin.DomainConfig.Tooltip.TrialProduct' | transloco\" name=\"trial_product_id\">\n                <p-autoComplete [suggestions]=\"productsList\" formControlName=\"trial_product_id\" dataKey=\"id\" field=\"name\"\n                  [dropdown]=\"true\" [delay]=\"1000\" (completeMethod)=\"searchProduct($event)\" styleClass=\"w-100\"\n                  placeholder=\"Search Product\" [inputStyle]=\"\n                                                  form.get('trial_product_id').touched &&\n                                                  form.get('trial_product_id').invalid\n                                                      ? { border: '1px solid #ff586b' }\n                                                      : { border: '1px solid gray' }\n                                              \" [multiple]=\"false\">\n                </p-autoComplete>\n              </pw-input-container>\n            </div>\n            <div class=\"col-12 col-sm-3\">\n              <pw-input-container [label]=\"'Admin.DomainConfig.TrialCrmSourceId' | transloco\" name=\"trial_crm_source_id\"\n                [showTooltip]=\"true\" [tooltipText]=\"\n                                              'Admin.DomainConfig.Tooltip.TrialCrmSourceId' | transloco\n                                          \">\n                <p-dropdown [options]=\"crmSourcesList\" formControlName=\"trial_crm_source_id\"\n                  [ngClass]=\"{ 'is-invalid': submitted && f['trial_crm_source_id']?.errors }\"\n                  [placeholder]=\"'Select CRM Source'\" optionValue=\"id\" optionLabel=\"name\">\n                </p-dropdown>\n              </pw-input-container>\n            </div>\n            <div class=\"col-12 col-sm-3\">\n              <pw-input-container [label]=\"'Admin.DomainConfig.TrialPdfSourceId' | transloco\" name=\"trial_pdf_source_id\"\n                [showTooltip]=\"true\" [tooltipText]=\"\n                                              'Admin.DomainConfig.Tooltip.TrialPdfSourceId' | transloco\n                                          \">\n                <p-dropdown [options]=\"crmSourcesList\" formControlName=\"trial_pdf_source_id\"\n                  [ngClass]=\"{ 'is-invalid': submitted && f['trial_pdf_source_id']?.errors }\"\n                  [placeholder]=\"'Select CRM Source'\" optionValue=\"id\" optionLabel=\"name\">\n                </p-dropdown>\n              </pw-input-container>\n            </div>\n            <div class=\"col-12 col-sm-3\"></div>\n            <div class=\"col-12 col-sm-3\">\n              <pw-input-container [label]=\"'Admin.DomainConfig.TrialVideoUrl' | transloco\" name=\"trial_video_url\"\n                [showTooltip]=\"true\" [tooltipText]=\"'Admin.DomainConfig.Tooltip.TrialVideoUrl' | transloco\">\n                <input type=\"text\" class=\"form-control\" formControlName=\"trial_video_url\"\n                  [ngClass]=\"{ 'is-invalid': submitted && f['trial_video_url'].errors }\" />\n              </pw-input-container>\n            </div>\n            <div class=\"col-12 col-sm-3\">\n              <pw-input-container [label]=\"'Admin.DomainConfig.TrialBookDemoUrl' | transloco\" name=\"trial_book_demo_url\"\n                [showTooltip]=\"true\" [tooltipText]=\"\n                                              'Admin.DomainConfig.Tooltip.TrialBookDemoUrl' | transloco\n                                          \">\n                <input type=\"text\" class=\"form-control\" formControlName=\"trial_book_demo_url\" [ngClass]=\"{\n                                                  'is-invalid': submitted && f['trial_book_demo_url'].errors\n                                              }\" />\n              </pw-input-container>\n            </div>\n            <div class=\"col-12\">\n              <pw-input-container [label]=\"'Admin.DomainConfig.TrialCtaIframe' | transloco\" name=\"trial_cta_iframe\"\n                [showTooltip]=\"true\" [tooltipText]=\"\n                                              'Admin.DomainConfig.Tooltip.TrialCtaIframe' | transloco\n                                          \">\n                <textarea rows=\"3\" class=\"form-control\" formControlName=\"trial_cta_iframe\" [ngClass]=\"{\n                                                  'is-invalid': submitted && f['trial_cta_iframe'].errors\n                                              }\">\n                                          </textarea>\n              </pw-input-container>\n            </div>\n            <div class=\"col-12\">\n              <pw-input-container [label]=\"'Admin.DomainConfig.TrialJoinMessage' | transloco\" name=\"trial_join_message\"\n                [showTooltip]=\"true\" [tooltipText]=\"\n                                              'Admin.DomainConfig.Tooltip.TrialJoinMessage' | transloco\n                                          \">\n                <textarea rows=\"3\" class=\"form-control\" formControlName=\"trial_join_message\" [ngClass]=\"{\n                                                  'is-invalid': submitted && f['trial_join_message'].errors\n                                              }\">\n                                          </textarea>\n              </pw-input-container>\n            </div>\n            <div class=\"col-12\">\n              <pw-input-container [label]=\"'Admin.DomainConfig.TrialPdfDownloadText' | transloco\" name=\"trial_pdf_download_text\"\n                [showTooltip]=\"true\" [tooltipText]=\"\n                                              'Admin.DomainConfig.Tooltip.TrialPdfDownloadText' | transloco\n                                          \">\n                <textarea rows=\"3\" class=\"form-control\" formControlName=\"trial_pdf_download_text\" [ngClass]=\"{\n                                                  'is-invalid': submitted && f['trial_pdf_download_text'].errors\n                                              }\">\n                                          </textarea>\n              </pw-input-container>\n            </div>\n          </div>\n          <div class=\"row\" matchHeight=\"card\">\n            <div class=\"col-md-4\">\n              <label for=\"trial_image\">{{ 'Admin.DomainConfig.TrialImage' | transloco }} <span class=\"info-circle\">\n                  <span class=\"tooltiptext gradient-custom-branding\">{{ 'Admin.DomainConfig.Tooltip.TrialImage' | transloco\n                    }}</span>\n                </span>\n              </label>\n              <pw-custom-uploader (saveEvent)=\"onSaveFile($event)\" [aspectRatio]=\"'custom'\" [title]=\"'Trial Image'\"\n                [controlName]=\"'trial_image'\" [previewData]=\"data['trial_image']\">\n              </pw-custom-uploader>\n            </div>\n            <div class=\"col-md-4\">\n              <label for=\"trial_image2\">{{ 'Admin.DomainConfig.TrialImage2' | transloco }} <span class=\"info-circle\">\n                  <span class=\"tooltiptext gradient-custom-branding\">{{ 'Admin.DomainConfig.Tooltip.TrialImage2' | transloco\n                    }}</span>\n                </span>\n              </label>\n              <pw-custom-uploader (saveEvent)=\"onSaveFile($event)\" [title]=\"'Trial Image2'\" [aspectRatio]=\"'custom'\"\n                [controlName]=\"'trial_image2'\" [previewData]=\"data['trial_image2']\">\n              </pw-custom-uploader>\n            </div>\n            <div class=\"col-md-4\">\n              <label for=\"trial_pdf_image\">{{ 'Admin.DomainConfig.TrialPdfImage' | transloco }} <span class=\"info-circle\">\n                  <span class=\"tooltiptext gradient-custom-branding\">{{ 'Admin.DomainConfig.Tooltip.TrialPdfImage' | transloco\n                    }}</span>\n                </span>\n              </label>\n              <pw-custom-uploader (saveEvent)=\"onSaveFile($event)\" [title]=\"'Trial Pdf Image'\" [aspectRatio]=\"'custom'\"\n                [controlName]=\"'trial_pdf_image'\" [previewData]=\"data['trial_pdf_image']\">\n              </pw-custom-uploader>\n            </div>\n            <div class=\"col-md-4\">\n              <label for=\"trial_image_bg\">{{ 'Admin.DomainConfig.TrialImageBg' | transloco }} <span class=\"info-circle\">\n                  <span class=\"tooltiptext gradient-custom-branding\">{{ 'Admin.DomainConfig.Tooltip.TrialImageBg' | transloco\n                    }}</span>\n                </span>\n              </label>\n              <pw-custom-uploader (saveEvent)=\"onSaveFile($event)\" [title]=\"'Trial Image Bg'\" [aspectRatio]=\"'custom'\"\n                [controlName]=\"'trial_image_bg'\" [previewData]=\"data['trial_image_bg']\">\n              </pw-custom-uploader>\n            </div>\n            <div class=\"col-md-4\">\n              <label for=\"trial_image_bg2\">{{ 'Admin.DomainConfig.TrialImageBg2' | transloco }} <span class=\"info-circle\">\n                  <span class=\"tooltiptext gradient-custom-branding\">{{ 'Admin.DomainConfig.Tooltip.TrialImageBg2' | transloco\n                    }}</span>\n                </span>\n              </label>\n              <pw-custom-uploader (saveEvent)=\"onSaveFile($event)\" [title]=\"'Trial Image Bg2'\" [aspectRatio]=\"'custom'\"\n                [controlName]=\"'trial_image_bg2'\" [previewData]=\"data['trial_image_bg2']\">\n              </pw-custom-uploader>\n            </div>\n          </div>\n        </p-accordionTab>\n\n        <p-accordionTab [header]=\"'Header Section'\">\n          <div class=\"row mt-4\" formGroupName=\"header\">\n            <h4 class=\"mb-4\">Header Section</h4>\n            <div class=\"col-12 col-md-12\">\n              <pw-input-container label=\"Header Headline\" name=\"headline\">\n                <input type=\"text\" class=\"form-control\" formControlName=\"headline\" />\n              </pw-input-container>\n            </div>\n            <div class=\"col-12 col-md-6\">\n              <pw-input-container label=\"Header Video URL\" name=\"video_url\">\n                <input type=\"text\" class=\"form-control\" formControlName=\"video_url\" />\n              </pw-input-container>\n            </div>\n            <div class=\"col-12 col-md-6\">\n              <pw-input-container label=\"Header Background Image URL\" name=\"bg_image_url\">\n                <input type=\"text\" class=\"form-control\" formControlName=\"bg_image_url\" />\n              </pw-input-container>\n            </div>\n            <div class=\"col-12\">\n              <pw-input-container label=\"Header Description\">\n                <textarea class=\"form-control\" rows=\"5\" formControlName=\"description\"\n                  [ngClass]=\"{ 'is-invalid': submitted && f['description']?.errors }\">\n                                                </textarea>\n              </pw-input-container>\n            </div>\n            <div formArrayName=\"sub_headings\" class=\"col-12\">\n              <div *ngFor=\"let sub of f['header'].get('sub_headings')['controls']; let i = index\" [formGroupName]=\"i\"\n                class=\"row mb-3\">\n                <div class=\"col-md-10\" *ngIf=\"f['header'].get('sub_headings')['controls'].length\">\n                  <pw-input-container label=\"Sub Header Description\">\n                    <textarea class=\"form-control\" rows=\"3\" formControlName=\"description\"\n                      [ngClass]=\"{ 'is-invalid': submitted && f['description']?.errors }\">\n                                                    </textarea>\n                  </pw-input-container>\n                </div>\n                <div class=\"col-md-2 d-flex align-items-center mt-3\">\n                  <i class=\"fa fa-trash delete-icon\" (click)=\"removeHeaderSubHeading(i)\"\n                    (keydown.enter)=\"removeHeaderSubHeading(i)\" (keydown.space)=\"removeHeaderSubHeading(i)\" ngbTooltip=\"Remove\"\n                    aria-hidden=\"true\"></i>\n                </div>\n              </div>\n              <button type=\"button\" class=\"btn btn-primary mt-2 mb-2\" (click)=\"addHeaderSubHeading()\"> + Add Sub Heading\n              </button>\n            </div>\n          </div>\n        </p-accordionTab>\n\n        <p-accordionTab [header]=\"'Resources Section'\">\n          <div class=\"row row mt-4 mb-4\">\n            <h4 class=\"mb-3\">Resources Section</h4>\n            <div class=\"col-12 col-sm-6\">\n              <pw-input-container [label]=\"'Admin.DomainConfig.ResourceTagline' | transloco\" name=\"resources_tagline\"\n                [showTooltip]=\"true\" [tooltipText]=\"'Admin.DomainConfig.Tooltip.ResourceTagline' | transloco\">\n                <input type=\"text\" class=\"form-control\" formControlName=\"resources_tagline\"\n                  [ngClass]=\"{ 'is-invalid': submitted && f['resources_tagline'].errors }\" />\n              </pw-input-container>\n            </div>\n            <div class=\"col-12\">\n              <pw-input-container [label]=\"'Admin.DomainConfig.ResourceDescription' | transloco\" name=\"resources_description\"\n                [showTooltip]=\"true\" [tooltipText]=\"'Admin.DomainConfig.Tooltip.ResourceDescription' | transloco\">\n                <textarea class=\"form-control\" rows=\"3\" formControlName=\"resources_description\"\n                  [ngClass]=\"{ 'is-invalid': submitted && f['resources_description'].errors }\">\n                                          </textarea>\n              </pw-input-container>\n            </div>\n          </div>\n          <div class=\"row\" matchHeight=\"card\">\n            <div class=\"col-md-4\">\n              <label for=\"resource_image\">{{ 'Admin.DomainConfig.ResourceImage' | transloco }} <span class=\"info-circle\">\n                  <span class=\"tooltiptext gradient-custom-branding\">{{ 'Admin.DomainConfig.Tooltip.ResourceImage' | transloco\n                    }}</span>\n                </span>\n              </label>\n              <pw-custom-uploader (saveEvent)=\"onSaveFile($event)\" [aspectRatio]=\"'custom'\" [title]=\"'Cs Image'\"\n                [controlName]=\"'resources_image'\" [previewData]=\"data['resources_image']\">\n              </pw-custom-uploader>\n            </div>\n          </div>\n        </p-accordionTab>\n\n        <p-accordionTab [header]=\"'Unique Selling Proposition Section (USP) '\">\n          <div class=\"row mt-4 mb-4\" formGroupName=\"usps\">\n            <h4 class=\"mb-4\">Unique Selling Proposition Section (USP)</h4>\n            <div class=\"col-12 col-md-6\">\n              <pw-input-container label=\"USPs Title\" name=\"title\">\n                <input type=\"text\" class=\"form-control\" formControlName=\"title\" />\n              </pw-input-container>\n            </div>\n            <div class=\"col-12 col-md-6\">\n              <pw-input-container label=\"USPs Video Url\" name=\"video_url\">\n                <input type=\"text\" class=\"form-control\" formControlName=\"video_url\" />\n              </pw-input-container>\n            </div>\n            <div class=\"col-12\">\n              <pw-input-container label=\"USPs Description\" name=\"description\">\n                <textarea class=\"form-control\" rows=\"3\" formControlName=\"description\"\n                 >\n                                  </textarea>\n              </pw-input-container>\n            </div>\n            <div formArrayName=\"items\" class=\"col-12\">\n              <div\n                *ngFor=\"let item of f['usps'].get('items')['controls']; let i = index\"\n                [formGroupName]=\"i\"\n                class=\"row mb-3\"\n              >\n                <div class=\"col-sm-10\">\n                  <pw-input-container label=\"Item Description\">\n                    <textarea class=\"form-control\" rows=\"3\" formControlName=\"description\"\n                  >\n                                  </textarea>\n                  </pw-input-container>\n                </div>\n                <div class=\"col-sm-2 d-flex align-items-center mt-3\">\n                  <i\n                    class=\"fa fa-trash delete-icon\"\n                    (click)=\"removeUspItem(i)\"\n                    (keydown.enter)=\"removeUspItem(i)\"\n                    (keydown.space)=\"removeUspItem(i)\"\n                    ngbTooltip=\"Remove\"\n                    aria-hidden=\"true\"\n                  ></i>\n                </div>\n              </div>\n              <button type=\"button\" class=\"btn btn-primary mt-2 mb-2\" (click)=\"addUspItem()\">\n                + Add USP Item\n              </button>\n            </div>\n          </div>\n        </p-accordionTab>\n\n        <p-accordionTab [header]=\"'Partners (Clients) Section'\">\n\n          <div class=\"row mt-4 mb-4\" formGroupName=\"partners\">\n            <h4 class=\"mb-4\">Partners (Clients) Section</h4>\n            <!-- Title -->\n            <div class=\"col-12 col-md-6\">\n              <pw-input-container label=\"Partner Title\" name=\"title\">\n                <input type=\"text\" class=\"form-control\" formControlName=\"title\" />\n              </pw-input-container>\n            </div>\n\n            <!-- Description -->\n            <div class=\"col-12\">\n              <pw-input-container label=\"Partners Description\" name=\"description\">\n                <textarea class=\"form-control\" rows=\"3\" formControlName=\"description\"></textarea>\n              </pw-input-container>\n            </div>\n\n            <!-- Partner Items -->\n            <div formArrayName=\"items\" class=\"col-12\">\n              <div *ngFor=\"let item of partnersItems.controls; let i = index\" [formGroupName]=\"i\" class=\"row border p-3 mb-3\">\n                <!-- Name -->\n                <div class=\"col-md-6\">\n                  <pw-input-container label=\"Name\" class=\"col-12 col-md-6\" name=\"name\">\n                    <input class=\"form-control\" formControlName=\"name\"/>\n                  </pw-input-container>\n                </div>\n\n                <!-- Blog URL -->\n                <div class=\"col-md-6\">\n                  <pw-input-container label=\"Blog Url\" class=\"col-12 col-md-6\" name=\"blog_url\">\n                    <input class=\"form-control\" formControlName=\"blog_url\"/>\n                  </pw-input-container>\n                </div>\n\n                <!-- Video URL -->\n                <div class=\"col-md-6\">\n                  <pw-input-container label=\"Video Url\" class=\"col-12 col-md-6\" name=\"video_url\">\n                    <input class=\"form-control\" formControlName=\"video_url\"/>\n                  </pw-input-container>\n                </div>\n                <div class=\"col-md-6\">\n                  <pw-input-container label=\"Image Url\" class=\"col-12 col-md-6\" name=\"ctas_title\">\n                    <input class=\"form-control\" formControlName=\"image_url\"/>\n                  </pw-input-container>\n                </div>\n\n                <!-- Remove Button -->\n                <div class=\"col-md-6 text-start mt-2 align-self-center\">\n                  <i ngbTooltip=\"Remove\" (click)=\"removePartnerItem(i)\" class=\"fa fa-trash delete-icon\" aria-hidden=\"true\"></i>\n                </div>\n              </div>\n\n              <!-- Add New Partner -->\n              <div class=\"text-start mt-2\">\n                <button type=\"button\" class=\"btn btn-primary mt-2 mb-2\" (click)=\"addPartnerItem()\">+ Add Partner</button>\n              </div>\n            </div>\n          </div>\n        </p-accordionTab>\n\n        <p-accordionTab [header]=\"'Testimonials Section'\">\n          <div class=\"row mt-3 mb-4\" formGroupName=\"testimonials\">\n            <h4 class=\"mb-4\">Testimonials Section</h4>\n\n            <pw-input-container label=\"Title\" class=\"col-12 col-md-6\" name=\"testimonials_title\">\n              <input type=\"text\" class=\"form-control\" formControlName=\"title\" />\n            </pw-input-container>\n\n            <pw-input-container label=\"Description\" class=\"col-12\" name=\"testimonials_description\">\n              <textarea rows=\"3\" class=\"form-control\" formControlName=\"description\"></textarea>\n            </pw-input-container>\n\n            <!-- Items List -->\n            <div formArrayName=\"items\" class=\"col-12 mt-3\">\n              <div *ngFor=\"let item of testimonialsItems.controls; let i = index\" [formGroupName]=\"i\" class=\"row border p-3 mb-3\">\n\n                <pw-input-container label=\"Name\" class=\"col-md-6\">\n                  <input type=\"text\" class=\"form-control\" formControlName=\"name\" />\n                </pw-input-container>\n\n                <pw-input-container label=\"Blog URL\" class=\"col-md-6\">\n                  <input type=\"text\" class=\"form-control\" formControlName=\"blog_url\" />\n                </pw-input-container>\n\n                <pw-input-container label=\"Image URL\" class=\"col-md-6\">\n                  <input type=\"text\" class=\"form-control\" formControlName=\"image_url\" />\n                </pw-input-container>\n\n                <pw-input-container label=\"Video URL\" class=\"col-md-6\">\n                  <input type=\"text\" class=\"form-control\" formControlName=\"video_url\" />\n                </pw-input-container>\n\n                <pw-input-container label=\"Testimonial\" class=\"col-md-10\">\n                  <textarea class=\"form-control\" rows=\"3\" formControlName=\"testimonial\"></textarea>\n                </pw-input-container>\n\n                <div class=\"col-md-2 d-flex align-items-center mt-3\">\n                  <i\n                      ngbTooltip=\"Remove\" (click)=\"removeTestimonialItem(i)\"\n                      (keydown.enter)=\"removeTestimonialItem(i)\"\n                      (keydown.space)=\"removeTestimonialItem(i)\" class=\"fa fa-trash delete-icon\"\n                      aria-hidden=\"true\"\n                  ></i>\n                </div>\n              </div>\n\n              <div class=\"text-start mt-2\">\n                <button type=\"button\" class=\"btn btn-primary mt-2 mb-2\" (click)=\"addTestimonialItem()\">+ Add Testimonial</button>\n              </div>\n            </div>\n          </div>\n        </p-accordionTab>\n\n        <p-accordionTab [header]=\"'Video Section'\">\n          <div class=\"row mt-3 mb-4\" formGroupName=\"videos\">\n            <h4 class=\"mb-3\">Video Section</h4>\n\n            <pw-input-container label=\"Title\" class=\"col-12 col-md-6\" name=\"videos_title\">\n              <input type=\"text\" class=\"form-control\" formControlName=\"title\" />\n            </pw-input-container>\n\n            <pw-input-container label=\"Description\" class=\"col-12\" name=\"videos_description\">\n              <textarea rows=\"3\" class=\"form-control\" formControlName=\"description\"></textarea>\n            </pw-input-container>\n\n            <!-- Video Items -->\n            <div formArrayName=\"items\" class=\"col-12 mt-3\">\n              <div *ngFor=\"let item of videosItems.controls; let i = index\" [formGroupName]=\"i\" class=\"row border p-3 mb-3\">\n\n                <pw-input-container label=\"Title\" class=\"col-md-6\">\n                  <input type=\"text\" class=\"form-control\" formControlName=\"title\" />\n                </pw-input-container>\n\n                <pw-input-container label=\"Blog URL\" class=\"col-md-6\">\n                  <input type=\"text\" class=\"form-control\" formControlName=\"blog_url\" />\n                </pw-input-container>\n\n                <pw-input-container label=\"Image URL\" class=\"col-md-6\">\n                  <input type=\"text\" class=\"form-control\" formControlName=\"image_url\" />\n                </pw-input-container>\n\n                <pw-input-container label=\"Video URL\" class=\"col-md-6\">\n                  <input type=\"text\" class=\"form-control\" formControlName=\"video_url\" />\n                </pw-input-container>\n\n                <pw-input-container label=\"Description\" class=\"col-md-10\">\n                  <textarea class=\"form-control\" rows=\"3\" formControlName=\"description\"></textarea>\n                </pw-input-container>\n\n                <div class=\"col-md-2 d-flex align-items-center mt-3\">\n                  <i\n                    class=\"fa fa-trash delete-icon\"\n                    (click)=\"removeVideoItem(i)\"\n                    (keydown.enter)=\"removeVideoItem(i)\"\n                    (keydown.space)=\"removeVideoItem(i)\"\n                    ngbTooltip=\"Remove\"\n                    aria-hidden=\"true\"\n                  ></i>\n                </div>\n              </div>\n\n              <div class=\"text-start mt-2\">\n                <button type=\"button\" class=\"btn btn-primary mt-2 mb-2\" (click)=\"addVideoItem()\">+ Add Video</button>\n              </div>\n            </div>\n          </div>\n        </p-accordionTab>\n\n        <p-accordionTab [header]=\"'Call to Actions Section (CTAs)'\">\n          <div class=\"row mt-4 mb-4\" formGroupName=\"ctas\">\n            <h4 class=\"mb-4\">CTAs Section</h4>\n\n            <div class=\"col-12 col-md-6\">\n              <pw-input-container label=\"Title\" name=\"title\">\n                <input type=\"text\" class=\"form-control\" formControlName=\"title\" />\n              </pw-input-container>\n            </div>\n\n            <div class=\"col-12 col-md-6\">\n              <pw-input-container label=\"Description\" name=\"description\">\n                <input type=\"text\" class=\"form-control\" formControlName=\"description\" />\n              </pw-input-container>\n            </div>\n\n            <div class=\"col-12\">\n              <pw-input-container label=\"Image URL\" name=\"image_url\">\n                <input type=\"text\" class=\"form-control\" formControlName=\"image_url\" />\n              </pw-input-container>\n            </div>\n\n            <!-- CTA Items -->\n            <div formArrayName=\"items\" class=\"col-12 mt-3\">\n              <div *ngFor=\"let item of ctasItems.controls; let i = index\" [formGroupName]=\"i\" class=\"row border p-3 mb-3 ng-untouched ng-pristine ng-valid ng-star-inserted\">\n                <div class=\"col-12 col-md-6\">\n                  <pw-input-container label=\"Image URL\" name=\"image_url\">\n                    <input type=\"text\" class=\"form-control\" formControlName=\"image_url\" />\n                  </pw-input-container>\n                </div>\n\n                <div class=\"col-12 col-md-6\">\n                  <pw-input-container label=\"Cta URL\" name=\"cta_url\">\n                    <input type=\"text\" class=\"form-control\" formControlName=\"cta_url\" />\n                  </pw-input-container>\n                </div>\n\n                <div class=\"col-12 col-md-6\">\n                  <pw-input-container label=\"Video URL\" name=\"video_url\">\n                    <input type=\"text\" class=\"form-control\" formControlName=\"video_url\" />\n                  </pw-input-container>\n                </div>\n                <div class=\"col-12 col-md-6\">\n                  <pw-input-container label=\"CTA Title\">\n                    <input class=\"form-control\" formControlName=\"title\" />\n                  </pw-input-container>\n                </div>\n                <div class=\"col-12 col-md-6\">\n                  <pw-input-container label=\"CTA Description\">\n                    <input class=\"form-control\" formControlName=\"description\" />\n                  </pw-input-container>\n                </div>\n                <div class=\"col-12 col-md-6\">\n                  <pw-input-container label=\"Button Text\">\n                    <input class=\"form-control\" formControlName=\"button_text\" />\n                  </pw-input-container>\n                </div>\n                <div class=\"col-md-1 d-flex align-items-center mt-3\">\n                  <i\n                    class=\"fa fa-trash delete-icon\"\n                    (click)=\"removeCtasItem(i)\"\n                    (keydown.enter)=\"removeCtasItem(i)\"\n                    (keydown.space)=\"removeCtasItem(i)\"\n                    ngbTooltip=\"Remove\"\n                    aria-hidden=\"true\"\n                  ></i>\n                </div>\n              </div>\n              <div class=\"text-start mt-2\">\n                <button type=\"button\" class=\"btn btn-primary mt-2 mb-2\" (click)=\"addCtasItem()\">+ Add CTA Item</button>\n              </div>\n            </div>\n          </div>\n        </p-accordionTab>\n\n        <p-accordionTab [header]=\"'Integrations Section'\">\n          <div class=\"row mt-3 mb-4\" formGroupName=\"integrations\">\n            <h4 class=\"mb-3\">Integrations Section</h4>\n\n            <pw-input-container label=\"Title\" class=\"col-12\">\n              <input type=\"text\" class=\"form-control\" formControlName=\"title\" />\n            </pw-input-container>\n\n            <pw-input-container label=\"Description\" class=\"col-12\">\n              <textarea class=\"form-control\" formControlName=\"description\" rows=\"3\"></textarea>\n            </pw-input-container>\n\n            <div formArrayName=\"items\" class=\"col-12\">\n              <div\n                *ngFor=\"let item of integrationsItems.controls; let i = index\"\n                [formGroupName]=\"i\"\n                class=\"row border p-3 mb-3 rounded bg-light\"\n              >\n                <pw-input-container label=\"Title\" class=\"col-md-6\">\n                  <input type=\"text\" class=\"form-control\" formControlName=\"title\" />\n                </pw-input-container>\n\n                <pw-input-container label=\"Description\" class=\"col-md-6\">\n                  <input type=\"text\" class=\"form-control\" formControlName=\"description\" />\n                </pw-input-container>\n\n                <pw-input-container label=\"Blog URL\" class=\"col-md-6\">\n                  <input type=\"text\" class=\"form-control\" formControlName=\"blog_url\" />\n                </pw-input-container>\n\n                <pw-input-container label=\"Image URL\" class=\"col-md-6\">\n                  <input type=\"text\" class=\"form-control\" formControlName=\"image_url\" />\n                </pw-input-container>\n\n                <pw-input-container label=\"Video URL\" class=\"col-md-6\">\n                  <input type=\"text\" class=\"form-control\" formControlName=\"video_url\" />\n                </pw-input-container>\n\n                <div class=\"col-md-6 d-flex align-items-end justify-content-end\">\n                  <button\n                    type=\"button\"\n                    class=\"btn btn-danger\"\n                    (click)=\"removeIntegrationItem(i)\"\n                  >\n                    Remove\n                  </button>\n                </div>\n              </div>\n\n              <div class=\"text-start mt-2\">\n                <button type=\"button\" class=\"btn btn-primary\" (click)=\"addIntegrationItem()\">\n                  + Add Integration\n                </button>\n              </div>\n            </div>\n          </div>\n        </p-accordionTab>\n\n        <p-accordionTab [header]=\"'Contact Us Section'\">\n          <div class=\"row mt-3 mb-4\" formGroupName=\"contact_us\">\n            <h4 class=\"mb-3\">Contact Us Section</h4>\n            <pw-input-container label=\"Url\" class=\"col-md-6\">\n              <input type=\"text\" class=\"form-control\" formControlName=\"url\" />\n            </pw-input-container>\n            <pw-input-container label=\"Description\" class=\"col-12\" name=\"contact_us_description\">\n              <textarea rows=\"3\" class=\"form-control\" formControlName=\"description\"></textarea>\n            </pw-input-container>\n            <!-- Questions -->\n            <div formArrayName=\"questions\" class=\"col-12 mt-3\">\n              <div *ngFor=\"let questionGroup of contactUsQuestions.controls; let i = index\" [formGroupName]=\"i\"\n                class=\"row border p-3 mb-3\">\n                <pw-input-container label=\"Question\" class=\"col-md-10\">\n                  <input type=\"text\" class=\"form-control\" formControlName=\"question\" />\n                </pw-input-container>\n                <div class=\"col-md-2 d-flex align-items-center mt-3\">\n                  <i class=\"fa fa-trash delete-icon\" (click)=\"removeContactUsQuestion(i)\"\n                    (keydown.enter)=\"removeContactUsQuestion(i)\" (keydown.space)=\"removeContactUsQuestion(i)\"\n                    ngbTooltip=\"Remove\" aria-hidden=\"true\"></i>\n                </div>\n                <!-- Options inside each question -->\n                <div class=\"col-12\" formArrayName=\"options\">\n                  <div class=\"row align-items-center mb-2 border p-3\"\n                    *ngFor=\"let option of getQuestionOptions(i).controls; let j = index\" [formGroupName]=\"j\">\n                    <pw-input-container label=\"Option\" class=\"col-md-10\">\n                      <input type=\"text\" class=\"form-control\" formControlName=\"option\" />\n                    </pw-input-container>\n                    <div class=\"col-md-2 d-flex align-items-center mt-3\">\n                      <i class=\"fa fa-trash delete-icon\" (click)=\"removeContactUsOption(i, j)\"\n                        (keydown.enter)=\"removeContactUsOption(i, j)\" (keydown.space)=\"removeContactUsOption(i, j)\"\n                        ngbTooltip=\"Remove Option\" aria-hidden=\"true\"></i>\n                    </div>\n                  </div>\n                  <div class=\"text-start\">\n                    <button type=\"button\" class=\"btn btn-primary btn-sm\" (click)=\"addContactUsOption(i)\"> + Add Option </button>\n                  </div>\n                </div>\n                <!-- End options -->\n              </div>\n              <div class=\"text-start mt-3\">\n                <button type=\"button\" class=\"btn btn-primary\" (click)=\"addContactUsQuestion()\">+ Add Question</button>\n              </div>\n            </div>\n          </div>\n        </p-accordionTab>\n\n        <p-accordionTab [header]=\"'Book a Demo Section'\">\n          <!-- Book a Demo Links -->\n          <div class=\"row mt-4\">\n            <div class=\"col-12\">\n              <h4 class=\"mb-3\">{{ 'Admin.DomainConfig.BookDemoLinks' | transloco }}</h4>\n              <div formGroupName=\"book_demo\">\n                <pw-input-container label=\"Title\">\n                  <input type=\"text\" formControlName=\"title\" class=\"form-control\" />\n                </pw-input-container>\n\n                <pw-input-container label=\"Description\">\n                  <input type=\"text\" formControlName=\"description\" class=\"form-control\" />\n                </pw-input-container>\n\n                <div formArrayName=\"items\">\n                  <div *ngFor=\"let link of f['book_demo'].get('items')['controls']; let i = index\" [formGroupName]=\"i\" class=\"row mb-3\">\n                    <div class=\"col-sm-5\">\n                      <pw-input-container label=\"Link Title\">\n                        <input type=\"text\" class=\"form-control\" formControlName=\"title\" />\n                      </pw-input-container>\n                    </div>\n                    <div class=\"col-sm-5\">\n                      <pw-input-container label=\"Link URL\">\n                        <input type=\"text\" class=\"form-control\" formControlName=\"url\" />\n                      </pw-input-container>\n                    </div>\n                    <div class=\"col-sm-2 d-flex align-items-center mt-3\">\n                      <i\n                      ngbTooltip=\"Remove\"\n                      (click)=\"removeBookDemoLink(i)\"\n                                          (keydown.enter)=\"removeBookDemoLink(i)\"\n                                          (keydown.space)=\"removeBookDemoLink(i)\"\n                                          class=\"fa fa-trash delete-icon\"\n                                          aria-hidden=\"true\"\n                                      ></i>\n                    </div>\n                  </div>\n                  <button type=\"button\" class=\"btn btn-primary mt-2 mb-2\" (click)=\"addBookDemoLink()\">+ Add Book Demo Link</button>\n                </div>\n              </div>\n            </div>\n          </div>\n        </p-accordionTab>\n\n        <p-accordionTab [header]=\"'Coming soon pages - Subscribe to newsletter (TO DISCONTINUE)'\">\n          <div class=\"mb-3\">\n            <p>ComingSoon Pages will enable users to subscribe to Newsletters and are accessible at the internal paths\n              /join/cs1, /join/cs2, etc.</p>\n          </div>\n          <!-- live page link -->\n          <div class=\"text-end\" *ngIf=\"shardUrl\">\n            <span>See the live page <span class=\"tooltip-wrap ms-1\" [appendTo]=\"'body'\"\n                [pTooltip]=\"'Admin.DomainConfig.Tooltip.SeeLiveCs' | transloco\" tooltipPosition=\"top\">\n                <i class=\"fas fa-info-circle\"></i>\n              </span> : <a [href]=\"shardUrl + '/join/cs1'\" target=\"_blank\">{{ shardUrl }}/join/cs1</a></span>\n          </div>\n          <div class=\"row\">\n            <div class=\"col-12 col-sm-3\">\n              <pw-input-container [label]=\"'Admin.DomainConfig.CsProduct' | transloco\" [showTooltip]=\"true\"\n                [tooltipText]=\"'Admin.DomainConfig.Tooltip.CsProduct' | transloco\" name=\"cs_product_id\">\n                <p-autoComplete [suggestions]=\"productsList\" formControlName=\"cs_product_id\" dataKey=\"id\" field=\"name\"\n                  [dropdown]=\"true\" [delay]=\"1000\" (completeMethod)=\"searchProduct($event)\" styleClass=\"w-100\"\n                  placeholder=\"Search Product\" [inputStyle]=\"\n                                                form.get('cs_product_id').touched &&\n                                                form.get('cs_product_id').invalid\n                                                    ? { border: '1px solid #ff586b' }\n                                                    : { border: '1px solid gray' }\n                                            \" [multiple]=\"false\">\n                </p-autoComplete>\n              </pw-input-container>\n            </div>\n            <div class=\"col-12 col-sm-3\">\n              <pw-input-container [label]=\"'Admin.DomainConfig.CsCrmSourceId' | transloco\" name=\"cs_crm_source_id\"\n                [showTooltip]=\"true\" [tooltipText]=\"'Admin.DomainConfig.Tooltip.CsCrmSourceId' | transloco\">\n                <p-dropdown [options]=\"crmSourcesList\" formControlName=\"cs_crm_source_id\"\n                  [ngClass]=\"{ 'is-invalid': submitted && f['cs_crm_source_id']?.errors }\" [placeholder]=\"'Select CRM Source'\"\n                  optionValue=\"id\" optionLabel=\"name\">\n                </p-dropdown>\n              </pw-input-container>\n            </div>\n            <div class=\"col-12 col-sm-3\">\n              <pw-input-container [label]=\"'Admin.DomainConfig.CsPdfSourceId' | transloco\" name=\"cs_pdf_source_id\"\n                [showTooltip]=\"true\" [tooltipText]=\"'Admin.DomainConfig.Tooltip.CsPdfSourceId' | transloco\">\n                <p-dropdown [options]=\"crmSourcesList\" formControlName=\"cs_pdf_source_id\"\n                  [ngClass]=\"{ 'is-invalid': submitted && f['cs_pdf_source_id']?.errors }\" [placeholder]=\"'Select CRM Source'\"\n                  optionValue=\"id\" optionLabel=\"name\">\n                </p-dropdown>\n              </pw-input-container>\n            </div>\n            <div class=\"col-12 col-sm-3\"></div>\n            <div class=\"col-12 col-sm-3\">\n              <pw-input-container [label]=\"'Admin.DomainConfig.CsVideoUrl' | transloco\" name=\"cs_video_url\" [showTooltip]=\"true\"\n                [tooltipText]=\"'Admin.DomainConfig.Tooltip.CsVideoUrl' | transloco\">\n                <input type=\"text\" class=\"form-control\" formControlName=\"cs_video_url\"\n                  [ngClass]=\"{ 'is-invalid': submitted && f['cs_video_url'].errors }\" />\n              </pw-input-container>\n            </div>\n            <div class=\"col-12 col-sm-3\">\n              <pw-input-container [label]=\"'Admin.DomainConfig.CsBookDemoUrl' | transloco\" name=\"cs_book_demo_url\"\n                [showTooltip]=\"true\" [tooltipText]=\"'Admin.DomainConfig.Tooltip.CsBookDemoUrl' | transloco\">\n                <input type=\"text\" class=\"form-control\" formControlName=\"cs_book_demo_url\"\n                  [ngClass]=\"{ 'is-invalid': submitted && f['cs_book_demo_url'].errors }\" />\n              </pw-input-container>\n            </div>\n            <div class=\"col-12\">\n              <pw-input-container [label]=\"'Admin.DomainConfig.CsCtaIframe' | transloco\" name=\"cs_cta_iframe\"\n                [showTooltip]=\"true\" [tooltipText]=\"'Admin.DomainConfig.Tooltip.CsCtaIframe' | transloco\">\n                <textarea class=\"form-control\" rows=\"3\" formControlName=\"cs_cta_iframe\"\n                  [ngClass]=\"{ 'is-invalid': submitted && f['cs_cta_iframe'].errors }\">\n                                        </textarea>\n              </pw-input-container>\n            </div>\n            <div class=\"col-12\">\n              <pw-input-container [label]=\"'Admin.DomainConfig.CsJoinMessage' | transloco\" name=\"cs_join_message\"\n                [showTooltip]=\"true\" [tooltipText]=\"'Admin.DomainConfig.Tooltip.CsJoinMessage' | transloco\">\n                <textarea class=\"form-control\" rows=\"3\" formControlName=\"cs_join_message\"\n                  [ngClass]=\"{ 'is-invalid': submitted && f['cs_join_message'].errors }\">\n                                        </textarea>\n              </pw-input-container>\n            </div>\n            <div class=\"col-12\">\n              <pw-input-container [label]=\"'Admin.DomainConfig.CsPdfDownloadText' | transloco\" name=\"cs_pdf_download_text\"\n                [showTooltip]=\"true\" [tooltipText]=\"\n                                            'Admin.DomainConfig.Tooltip.CsPdfDownloadText' | transloco\n                                        \">\n                <textarea class=\"form-control\" rows=\"3\" formControlName=\"cs_pdf_download_text\" [ngClass]=\"{\n                                                'is-invalid': submitted && f['cs_pdf_download_text'].errors\n                                            }\">\n                                        </textarea>\n              </pw-input-container>\n            </div>\n          </div>\n          <div class=\"row\" matchHeight=\"card\">\n            <div class=\"col-md-4\">\n              <label for=\"cs_image\">{{ 'Admin.DomainConfig.CsImage' | transloco }} <span class=\"info-circle\">\n                  <span class=\"tooltiptext gradient-custom-branding\">{{ 'Admin.DomainConfig.Tooltip.CsImage' | transloco\n                    }}</span>\n                </span>\n              </label>\n              <pw-custom-uploader (saveEvent)=\"onSaveFile($event)\" [aspectRatio]=\"'custom'\" [title]=\"'Cs Image'\"\n                [controlName]=\"'cs_image'\" [previewData]=\"data['cs_image']\">\n              </pw-custom-uploader>\n            </div>\n            <div class=\"col-md-4\">\n              <label for=\"cs_image2\">{{ 'Admin.DomainConfig.CsImage2' | transloco }} <span class=\"info-circle\">\n                  <span class=\"tooltiptext gradient-custom-branding\">{{ 'Admin.DomainConfig.Tooltip.CsImage2' | transloco\n                    }}</span>\n                </span>\n              </label>\n              <pw-custom-uploader (saveEvent)=\"onSaveFile($event)\" [aspectRatio]=\"'custom'\" [title]=\"'Cs Image2'\"\n                [controlName]=\"'cs_image2'\" [previewData]=\"data['cs_image2']\">\n              </pw-custom-uploader>\n            </div>\n            <div class=\"col-md-4\">\n              <label for=\"cs_pdf_image\">{{ 'Admin.DomainConfig.CsPdfImage' | transloco }} <span class=\"info-circle\">\n                  <span class=\"tooltiptext gradient-custom-branding\">{{ 'Admin.DomainConfig.Tooltip.CsPdfImage' | transloco\n                    }}</span>\n                </span>\n              </label>\n              <pw-custom-uploader (saveEvent)=\"onSaveFile($event)\" [aspectRatio]=\"'custom'\" [title]=\"'Cs Pdf Image'\"\n                [controlName]=\"'cs_pdf_image'\" [previewData]=\"data['cs_pdf_image']\">\n              </pw-custom-uploader>\n            </div>\n            <div class=\"col-md-4\">\n              <label for=\"cs_image_bg\">{{ 'Admin.DomainConfig.CsImageBg' | transloco }} <span class=\"info-circle\">\n                  <span class=\"tooltiptext gradient-custom-branding\">{{ 'Admin.DomainConfig.Tooltip.CsImageBg' | transloco\n                    }}</span>\n                </span>\n              </label>\n              <pw-custom-uploader (saveEvent)=\"onSaveFile($event)\" [aspectRatio]=\"'custom'\" [title]=\"'Cs Pdf Image Bg'\"\n                [controlName]=\"'cs_image_bg'\" [previewData]=\"data['cs_image_bg']\">\n              </pw-custom-uploader>\n            </div>\n            <div class=\"col-md-4\">\n              <label for=\"cs_image_bg2\">{{ 'Admin.DomainConfig.CsImageBg2' | transloco }} <span class=\"info-circle\">\n                  <span class=\"tooltiptext gradient-custom-branding\">{{ 'Admin.DomainConfig.Tooltip.CsImageBg2' | transloco\n                    }}</span>\n                </span>\n              </label>\n              <pw-custom-uploader (saveEvent)=\"onSaveFile($event)\" [aspectRatio]=\"'custom'\" [title]=\"'Cs Pdf Image Bg2'\"\n                [controlName]=\"'cs_image_bg2'\" [previewData]=\"data['cs_image_bg2']\">\n              </pw-custom-uploader>\n            </div>\n          </div>\n        </p-accordionTab>\n      </p-accordion>\n    </div>\n\n    <div class=\"col-12 text-end mt-3\">\n      <button type=\"button\"\n        class=\"btn btn-outline-default me-2\"\n        (click)=\"back()\">\n        {{ 'Button.Cancel' | transloco }}\n      </button>\n      <button type=\"submit\" [buttonBusy]=\"buttonBusy\"\n        class=\"btn btn-primary\">{{ 'Button.Submit' | transloco }}</button>\n    </div>\n  </form>\n</ng-container>\n<div *ngIf=\"!data?.host_name && !isLoading\">\n  <pw-no-data [withImage]=\"true\" [message]=\"'Admin.DomainConfig.EnableConfigTab' | transloco\"> </pw-no-data>\n</div>\n\n\n<ng-template #partnerCropper let-modal>\n  <div class=\"modal-header\">\n    <h5 class=\"modal-title\">Upload Partner Image</h5>\n    <button type=\"button\" class=\"btn-close\" aria-label=\"Close\" (click)=\"modal.dismiss()\"></button>\n  </div>\n  <div class=\"modal-body\">\n    <small>You can upload JPG, PNG, or GIF files. Avoid images with celebrities, nudity, or artwork.</small>\n    <pw-image-cropper\n      aspectRatio=\"auto\"\n      (imageSelectionEvent)=\"onPartnerImageSelected($event)\"\n      (closeEvent)=\"onClosePartnerModal()\"\n    ></pw-image-cropper>\n  </div>\n</ng-template>\n", dependencies: [{ kind: "directive", type: i3$3.PrimeTemplate, selector: "[pTemplate]", inputs: ["type", "pTemplate"] }, { kind: "directive", type: i4$2.Tooltip, selector: "[pTooltip]", inputs: ["tooltipPosition", "tooltipEvent", "appendTo", "positionStyle", "tooltipStyleClass", "tooltipZIndex", "escape", "showDelay", "hideDelay", "life", "positionTop", "positionLeft", "autoHide", "fitContent", "hideOnEscape", "pTooltip", "tooltipDisabled", "tooltipOptions"] }, { kind: "component", type: i7$1.Accordion, selector: "p-accordion", inputs: ["multiple", "style", "styleClass", "expandIcon", "collapseIcon", "activeIndex", "selectOnFocus", "headerAriaLevel"], outputs: ["onClose", "onOpen", "activeIndexChange"] }, { kind: "component", type: i7$1.AccordionTab, selector: "p-accordionTab", inputs: ["id", "header", "headerStyle", "tabStyle", "contentStyle", "tabStyleClass", "headerStyleClass", "contentStyleClass", "disabled", "cache", "transitionOptions", "iconPos", "selected", "headerAriaLevel"], outputs: ["selectedChange"] }, { kind: "component", type: i4$3.AutoComplete, selector: "p-autoComplete", inputs: ["minLength", "delay", "style", "panelStyle", "styleClass", "panelStyleClass", "inputStyle", "inputId", "inputStyleClass", "placeholder", "readonly", "disabled", "scrollHeight", "lazy", "virtualScroll", "virtualScrollItemSize", "virtualScrollOptions", "maxlength", "name", "required", "size", "appendTo", "autoHighlight", "forceSelection", "type", "autoZIndex", "baseZIndex", "ariaLabel", "dropdownAriaLabel", "ariaLabelledBy", "dropdownIcon", "unique", "group", "completeOnFocus", "showClear", "field", "dropdown", "showEmptyMessage", "dropdownMode", "multiple", "tabindex", "dataKey", "emptyMessage", "showTransitionOptions", "hideTransitionOptions", "autofocus", "autocomplete", "optionGroupChildren", "optionGroupLabel", "overlayOptions", "suggestions", "itemSize", "optionLabel", "optionValue", "id", "searchMessage", "emptySelectionMessage", "selectionMessage", "autoOptionFocus", "selectOnFocus", "searchLocale", "optionDisabled", "focusOnHover", "variant"], outputs: ["completeMethod", "onSelect", "onUnselect", "onFocus", "onBlur", "onDropdownClick", "onClear", "onKeyUp", "onShow", "onHide", "onLazyLoad"] }, { kind: "component", type: i3.Dropdown, selector: "p-dropdown", inputs: ["id", "scrollHeight", "filter", "name", "style", "panelStyle", "styleClass", "panelStyleClass", "readonly", "required", "editable", "appendTo", "tabindex", "placeholder", "loadingIcon", "filterPlaceholder", "filterLocale", "variant", "inputId", "dataKey", "filterBy", "filterFields", "autofocus", "resetFilterOnHide", "checkmark", "dropdownIcon", "loading", "optionLabel", "optionValue", "optionDisabled", "optionGroupLabel", "optionGroupChildren", "autoDisplayFirst", "group", "showClear", "emptyFilterMessage", "emptyMessage", "lazy", "virtualScroll", "virtualScrollItemSize", "virtualScrollOptions", "overlayOptions", "ariaFilterLabel", "ariaLabel", "ariaLabelledBy", "filterMatchMode", "maxlength", "tooltip", "tooltipPosition", "tooltipPositionStyle", "tooltipStyleClass", "focusOnHover", "selectOnFocus", "autoOptionFocus", "autofocusFilter", "disabled", "itemSize", "autoZIndex", "baseZIndex", "showTransitionOptions", "hideTransitionOptions", "filterValue", "options"], outputs: ["onChange", "onFilter", "onFocus", "onBlur", "onClick", "onShow", "onHide", "onClear", "onLazyLoad"] }, { kind: "directive", type: i3$1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i3$1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i3$1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i3$2.ɵNgNoValidate, selector: "form:not([ngNoForm]):not([ngNativeValidate])" }, { kind: "directive", type: i3$2.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: i3$2.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i3$2.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { kind: "component", type: i4.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: i9.CustomUploaderComponent, selector: "pw-custom-uploader", inputs: ["controlName", "previewData", "aspectRatio", "title"], outputs: ["saveEvent"] }, { kind: "component", type: i9.ProfileImageCropperComponent, selector: "pw-image-cropper", inputs: ["aspectRatio", "dynamicData"], outputs: ["imageSelectionEvent", "closeEvent", "fileChangeEvent"] }, { kind: "component", type: i5.ProgressSpinner, selector: "p-progressSpinner", inputs: ["styleClass", "style", "strokeWidth", "fill", "animationDuration", "ariaLabel"] }, { kind: "component", type: i9.InputContainerComponent, selector: "pw-input-container", inputs: ["name", "label", "labelClass", "tooltipPosition", "required", "errorMsg", "isReadOnly", "showTooltip", "tooltipText", "showTriangle", "afterLabel", "showAfterLabel", "showTriangleText", "isLeftTooltip"] }, { kind: "component", type: i9.NoDataComponent, selector: "pw-no-data", inputs: ["message", "description", "withImage"] }, { kind: "directive", type: i10.ButtonBusyDirective, selector: "[buttonBusy]", inputs: ["buttonBusy", "busyText"] }, { kind: "directive", type: i10.RbacAllowDirective, selector: "[rbacAllow]", inputs: ["rbacAllow"] }, { kind: "directive", type: i1$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$2.FormGroupDirective, selector: "[formGroup]", inputs: ["formGroup"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { kind: "directive", type: i3$2.FormControlName, selector: "[formControlName]", inputs: ["formControlName", "disabled", "ngModel"], outputs: ["ngModelChange"] }, { kind: "directive", type: i3$2.FormGroupName, selector: "[formGroupName]", inputs: ["formGroupName"] }, { kind: "directive", type: i3$2.FormArrayName, selector: "[formArrayName]", inputs: ["formArrayName"] }, { kind: "pipe", type: i12.TranslocoPipe, name: "transloco" }] }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.3.11", type: DomainConfigBuildComponent, selector: "pw-domain-config-build", viewQueries: [{ propertyName: "partnerCropper", first: true, predicate: ["partnerCropper"], descendants: true }, { propertyName: "uploader", predicate: CustomUploaderComponent, descendants: true }], usesInheritance: true, ngImport: i0, template: "<h3>Public Pages Configuration</h3>\n<div class=\"mb-4\">\n  <p> The following parameters and settings will be applied to all public pages of this domain. </p>\n</div>\n<div class=\"w-100 text-center mt-3\"\n  *ngIf=\"isLoading\">\n  <p-progressSpinner strokeWidth=\"2\"> </p-progressSpinner>\n</div>\n<ng-container *ngIf=\"!isLoading && data?.host_name\">\n  <form [formGroup]=\"form\"\n    (ngSubmit)=\"onSave()\">\n    <div class=\"row\">\n      <div class=\"col-12 col-sm-3\">\n        <pw-input-container [label]=\"'Admin.DomainConfig.MasterSubscription' | transloco\"\n          name=\"master_subscription_id\"\n          [showTooltip]=\"true\"\n          [tooltipText]=\"'Admin.DomainConfig.Tooltip.MasterSubscription' | transloco\">\n          <p-dropdown\n          [options]=\"masterSubscriptionsList\"\n          formControlName=\"master_subscription_id\"\n          [ngClass]=\"{ 'is-invalid': submitted && f['master_subscription_id']?.errors }\"\n          placeholder=\"Select Master Subscription\">\n        </p-dropdown>\n        </pw-input-container>\n      </div>\n      <div class=\"col-12 col-sm-3\">\n        <pw-input-container [label]=\"'Admin.DomainConfig.MasterSubscriptionProduct' | transloco\"\n          [showTooltip]=\"true\"\n          [tooltipText]=\"\n                        'Admin.DomainConfig.Tooltip.MasterSubscriptionProduct' | transloco\n                    \"\n          name=\"master_subscription_product_id\">\n          <p-dropdown\n            [options]=\"masterSubscriptionProductList\"\n            formControlName=\"master_subscription_product_id\"\n            [ngClass]=\"{'is-invalid': submitted && f['master_subscription_product_id']?.errors}\"\n            [placeholder]=\"'Select Master Product'\"\n            optionValue=\"id\"\n            optionLabel=\"name\"\n            >\n          </p-dropdown>\n        </pw-input-container>\n      </div>\n      <div class=\"col-12 col-sm-3\">\n        <pw-input-container [label]=\"'Admin.DomainConfig.BlogFeatureKey' | transloco\"\n          name=\"blog_feature_key\"\n          [showTooltip]=\"true\"\n          [tooltipText]=\"'Admin.DomainConfig.Tooltip.BlogFeatureKey' | transloco\">\n          <input type=\"text\"\n            class=\"form-control\"\n            formControlName=\"blog_feature_key\"\n            [ngClass]=\"{ 'is-invalid': submitted && f['blog_feature_key'].errors }\" />\n        </pw-input-container>\n      </div>\n      <div class=\"col-12 col-sm-3\">\n        <pw-input-container [label]=\"'Admin.DomainConfig.MainTos' | transloco\"\n          name=\"main_tos_id\"\n          [showTooltip]=\"true\"\n          [tooltipText]=\"'Admin.DomainConfig.Tooltip.MainTos' | transloco\">\n          <p-dropdown\n          [options]=\"subscriptionTosList\"\n          formControlName=\"main_tos_id\"\n          [ngClass]=\"{ 'is-invalid': submitted && f['main_tos_id']?.errors }\"\n          [placeholder]=\"'Select Main TOS'\"\n          optionValue=\"id\">\n          <ng-template pTemplate=\"selectedItem\" let-item>\n            <span [innerHTML]=\"item.title\"></span>\n          </ng-template>\n          <ng-template pTemplate=\"item\" let-item>\n            <span [innerHTML]=\"item.title\"></span>\n          </ng-template>\n        </p-dropdown>\n\n        </pw-input-container>\n      </div>\n      <!-- crm subscription fields -->\n      <div class=\"col-12 col-sm-3\">\n        <pw-input-container [label]=\"'Admin.DomainConfig.CrmSubscription' | transloco\"\n          name=\"crm_subscription_id\"\n          [showTooltip]=\"true\"\n          [tooltipText]=\"'Admin.DomainConfig.Tooltip.CrmSubscription' | transloco\">\n          <p-dropdown\n            [options]=\"crmSubscriptionsList\"\n            formControlName=\"crm_subscription_id\"\n            [ngClass]=\"{ 'is-invalid': submitted && f['crm_subscription_id']?.errors }\"\n            [placeholder]=\"'Select CRM Subscription'\"\n            optionValue=\"id\">\n            <ng-template pTemplate=\"selectedItem\" let-item>\n              {{item?.organisation ? item?.organisation + ' - ' + item.contact_name : item?.contact_name}}\n            </ng-template>\n            <ng-template pTemplate=\"item\" let-item>\n              {{item?.organisation ? item?.organisation + ' - ' + item.contact_name : item?.contact_name}}\n            </ng-template>\n          </p-dropdown>\n\n        </pw-input-container>\n      </div>\n      <div class=\"col-12 col-sm-3\">\n        <pw-input-container [label]=\"'Admin.DomainConfig.CrmProduct' | transloco\"\n          name=\"crm_product_id\"\n          [showTooltip]=\"true\"\n          [tooltipText]=\"'Admin.DomainConfig.Tooltip.CrmProduct' | transloco\">\n          <p-dropdown\n            [options]=\"crmProductList\"\n            formControlName=\"crm_product_id\"\n            [ngClass]=\"{ 'is-invalid': submitted && f['crm_product_id']?.errors }\"\n            [placeholder]=\"'Select CRM Product'\"\n            optionValue=\"id\"\n            >\n            <ng-template pTemplate=\"selectedItem\" let-item>\n              {{item?.subscription_id ? item?.name  +' - SubscriptionID = '+ item.subscription_id : item?.name}}\n            </ng-template>\n            <ng-template pTemplate=\"item\" let-item>\n              {{item?.subscription_id ? item?.name  +' - SubscriptionID = '+ item.subscription_id : item?.name}}\n            </ng-template>\n          </p-dropdown>\n        </pw-input-container>\n      </div>\n      <div class=\"col-12 col-sm-3\">\n        <pw-input-container [label]=\"'Admin.DomainConfig.CrmSource' | transloco\"\n          name=\"crm_source_id\"\n          [showTooltip]=\"true\"\n          [tooltipText]=\"'Admin.DomainConfig.Tooltip.CrmSource' | transloco\">\n          <p-dropdown\n            [options]=\"crmSourcesList\"\n            formControlName=\"crm_source_id\"\n            [ngClass]=\"{ 'is-invalid': submitted && f['crm_source_id']?.errors }\"\n            [placeholder]=\"'Select CRM Source'\"\n            optionValue=\"id\"\n            optionLabel=\"name\"\n            >\n          </p-dropdown>\n        </pw-input-container>\n      </div>\n      <!-- crm subscription fields end-->\n      <div class=\"col-12 col-sm-3\">\n        <pw-input-container [label]=\"'Admin.DomainConfig.Active' | transloco\" [showTooltip]=\"true\"\n          [tooltipText]=\"'Admin.DomainConfig.Tooltip.Active' | transloco\" name=\"active\">\n          <ui-switch size=\"small\" uncheckedLabel=\"false\" checkedLabel=\"true\" formControlName=\"active\" name=\"active\"\n            [ngClass]=\"{ 'is-invalid': submitted && f['active'].errors }\">\n          </ui-switch>\n        </pw-input-container>\n      </div>\n      <div class=\"col-12 col-sm-3\">\n        <pw-input-container [label]=\"'Admin.DomainConfig.IsProductDomain' | transloco\"\n          [showTooltip]=\"true\"\n          [tooltipText]=\"'Admin.DomainConfig.Tooltip.IsProductDomain' | transloco\"\n          name=\"is_product_domain\">\n          <ui-switch size=\"small\"\n            uncheckedLabel=\"false\"\n            checkedLabel=\"true\"\n            formControlName=\"is_product_domain\"\n            name=\"is_product_domain\"\n            [ngClass]=\"{ 'is-invalid': submitted && f['is_product_domain'].errors }\">\n          </ui-switch>\n        </pw-input-container>\n      </div>\n      <div class=\"col-12 col-sm-3\">\n        <pw-input-container [label]=\"'Admin.DomainConfig.CanRegisterOnMainPage' | transloco\" [showTooltip]=\"true\"\n          [tooltipText]=\"'Admin.DomainConfig.Tooltip.CanRegisterOnMainPage' | transloco\"\n          name=\"can_register_through_main_page\">\n          <ui-switch size=\"small\" uncheckedLabel=\"false\" checkedLabel=\"true\" formControlName=\"can_register_through_main_page\"\n            name=\"can_register_through_main_page\" [ngClass]=\"{\n                                  'is-invalid': submitted && f['can_register_through_main_page'].errors\n                              }\">\n          </ui-switch>\n        </pw-input-container>\n      </div>\n      <div class=\"col-12 col-sm-3\">\n        <pw-input-container [label]=\"'Admin.DomainConfig.SocialLoginEnabled' | transloco\" [showTooltip]=\"true\"\n          [tooltipText]=\"'Admin.DomainConfig.Tooltip.SocialLoginEnable' | transloco\" name=\"social_login_enabled\">\n          <ui-switch size=\"small\" uncheckedLabel=\"false\" checkedLabel=\"true\" formControlName=\"social_login_enabled\"\n            name=\"social_login_enabled\" [ngClass]=\"{ 'is-invalid': submitted && f['social_login_enabled'].errors }\">\n          </ui-switch>\n        </pw-input-container>\n      </div>\n      <div class=\"col-12 col-sm-3\">\n        <pw-input-container [label]=\"'Admin.DomainConfig.NotifyLogins' | transloco\" [showTooltip]=\"true\"\n          [tooltipText]=\"'Admin.DomainConfig.Tooltip.NotifyLogins' | transloco\" name=\"notify_logins\">\n          <ui-switch size=\"small\" uncheckedLabel=\"false\" checkedLabel=\"true\" formControlName=\"notify_logins\"\n            name=\"notify_logins\" [ngClass]=\"{ 'is-invalid': submitted && f['notify_logins'].errors }\">\n          </ui-switch>\n        </pw-input-container>\n      </div>\n    </div>\n\n    <div class=\"my-5\" *rbacAllow=\"'Pages.SuperAdmin'\">\n      <h3>Pre-Built Landing Pages for User Onboarding</h3>\n\n      <p-accordion class=\"mt-5\">\n        <p-accordionTab [header]=\"'Instructions - README FIRST'\">\n          <div class=\"mb-3\">\n            <p>We\u2019ve built and maintain a collection of high-converting landing pages designed to help you quickly launch polished\n              UIs for onboarding users.</p>\n            <p><strong>Newsletter Subscription Pages:</strong><br> After configuring your domain, you can access pages like\n              <strong>/join/cs1, /join/cs2, /join/cs3, etc.</strong>, specifically designed for newsletter sign-ups. <br>\n              Subscribers from these pages will be listed in the <strong>SmartCRM module</strong>.</p>\n            <p><strong>Trial Product Sign-Up Pages:</strong><br> For users interested in trial products, utilize pages such as\n              <strong>/join/trial1, /join/trial2, /join/trial3, etc.</strong>.<br> Users registering through these pages will\n              appear in the <strong>Admin > Users section</strong>.</p>\n            <p>Once you\u2019ve selected the landing page you want to use <strong>(e.g., /join/trial3)</strong>, make sure to update\n              the <strong>Internal Path</strong> in the <strong>Core tab</strong> accordingly\u2014i.e., set it to\n              <strong>/join/trial3</strong>.</p>\n            <p>If you need assistance integrating these pages into your workflow or have further questions, feel free to reach\n              out.</p>\n          </div>\n        </p-accordionTab>\n\n        <p-accordionTab [header]=\"'Subscribe to Product/Newsletter Config'\">\n          <div class=\"mb-3\">\n            <p>Trial Pages will enable users to sign up to real products and are accessible at the path /join/trial1,\n              /join/trial2, etc.</p>\n            <p>ComingSoon Pages will enable users to subscribe to Newsletters and are accessible at the internal paths\n              /join/cs1, /join/cs2, etc.</p>\n          </div>\n          <!-- live page link -->\n          <div class=\"text-end\" *ngIf=\"shardUrl\">\n            <span>See the live page <span class=\"tooltip-wrap ms-1\" [appendTo]=\"'body'\"\n                [pTooltip]=\"'Admin.DomainConfig.Tooltip.SeeLiveTrial' | transloco\" tooltipPosition=\"top\">\n                <i class=\"fas fa-info-circle\"></i>\n              </span> : <a [href]=\"shardUrl + '/join/trial1'\" target=\"_blank\">{{ shardUrl }}/join/trial1</a></span>\n          </div>\n          <div class=\"row\">\n            <div class=\"col-sm-3\">\n              <pw-input-container [label]=\"'Admin.DomainConfig.TrialProduct' | transloco\" [showTooltip]=\"true\"\n                [tooltipText]=\"'Admin.DomainConfig.Tooltip.TrialProduct' | transloco\" name=\"trial_product_id\">\n                <p-autoComplete [suggestions]=\"productsList\" formControlName=\"trial_product_id\" dataKey=\"id\" field=\"name\"\n                  [dropdown]=\"true\" [delay]=\"1000\" (completeMethod)=\"searchProduct($event)\" styleClass=\"w-100\"\n                  placeholder=\"Search Product\" [inputStyle]=\"\n                                                  form.get('trial_product_id').touched &&\n                                                  form.get('trial_product_id').invalid\n                                                      ? { border: '1px solid #ff586b' }\n                                                      : { border: '1px solid gray' }\n                                              \" [multiple]=\"false\">\n                </p-autoComplete>\n              </pw-input-container>\n            </div>\n            <div class=\"col-12 col-sm-3\">\n              <pw-input-container [label]=\"'Admin.DomainConfig.TrialCrmSourceId' | transloco\" name=\"trial_crm_source_id\"\n                [showTooltip]=\"true\" [tooltipText]=\"\n                                              'Admin.DomainConfig.Tooltip.TrialCrmSourceId' | transloco\n                                          \">\n                <p-dropdown [options]=\"crmSourcesList\" formControlName=\"trial_crm_source_id\"\n                  [ngClass]=\"{ 'is-invalid': submitted && f['trial_crm_source_id']?.errors }\"\n                  [placeholder]=\"'Select CRM Source'\" optionValue=\"id\" optionLabel=\"name\">\n                </p-dropdown>\n              </pw-input-container>\n            </div>\n            <div class=\"col-12 col-sm-3\">\n              <pw-input-container [label]=\"'Admin.DomainConfig.TrialPdfSourceId' | transloco\" name=\"trial_pdf_source_id\"\n                [showTooltip]=\"true\" [tooltipText]=\"\n                                              'Admin.DomainConfig.Tooltip.TrialPdfSourceId' | transloco\n                                          \">\n                <p-dropdown [options]=\"crmSourcesList\" formControlName=\"trial_pdf_source_id\"\n                  [ngClass]=\"{ 'is-invalid': submitted && f['trial_pdf_source_id']?.errors }\"\n                  [placeholder]=\"'Select CRM Source'\" optionValue=\"id\" optionLabel=\"name\">\n                </p-dropdown>\n              </pw-input-container>\n            </div>\n            <div class=\"col-12 col-sm-3\"></div>\n            <div class=\"col-12 col-sm-3\">\n              <pw-input-container [label]=\"'Admin.DomainConfig.TrialVideoUrl' | transloco\" name=\"trial_video_url\"\n                [showTooltip]=\"true\" [tooltipText]=\"'Admin.DomainConfig.Tooltip.TrialVideoUrl' | transloco\">\n                <input type=\"text\" class=\"form-control\" formControlName=\"trial_video_url\"\n                  [ngClass]=\"{ 'is-invalid': submitted && f['trial_video_url'].errors }\" />\n              </pw-input-container>\n            </div>\n            <div class=\"col-12 col-sm-3\">\n              <pw-input-container [label]=\"'Admin.DomainConfig.TrialBookDemoUrl' | transloco\" name=\"trial_book_demo_url\"\n                [showTooltip]=\"true\" [tooltipText]=\"\n                                              'Admin.DomainConfig.Tooltip.TrialBookDemoUrl' | transloco\n                                          \">\n                <input type=\"text\" class=\"form-control\" formControlName=\"trial_book_demo_url\" [ngClass]=\"{\n                                                  'is-invalid': submitted && f['trial_book_demo_url'].errors\n                                              }\" />\n              </pw-input-container>\n            </div>\n            <div class=\"col-12\">\n              <pw-input-container [label]=\"'Admin.DomainConfig.TrialCtaIframe' | transloco\" name=\"trial_cta_iframe\"\n                [showTooltip]=\"true\" [tooltipText]=\"\n                                              'Admin.DomainConfig.Tooltip.TrialCtaIframe' | transloco\n                                          \">\n                <textarea rows=\"3\" class=\"form-control\" formControlName=\"trial_cta_iframe\" [ngClass]=\"{\n                                                  'is-invalid': submitted && f['trial_cta_iframe'].errors\n                                              }\">\n                                          </textarea>\n              </pw-input-container>\n            </div>\n            <div class=\"col-12\">\n              <pw-input-container [label]=\"'Admin.DomainConfig.TrialJoinMessage' | transloco\" name=\"trial_join_message\"\n                [showTooltip]=\"true\" [tooltipText]=\"\n                                              'Admin.DomainConfig.Tooltip.TrialJoinMessage' | transloco\n                                          \">\n                <textarea rows=\"3\" class=\"form-control\" formControlName=\"trial_join_message\" [ngClass]=\"{\n                                                  'is-invalid': submitted && f['trial_join_message'].errors\n                                              }\">\n                                          </textarea>\n              </pw-input-container>\n            </div>\n            <div class=\"col-12\">\n              <pw-input-container [label]=\"'Admin.DomainConfig.TrialPdfDownloadText' | transloco\" name=\"trial_pdf_download_text\"\n                [showTooltip]=\"true\" [tooltipText]=\"\n                                              'Admin.DomainConfig.Tooltip.TrialPdfDownloadText' | transloco\n                                          \">\n                <textarea rows=\"3\" class=\"form-control\" formControlName=\"trial_pdf_download_text\" [ngClass]=\"{\n                                                  'is-invalid': submitted && f['trial_pdf_download_text'].errors\n                                              }\">\n                                          </textarea>\n              </pw-input-container>\n            </div>\n          </div>\n          <div class=\"row\" matchHeight=\"card\">\n            <div class=\"col-md-4\">\n              <label for=\"trial_image\">{{ 'Admin.DomainConfig.TrialImage' | transloco }} <span class=\"info-circle\">\n                  <span class=\"tooltiptext gradient-custom-branding\">{{ 'Admin.DomainConfig.Tooltip.TrialImage' | transloco\n                    }}</span>\n                </span>\n              </label>\n              <pw-custom-uploader (saveEvent)=\"onSaveFile($event)\" [aspectRatio]=\"'custom'\" [title]=\"'Trial Image'\"\n                [controlName]=\"'trial_image'\" [previewData]=\"data['trial_image']\">\n              </pw-custom-uploader>\n            </div>\n            <div class=\"col-md-4\">\n              <label for=\"trial_image2\">{{ 'Admin.DomainConfig.TrialImage2' | transloco }} <span class=\"info-circle\">\n                  <span class=\"tooltiptext gradient-custom-branding\">{{ 'Admin.DomainConfig.Tooltip.TrialImage2' | transloco\n                    }}</span>\n                </span>\n              </label>\n              <pw-custom-uploader (saveEvent)=\"onSaveFile($event)\" [title]=\"'Trial Image2'\" [aspectRatio]=\"'custom'\"\n                [controlName]=\"'trial_image2'\" [previewData]=\"data['trial_image2']\">\n              </pw-custom-uploader>\n            </div>\n            <div class=\"col-md-4\">\n              <label for=\"trial_pdf_image\">{{ 'Admin.DomainConfig.TrialPdfImage' | transloco }} <span class=\"info-circle\">\n                  <span class=\"tooltiptext gradient-custom-branding\">{{ 'Admin.DomainConfig.Tooltip.TrialPdfImage' | transloco\n                    }}</span>\n                </span>\n              </label>\n              <pw-custom-uploader (saveEvent)=\"onSaveFile($event)\" [title]=\"'Trial Pdf Image'\" [aspectRatio]=\"'custom'\"\n                [controlName]=\"'trial_pdf_image'\" [previewData]=\"data['trial_pdf_image']\">\n              </pw-custom-uploader>\n            </div>\n            <div class=\"col-md-4\">\n              <label for=\"trial_image_bg\">{{ 'Admin.DomainConfig.TrialImageBg' | transloco }} <span class=\"info-circle\">\n                  <span class=\"tooltiptext gradient-custom-branding\">{{ 'Admin.DomainConfig.Tooltip.TrialImageBg' | transloco\n                    }}</span>\n                </span>\n              </label>\n              <pw-custom-uploader (saveEvent)=\"onSaveFile($event)\" [title]=\"'Trial Image Bg'\" [aspectRatio]=\"'custom'\"\n                [controlName]=\"'trial_image_bg'\" [previewData]=\"data['trial_image_bg']\">\n              </pw-custom-uploader>\n            </div>\n            <div class=\"col-md-4\">\n              <label for=\"trial_image_bg2\">{{ 'Admin.DomainConfig.TrialImageBg2' | transloco }} <span class=\"info-circle\">\n                  <span class=\"tooltiptext gradient-custom-branding\">{{ 'Admin.DomainConfig.Tooltip.TrialImageBg2' | transloco\n                    }}</span>\n                </span>\n              </label>\n              <pw-custom-uploader (saveEvent)=\"onSaveFile($event)\" [title]=\"'Trial Image Bg2'\" [aspectRatio]=\"'custom'\"\n                [controlName]=\"'trial_image_bg2'\" [previewData]=\"data['trial_image_bg2']\">\n              </pw-custom-uploader>\n            </div>\n          </div>\n        </p-accordionTab>\n\n        <p-accordionTab [header]=\"'Header Section'\">\n          <div class=\"row mt-4\" formGroupName=\"header\">\n            <h4 class=\"mb-4\">Header Section</h4>\n            <div class=\"col-12 col-md-12\">\n              <pw-input-container label=\"Header Headline\" name=\"headline\">\n                <input type=\"text\" class=\"form-control\" formControlName=\"headline\" />\n              </pw-input-container>\n            </div>\n            <div class=\"col-12 col-md-6\">\n              <pw-input-container label=\"Header Video URL\" name=\"video_url\">\n                <input type=\"text\" class=\"form-control\" formControlName=\"video_url\" />\n              </pw-input-container>\n            </div>\n            <div class=\"col-12 col-md-6\">\n              <pw-input-container label=\"Header Background Image URL\" name=\"bg_image_url\">\n                <input type=\"text\" class=\"form-control\" formControlName=\"bg_image_url\" />\n              </pw-input-container>\n            </div>\n            <div class=\"col-12\">\n              <pw-input-container label=\"Header Description\">\n                <textarea class=\"form-control\" rows=\"5\" formControlName=\"description\"\n                  [ngClass]=\"{ 'is-invalid': submitted && f['description']?.errors }\">\n                                                </textarea>\n              </pw-input-container>\n            </div>\n            <div formArrayName=\"sub_headings\" class=\"col-12\">\n              <div *ngFor=\"let sub of f['header'].get('sub_headings')['controls']; let i = index\" [formGroupName]=\"i\"\n                class=\"row mb-3\">\n                <div class=\"col-md-10\" *ngIf=\"f['header'].get('sub_headings')['controls'].length\">\n                  <pw-input-container label=\"Sub Header Description\">\n                    <textarea class=\"form-control\" rows=\"3\" formControlName=\"description\"\n                      [ngClass]=\"{ 'is-invalid': submitted && f['description']?.errors }\">\n                                                    </textarea>\n                  </pw-input-container>\n                </div>\n                <div class=\"col-md-2 d-flex align-items-center mt-3\">\n                  <i class=\"fa fa-trash delete-icon\" (click)=\"removeHeaderSubHeading(i)\"\n                    (keydown.enter)=\"removeHeaderSubHeading(i)\" (keydown.space)=\"removeHeaderSubHeading(i)\" ngbTooltip=\"Remove\"\n                    aria-hidden=\"true\"></i>\n                </div>\n              </div>\n              <button type=\"button\" class=\"btn btn-primary mt-2 mb-2\" (click)=\"addHeaderSubHeading()\"> + Add Sub Heading\n              </button>\n            </div>\n          </div>\n        </p-accordionTab>\n\n        <p-accordionTab [header]=\"'Resources Section'\">\n          <div class=\"row row mt-4 mb-4\">\n            <h4 class=\"mb-3\">Resources Section</h4>\n            <div class=\"col-12 col-sm-6\">\n              <pw-input-container [label]=\"'Admin.DomainConfig.ResourceTagline' | transloco\" name=\"resources_tagline\"\n                [showTooltip]=\"true\" [tooltipText]=\"'Admin.DomainConfig.Tooltip.ResourceTagline' | transloco\">\n                <input type=\"text\" class=\"form-control\" formControlName=\"resources_tagline\"\n                  [ngClass]=\"{ 'is-invalid': submitted && f['resources_tagline'].errors }\" />\n              </pw-input-container>\n            </div>\n            <div class=\"col-12\">\n              <pw-input-container [label]=\"'Admin.DomainConfig.ResourceDescription' | transloco\" name=\"resources_description\"\n                [showTooltip]=\"true\" [tooltipText]=\"'Admin.DomainConfig.Tooltip.ResourceDescription' | transloco\">\n                <textarea class=\"form-control\" rows=\"3\" formControlName=\"resources_description\"\n                  [ngClass]=\"{ 'is-invalid': submitted && f['resources_description'].errors }\">\n                                          </textarea>\n              </pw-input-container>\n            </div>\n          </div>\n          <div class=\"row\" matchHeight=\"card\">\n            <div class=\"col-md-4\">\n              <label for=\"resource_image\">{{ 'Admin.DomainConfig.ResourceImage' | transloco }} <span class=\"info-circle\">\n                  <span class=\"tooltiptext gradient-custom-branding\">{{ 'Admin.DomainConfig.Tooltip.ResourceImage' | transloco\n                    }}</span>\n                </span>\n              </label>\n              <pw-custom-uploader (saveEvent)=\"onSaveFile($event)\" [aspectRatio]=\"'custom'\" [title]=\"'Cs Image'\"\n                [controlName]=\"'resources_image'\" [previewData]=\"data['resources_image']\">\n              </pw-custom-uploader>\n            </div>\n          </div>\n        </p-accordionTab>\n\n        <p-accordionTab [header]=\"'Unique Selling Proposition Section (USP) '\">\n          <div class=\"row mt-4 mb-4\" formGroupName=\"usps\">\n            <h4 class=\"mb-4\">Unique Selling Proposition Section (USP)</h4>\n            <div class=\"col-12 col-md-6\">\n              <pw-input-container label=\"USPs Title\" name=\"title\">\n                <input type=\"text\" class=\"form-control\" formControlName=\"title\" />\n              </pw-input-container>\n            </div>\n            <div class=\"col-12 col-md-6\">\n              <pw-input-container label=\"USPs Video Url\" name=\"video_url\">\n                <input type=\"text\" class=\"form-control\" formControlName=\"video_url\" />\n              </pw-input-container>\n            </div>\n            <div class=\"col-12\">\n              <pw-input-container label=\"USPs Description\" name=\"description\">\n                <textarea class=\"form-control\" rows=\"3\" formControlName=\"description\"\n                 >\n                                  </textarea>\n              </pw-input-container>\n            </div>\n            <div formArrayName=\"items\" class=\"col-12\">\n              <div\n                *ngFor=\"let item of f['usps'].get('items')['controls']; let i = index\"\n                [formGroupName]=\"i\"\n                class=\"row mb-3\"\n              >\n                <div class=\"col-sm-10\">\n                  <pw-input-container label=\"Item Description\">\n                    <textarea class=\"form-control\" rows=\"3\" formControlName=\"description\"\n                  >\n                                  </textarea>\n                  </pw-input-container>\n                </div>\n                <div class=\"col-sm-2 d-flex align-items-center mt-3\">\n                  <i\n                    class=\"fa fa-trash delete-icon\"\n                    (click)=\"removeUspItem(i)\"\n                    (keydown.enter)=\"removeUspItem(i)\"\n                    (keydown.space)=\"removeUspItem(i)\"\n                    ngbTooltip=\"Remove\"\n                    aria-hidden=\"true\"\n                  ></i>\n                </div>\n              </div>\n              <button type=\"button\" class=\"btn btn-primary mt-2 mb-2\" (click)=\"addUspItem()\">\n                + Add USP Item\n              </button>\n            </div>\n          </div>\n        </p-accordionTab>\n\n        <p-accordionTab [header]=\"'Partners (Clients) Section'\">\n\n          <div class=\"row mt-4 mb-4\" formGroupName=\"partners\">\n            <h4 class=\"mb-4\">Partners (Clients) Section</h4>\n            <!-- Title -->\n            <div class=\"col-12 col-md-6\">\n              <pw-input-container label=\"Partner Title\" name=\"title\">\n                <input type=\"text\" class=\"form-control\" formControlName=\"title\" />\n              </pw-input-container>\n            </div>\n\n            <!-- Description -->\n            <div class=\"col-12\">\n              <pw-input-container label=\"Partners Description\" name=\"description\">\n                <textarea class=\"form-control\" rows=\"3\" formControlName=\"description\"></textarea>\n              </pw-input-container>\n            </div>\n\n            <!-- Partner Items -->\n            <div formArrayName=\"items\" class=\"col-12\">\n              <div *ngFor=\"let item of partnersItems.controls; let i = index\" [formGroupName]=\"i\" class=\"row border p-3 mb-3\">\n                <!-- Name -->\n                <div class=\"col-md-6\">\n                  <pw-input-container label=\"Name\" class=\"col-12 col-md-6\" name=\"name\">\n                    <input class=\"form-control\" formControlName=\"name\"/>\n                  </pw-input-container>\n                </div>\n\n                <!-- Blog URL -->\n                <div class=\"col-md-6\">\n                  <pw-input-container label=\"Blog Url\" class=\"col-12 col-md-6\" name=\"blog_url\">\n                    <input class=\"form-control\" formControlName=\"blog_url\"/>\n                  </pw-input-container>\n                </div>\n\n                <!-- Video URL -->\n                <div class=\"col-md-6\">\n                  <pw-input-container label=\"Video Url\" class=\"col-12 col-md-6\" name=\"video_url\">\n                    <input class=\"form-control\" formControlName=\"video_url\"/>\n                  </pw-input-container>\n                </div>\n                <div class=\"col-md-6\">\n                  <pw-input-container label=\"Image Url\" class=\"col-12 col-md-6\" name=\"ctas_title\">\n                    <input class=\"form-control\" formControlName=\"image_url\"/>\n                  </pw-input-container>\n                </div>\n\n                <!-- Remove Button -->\n                <div class=\"col-md-6 text-start mt-2 align-self-center\">\n                  <i ngbTooltip=\"Remove\" (click)=\"removePartnerItem(i)\" class=\"fa fa-trash delete-icon\" aria-hidden=\"true\"></i>\n                </div>\n              </div>\n\n              <!-- Add New Partner -->\n              <div class=\"text-start mt-2\">\n                <button type=\"button\" class=\"btn btn-primary mt-2 mb-2\" (click)=\"addPartnerItem()\">+ Add Partner</button>\n              </div>\n            </div>\n          </div>\n        </p-accordionTab>\n\n        <p-accordionTab [header]=\"'Testimonials Section'\">\n          <div class=\"row mt-3 mb-4\" formGroupName=\"testimonials\">\n            <h4 class=\"mb-4\">Testimonials Section</h4>\n\n            <pw-input-container label=\"Title\" class=\"col-12 col-md-6\" name=\"testimonials_title\">\n              <input type=\"text\" class=\"form-control\" formControlName=\"title\" />\n            </pw-input-container>\n\n            <pw-input-container label=\"Description\" class=\"col-12\" name=\"testimonials_description\">\n              <textarea rows=\"3\" class=\"form-control\" formControlName=\"description\"></textarea>\n            </pw-input-container>\n\n            <!-- Items List -->\n            <div formArrayName=\"items\" class=\"col-12 mt-3\">\n              <div *ngFor=\"let item of testimonialsItems.controls; let i = index\" [formGroupName]=\"i\" class=\"row border p-3 mb-3\">\n\n                <pw-input-container label=\"Name\" class=\"col-md-6\">\n                  <input type=\"text\" class=\"form-control\" formControlName=\"name\" />\n                </pw-input-container>\n\n                <pw-input-container label=\"Blog URL\" class=\"col-md-6\">\n                  <input type=\"text\" class=\"form-control\" formControlName=\"blog_url\" />\n                </pw-input-container>\n\n                <pw-input-container label=\"Image URL\" class=\"col-md-6\">\n                  <input type=\"text\" class=\"form-control\" formControlName=\"image_url\" />\n                </pw-input-container>\n\n                <pw-input-container label=\"Video URL\" class=\"col-md-6\">\n                  <input type=\"text\" class=\"form-control\" formControlName=\"video_url\" />\n                </pw-input-container>\n\n                <pw-input-container label=\"Testimonial\" class=\"col-md-10\">\n                  <textarea class=\"form-control\" rows=\"3\" formControlName=\"testimonial\"></textarea>\n                </pw-input-container>\n\n                <div class=\"col-md-2 d-flex align-items-center mt-3\">\n                  <i\n                      ngbTooltip=\"Remove\" (click)=\"removeTestimonialItem(i)\"\n                      (keydown.enter)=\"removeTestimonialItem(i)\"\n                      (keydown.space)=\"removeTestimonialItem(i)\" class=\"fa fa-trash delete-icon\"\n                      aria-hidden=\"true\"\n                  ></i>\n                </div>\n              </div>\n\n              <div class=\"text-start mt-2\">\n                <button type=\"button\" class=\"btn btn-primary mt-2 mb-2\" (click)=\"addTestimonialItem()\">+ Add Testimonial</button>\n              </div>\n            </div>\n          </div>\n        </p-accordionTab>\n\n        <p-accordionTab [header]=\"'Video Section'\">\n          <div class=\"row mt-3 mb-4\" formGroupName=\"videos\">\n            <h4 class=\"mb-3\">Video Section</h4>\n\n            <pw-input-container label=\"Title\" class=\"col-12 col-md-6\" name=\"videos_title\">\n              <input type=\"text\" class=\"form-control\" formControlName=\"title\" />\n            </pw-input-container>\n\n            <pw-input-container label=\"Description\" class=\"col-12\" name=\"videos_description\">\n              <textarea rows=\"3\" class=\"form-control\" formControlName=\"description\"></textarea>\n            </pw-input-container>\n\n            <!-- Video Items -->\n            <div formArrayName=\"items\" class=\"col-12 mt-3\">\n              <div *ngFor=\"let item of videosItems.controls; let i = index\" [formGroupName]=\"i\" class=\"row border p-3 mb-3\">\n\n                <pw-input-container label=\"Title\" class=\"col-md-6\">\n                  <input type=\"text\" class=\"form-control\" formControlName=\"title\" />\n                </pw-input-container>\n\n                <pw-input-container label=\"Blog URL\" class=\"col-md-6\">\n                  <input type=\"text\" class=\"form-control\" formControlName=\"blog_url\" />\n                </pw-input-container>\n\n                <pw-input-container label=\"Image URL\" class=\"col-md-6\">\n                  <input type=\"text\" class=\"form-control\" formControlName=\"image_url\" />\n                </pw-input-container>\n\n                <pw-input-container label=\"Video URL\" class=\"col-md-6\">\n                  <input type=\"text\" class=\"form-control\" formControlName=\"video_url\" />\n                </pw-input-container>\n\n                <pw-input-container label=\"Description\" class=\"col-md-10\">\n                  <textarea class=\"form-control\" rows=\"3\" formControlName=\"description\"></textarea>\n                </pw-input-container>\n\n                <div class=\"col-md-2 d-flex align-items-center mt-3\">\n                  <i\n                    class=\"fa fa-trash delete-icon\"\n                    (click)=\"removeVideoItem(i)\"\n                    (keydown.enter)=\"removeVideoItem(i)\"\n                    (keydown.space)=\"removeVideoItem(i)\"\n                    ngbTooltip=\"Remove\"\n                    aria-hidden=\"true\"\n                  ></i>\n                </div>\n              </div>\n\n              <div class=\"text-start mt-2\">\n                <button type=\"button\" class=\"btn btn-primary mt-2 mb-2\" (click)=\"addVideoItem()\">+ Add Video</button>\n              </div>\n            </div>\n          </div>\n        </p-accordionTab>\n\n        <p-accordionTab [header]=\"'Call to Actions Section (CTAs)'\">\n          <div class=\"row mt-4 mb-4\" formGroupName=\"ctas\">\n            <h4 class=\"mb-4\">CTAs Section</h4>\n\n            <div class=\"col-12 col-md-6\">\n              <pw-input-container label=\"Title\" name=\"title\">\n                <input type=\"text\" class=\"form-control\" formControlName=\"title\" />\n              </pw-input-container>\n            </div>\n\n            <div class=\"col-12 col-md-6\">\n              <pw-input-container label=\"Description\" name=\"description\">\n                <input type=\"text\" class=\"form-control\" formControlName=\"description\" />\n              </pw-input-container>\n            </div>\n\n            <div class=\"col-12\">\n              <pw-input-container label=\"Image URL\" name=\"image_url\">\n                <input type=\"text\" class=\"form-control\" formControlName=\"image_url\" />\n              </pw-input-container>\n            </div>\n\n            <!-- CTA Items -->\n            <div formArrayName=\"items\" class=\"col-12 mt-3\">\n              <div *ngFor=\"let item of ctasItems.controls; let i = index\" [formGroupName]=\"i\" class=\"row border p-3 mb-3 ng-untouched ng-pristine ng-valid ng-star-inserted\">\n                <div class=\"col-12 col-md-6\">\n                  <pw-input-container label=\"Image URL\" name=\"image_url\">\n                    <input type=\"text\" class=\"form-control\" formControlName=\"image_url\" />\n                  </pw-input-container>\n                </div>\n\n                <div class=\"col-12 col-md-6\">\n                  <pw-input-container label=\"Cta URL\" name=\"cta_url\">\n                    <input type=\"text\" class=\"form-control\" formControlName=\"cta_url\" />\n                  </pw-input-container>\n                </div>\n\n                <div class=\"col-12 col-md-6\">\n                  <pw-input-container label=\"Video URL\" name=\"video_url\">\n                    <input type=\"text\" class=\"form-control\" formControlName=\"video_url\" />\n                  </pw-input-container>\n                </div>\n                <div class=\"col-12 col-md-6\">\n                  <pw-input-container label=\"CTA Title\">\n                    <input class=\"form-control\" formControlName=\"title\" />\n                  </pw-input-container>\n                </div>\n                <div class=\"col-12 col-md-6\">\n                  <pw-input-container label=\"CTA Description\">\n                    <input class=\"form-control\" formControlName=\"description\" />\n                  </pw-input-container>\n                </div>\n                <div class=\"col-12 col-md-6\">\n                  <pw-input-container label=\"Button Text\">\n                    <input class=\"form-control\" formControlName=\"button_text\" />\n                  </pw-input-container>\n                </div>\n                <div class=\"col-md-1 d-flex align-items-center mt-3\">\n                  <i\n                    class=\"fa fa-trash delete-icon\"\n                    (click)=\"removeCtasItem(i)\"\n                    (keydown.enter)=\"removeCtasItem(i)\"\n                    (keydown.space)=\"removeCtasItem(i)\"\n                    ngbTooltip=\"Remove\"\n                    aria-hidden=\"true\"\n                  ></i>\n                </div>\n              </div>\n              <div class=\"text-start mt-2\">\n                <button type=\"button\" class=\"btn btn-primary mt-2 mb-2\" (click)=\"addCtasItem()\">+ Add CTA Item</button>\n              </div>\n            </div>\n          </div>\n        </p-accordionTab>\n\n        <p-accordionTab [header]=\"'Integrations Section'\">\n          <div class=\"row mt-3 mb-4\" formGroupName=\"integrations\">\n            <h4 class=\"mb-3\">Integrations Section</h4>\n\n            <pw-input-container label=\"Title\" class=\"col-12\">\n              <input type=\"text\" class=\"form-control\" formControlName=\"title\" />\n            </pw-input-container>\n\n            <pw-input-container label=\"Description\" class=\"col-12\">\n              <textarea class=\"form-control\" formControlName=\"description\" rows=\"3\"></textarea>\n            </pw-input-container>\n\n            <div formArrayName=\"items\" class=\"col-12\">\n              <div\n                *ngFor=\"let item of integrationsItems.controls; let i = index\"\n                [formGroupName]=\"i\"\n                class=\"row border p-3 mb-3 rounded bg-light\"\n              >\n                <pw-input-container label=\"Title\" class=\"col-md-6\">\n                  <input type=\"text\" class=\"form-control\" formControlName=\"title\" />\n                </pw-input-container>\n\n                <pw-input-container label=\"Description\" class=\"col-md-6\">\n                  <input type=\"text\" class=\"form-control\" formControlName=\"description\" />\n                </pw-input-container>\n\n                <pw-input-container label=\"Blog URL\" class=\"col-md-6\">\n                  <input type=\"text\" class=\"form-control\" formControlName=\"blog_url\" />\n                </pw-input-container>\n\n                <pw-input-container label=\"Image URL\" class=\"col-md-6\">\n                  <input type=\"text\" class=\"form-control\" formControlName=\"image_url\" />\n                </pw-input-container>\n\n                <pw-input-container label=\"Video URL\" class=\"col-md-6\">\n                  <input type=\"text\" class=\"form-control\" formControlName=\"video_url\" />\n                </pw-input-container>\n\n                <div class=\"col-md-6 d-flex align-items-end justify-content-end\">\n                  <button\n                    type=\"button\"\n                    class=\"btn btn-danger\"\n                    (click)=\"removeIntegrationItem(i)\"\n                  >\n                    Remove\n                  </button>\n                </div>\n              </div>\n\n              <div class=\"text-start mt-2\">\n                <button type=\"button\" class=\"btn btn-primary\" (click)=\"addIntegrationItem()\">\n                  + Add Integration\n                </button>\n              </div>\n            </div>\n          </div>\n        </p-accordionTab>\n\n        <p-accordionTab [header]=\"'Contact Us Section'\">\n          <div class=\"row mt-3 mb-4\" formGroupName=\"contact_us\">\n            <h4 class=\"mb-3\">Contact Us Section</h4>\n            <pw-input-container label=\"Url\" class=\"col-md-6\">\n              <input type=\"text\" class=\"form-control\" formControlName=\"url\" />\n            </pw-input-container>\n            <pw-input-container label=\"Description\" class=\"col-12\" name=\"contact_us_description\">\n              <textarea rows=\"3\" class=\"form-control\" formControlName=\"description\"></textarea>\n            </pw-input-container>\n            <div formArrayName=\"questions\" class=\"col-12 mt-3\">\n              <div *ngFor=\"let questionGroup of contactUsQuestions.controls; let i = index\" [formGroupName]=\"i\"\n                class=\"row border p-3 mb-3\">\n                <pw-input-container label=\"Question\" class=\"col-md-10\">\n                  <input type=\"text\" class=\"form-control\" formControlName=\"question\" />\n                </pw-input-container>\n                <div class=\"col-md-2 d-flex align-items-center mt-3\">\n                  <i class=\"fa fa-trash delete-icon\" (click)=\"removeContactUsQuestion(i)\"\n                    (keydown.enter)=\"removeContactUsQuestion(i)\" (keydown.space)=\"removeContactUsQuestion(i)\"\n                    ngbTooltip=\"Remove\" aria-hidden=\"true\"></i>\n                </div>\n                <!-- Options inside each question -->\n                <div class=\"col-12\" formArrayName=\"options\">\n                  <div class=\"row align-items-center mb-2 border p-3\"\n                    *ngFor=\"let option of getQuestionOptions(i).controls; let j = index\" [formGroupName]=\"j\">\n                    <pw-input-container label=\"Option\" class=\"col-md-10\">\n                      <input type=\"text\" class=\"form-control\" formControlName=\"option\" />\n                    </pw-input-container>\n                    <div class=\"col-md-2 d-flex align-items-center mt-3\">\n                      <i class=\"fa fa-trash delete-icon\" (click)=\"removeContactUsOption(i, j)\"\n                        (keydown.enter)=\"removeContactUsOption(i, j)\" (keydown.space)=\"removeContactUsOption(i, j)\"\n                        ngbTooltip=\"Remove Option\" aria-hidden=\"true\"></i>\n                    </div>\n                  </div>\n                  <div class=\"text-start\">\n                    <button type=\"button\" class=\"btn btn-primary btn-sm\" (click)=\"addContactUsOption(i)\"> + Add Option </button>\n                  </div>\n                </div>\n                <!-- End options -->\n              </div>\n              <div class=\"text-start mt-3\">\n                <button type=\"button\" class=\"btn btn-primary\" (click)=\"addContactUsQuestion()\">+ Add Question</button>\n              </div>\n            </div>\n            <div formArrayName=\"hubspot\" class=\"col-12 mt-4\">\n              <h5 class=\"mb-4\">Hubspot Embeds</h5>\n              <div *ngFor=\"let hub of contactUsHubspotItems.controls; let i = index\" [formGroupName]=\"i\" class=\"row border p-3 mb-2\">\n                <pw-input-container label=\"ID\" class=\"col-md-4\">\n                  <input type=\"text\" class=\"form-control\" formControlName=\"id\" />\n                </pw-input-container>\n\n                <pw-input-container label=\"Position\" class=\"col-md-4\">\n                  <input type=\"text\" class=\"form-control\" formControlName=\"position\" />\n                </pw-input-container>\n\n                <pw-input-container label=\"Div\" class=\"col-md-3\">\n                  <input type=\"text\" class=\"form-control\" formControlName=\"div\" />\n                </pw-input-container>\n\n                <div class=\"col-md-1 d-flex align-items-center mt-3\">\n                  <i\n                    class=\"fa fa-trash delete-icon\"\n                    (click)=\"removeHubspotItem(i)\"\n                    (keydown.enter)=\"removeHubspotItem(i)\"\n                    (keydown.space)=\"removeHubspotItem(i)\"\n                    ngbTooltip=\"Remove Hubspot Embed\"\n                    aria-hidden=\"true\">\n                  </i>\n                </div>\n              </div>\n\n              <div class=\"text-start mt-2\">\n                <button type=\"button\" class=\"btn btn-primary btn-sm\" (click)=\"addHubspotItem()\">+ Add Hubspot Embed</button>\n              </div>\n            </div>\n\n          </div>\n        </p-accordionTab>\n\n        <p-accordionTab [header]=\"'Book a Demo Section'\">\n          <div class=\"row mt-4\">\n            <div class=\"col-12\">\n              <h4 class=\"mb-3\">{{ 'Admin.DomainConfig.BookDemoLinks' | transloco }}</h4>\n              <div formGroupName=\"book_demo\">\n                <pw-input-container label=\"Title\">\n                  <input type=\"text\" formControlName=\"title\" class=\"form-control\" />\n                </pw-input-container>\n\n                <pw-input-container label=\"Description\">\n                  <input type=\"text\" formControlName=\"description\" class=\"form-control\" />\n                </pw-input-container>\n\n                <div formArrayName=\"items\">\n                  <div *ngFor=\"let link of f['book_demo'].get('items')['controls']; let i = index\" [formGroupName]=\"i\" class=\"row mb-3\">\n                    <div class=\"col-sm-5\">\n                      <pw-input-container label=\"Link Title\">\n                        <input type=\"text\" class=\"form-control\" formControlName=\"title\" />\n                      </pw-input-container>\n                    </div>\n                    <div class=\"col-sm-5\">\n                      <pw-input-container label=\"Link URL\">\n                        <input type=\"text\" class=\"form-control\" formControlName=\"url\" />\n                      </pw-input-container>\n                    </div>\n                    <div class=\"col-sm-2 d-flex align-items-center mt-3\">\n                      <i\n                      ngbTooltip=\"Remove\"\n                      (click)=\"removeBookDemoLink(i)\"\n                                          (keydown.enter)=\"removeBookDemoLink(i)\"\n                                          (keydown.space)=\"removeBookDemoLink(i)\"\n                                          class=\"fa fa-trash delete-icon\"\n                                          aria-hidden=\"true\"\n                                      ></i>\n                    </div>\n                  </div>\n                  <button type=\"button\" class=\"btn btn-primary mt-2 mb-2\" (click)=\"addBookDemoLink()\">+ Add Book Demo Link</button>\n                </div>\n              </div>\n            </div>\n          </div>\n        </p-accordionTab>\n\n\n        <p-accordionTab [header]=\"'Navbar Section'\">\n          <div class=\"row mt-3 mb-4\" formGroupName=\"navbar\">\n            <h4 class=\"mb-3\">Navbar Section</h4>\n\n            <div formArrayName=\"items\" class=\"col-12\">\n              <div *ngFor=\"let item of navbarItems.controls; let i = index\" [formGroupName]=\"i\" class=\"row mb-3\">\n\n                <pw-input-container label=\"Title\" class=\"col-md-6\">\n                  <input type=\"text\" class=\"form-control\" formControlName=\"title\" />\n                </pw-input-container>\n\n                <pw-input-container label=\"Path\" class=\"col-md-6\">\n                  <input type=\"text\" class=\"form-control\" formControlName=\"path\" />\n                </pw-input-container>\n\n                <div class=\"col-12\" formArrayName=\"subtitles\">\n                  <div *ngFor=\"let sub of getNavbarSubtitles(i).controls; let j = index\" [formGroupName]=\"j\" class=\"row border p-3 mb-2\">\n                    <div class=\"col-md-5\">\n                      <pw-input-container label=\"Subtitle Title\">\n                        <input type=\"text\" class=\"form-control\" formControlName=\"title\" />\n                      </pw-input-container>\n                    </div>\n                    <div class=\"col-md-5\">\n                      <pw-input-container label=\"Subtitle Path\">\n                        <input type=\"text\" class=\"form-control\" formControlName=\"path\" />\n                      </pw-input-container>\n                    </div>\n                    <div class=\"col-md-2 d-flex align-items-center mt-3\">\n                      <i class=\"fa fa-trash delete-icon\"\n                        (click)=\"removeSubtitle(i, j)\"\n                        (keydown.enter)=\"removeSubtitle(i, j)\"\n                        (keydown.space)=\"removeSubtitle(i, j)\"\n                        ngbTooltip=\"Remove Subtitle\"\n                        aria-hidden=\"true\">\n                      </i>\n                    </div>\n                  </div>\n                  <button type=\"button\" class=\"btn btn-sm btn-primary mt-2\" (click)=\"addSubtitle(i)\">\n                    + Add Subtitle\n                  </button>\n                </div>\n\n                <div class=\"col-md-12 text-end mt-2\">\n                  <i class=\"fa fa-trash delete-icon\"\n                    (click)=\"removeNavbarItem(i)\"\n                    (keydown.enter)=\"removeNavbarItem(i)\"\n                    (keydown.space)=\"removeNavbarItem(i)\"\n                    ngbTooltip=\"Remove Navbar Item\"\n                    aria-hidden=\"true\">\n                  </i>\n                </div>\n              </div>\n\n              <button type=\"button\" class=\"btn btn-primary mt-2 mb-2\" (click)=\"addNavbarItem()\">+ Add Navbar Item</button>\n            </div>\n          </div>\n        </p-accordionTab>\n\n\n        <p-accordionTab [header]=\"'Footer Links Section'\">\n          <div class=\"row mt-3 mb-4\" formGroupName=\"footer_links\">\n            <h4 class=\"mb-3\">Footer Links Section</h4>\n\n            <div formArrayName=\"items\" class=\"col-12\">\n              <div *ngFor=\"let item of footerLinksItems.controls; let i = index\" [formGroupName]=\"i\" class=\"row mb-3\">\n\n                <pw-input-container label=\"Title\" class=\"col-md-6\">\n                  <input type=\"text\" class=\"form-control\" formControlName=\"title\" />\n                </pw-input-container>\n\n                <pw-input-container label=\"Path\" class=\"col-md-6\">\n                  <input type=\"text\" class=\"form-control\" formControlName=\"path\" />\n                </pw-input-container>\n\n                <div class=\"col-12\" formArrayName=\"subtitles\">\n                  <div *ngFor=\"let sub of getFooterSubtitles(i).controls; let j = index\" [formGroupName]=\"j\" class=\"row border p-3 mb-2\">\n                    <div class=\"col-md-5\">\n                      <pw-input-container label=\"Subtitle Title\">\n                        <input type=\"text\" class=\"form-control\" formControlName=\"title\" />\n                      </pw-input-container>\n                    </div>\n                    <div class=\"col-md-5\">\n                      <pw-input-container label=\"Subtitle Path\">\n                        <input type=\"text\" class=\"form-control\" formControlName=\"path\" />\n                      </pw-input-container>\n                    </div>\n                    <div class=\"col-md-2 d-flex align-items-center mt-3\">\n                      <i class=\"fa fa-trash delete-icon\"\n                        (click)=\"removeFooterSubtitle(i, j)\"\n                        (keydown.enter)=\"removeFooterSubtitle(i, j)\"\n                        (keydown.space)=\"removeFooterSubtitle(i, j)\"\n                        ngbTooltip=\"Remove Subtitle\"\n                        aria-hidden=\"true\">\n                      </i>\n                    </div>\n                  </div>\n                  <button type=\"button\" class=\"btn btn-sm btn-primary mt-2\" (click)=\"addFooterSubtitle(i)\">\n                    + Add Subtitle\n                  </button>\n                </div>\n\n                <div class=\"col-md-12 text-end mt-2\">\n                  <i class=\"fa fa-trash delete-icon\"\n                    (click)=\"removeFooterLinkItem(i)\"\n                    (keydown.enter)=\"removeFooterLinkItem(i)\"\n                    (keydown.space)=\"removeFooterLinkItem(i)\"\n                    ngbTooltip=\"Remove Footer Item\"\n                    aria-hidden=\"true\">\n                  </i>\n                </div>\n              </div>\n\n              <button type=\"button\" class=\"btn btn-primary mt-2 mb-2\" (click)=\"addFooterLinkItem()\">+ Add Footer Link</button>\n            </div>\n          </div>\n        </p-accordionTab>\n\n\n\n        <p-accordionTab [header]=\"'Guides Section'\">\n          <div class=\"row mt-3 mb-4\" formGroupName=\"guides\">\n            <h4 class=\"mb-3\">Guides Section</h4>\n\n            <div formArrayName=\"items\" class=\"col-12\">\n              <div *ngFor=\"let item of guidesItems.controls; let i = index\" [formGroupName]=\"i\" class=\"row border p-3 mb-3\">\n                <pw-input-container label=\"Title\" class=\"col-md-6\">\n                  <input type=\"text\" class=\"form-control\" formControlName=\"title\" />\n                </pw-input-container>\n\n                <pw-input-container label=\"Description\" class=\"col-md-6\">\n                  <input type=\"text\" class=\"form-control\" formControlName=\"description\" />\n                </pw-input-container>\n\n                <pw-input-container label=\"Button Text\" class=\"col-md-6\">\n                  <input type=\"text\" class=\"form-control\" formControlName=\"button_text\" />\n                </pw-input-container>\n\n                <pw-input-container label=\"Image URL\" class=\"col-md-6\">\n                  <input type=\"text\" class=\"form-control\" formControlName=\"image_url\" />\n                </pw-input-container>\n\n                <pw-input-container label=\"Guide URL\" class=\"col-md-6\">\n                  <input type=\"text\" class=\"form-control\" formControlName=\"guide_url\" />\n                </pw-input-container>\n\n                <div class=\"col-md-1 d-flex align-items-center mt-3\">\n                  <i\n                    class=\"fa fa-trash delete-icon\"\n                    (click)=\"removeGuideItem(i)\"\n                    (keydown.enter)=\"removeGuideItem(i)\"\n                    (keydown.space)=\"removeGuideItem(i)\"\n                    ngbTooltip=\"Remove Guide\"\n                    aria-hidden=\"true\"\n                  ></i>\n                </div>\n              </div>\n\n              <div class=\"text-start mt-2\">\n                <button type=\"button\" class=\"btn btn-primary\" (click)=\"addGuideItem()\">+ Add Guide</button>\n              </div>\n            </div>\n          </div>\n        </p-accordionTab>\n\n\n\n\n        <p-accordionTab [header]=\"'Coming soon pages - Subscribe to newsletter (TO DISCONTINUE)'\">\n          <div class=\"mb-3\">\n            <p>ComingSoon Pages will enable users to subscribe to Newsletters and are accessible at the internal paths\n              /join/cs1, /join/cs2, etc.</p>\n          </div>\n          <!-- live page link -->\n          <div class=\"text-end\" *ngIf=\"shardUrl\">\n            <span>See the live page <span class=\"tooltip-wrap ms-1\" [appendTo]=\"'body'\"\n                [pTooltip]=\"'Admin.DomainConfig.Tooltip.SeeLiveCs' | transloco\" tooltipPosition=\"top\">\n                <i class=\"fas fa-info-circle\"></i>\n              </span> : <a [href]=\"shardUrl + '/join/cs1'\" target=\"_blank\">{{ shardUrl }}/join/cs1</a></span>\n          </div>\n          <div class=\"row\">\n            <div class=\"col-12 col-sm-3\">\n              <pw-input-container [label]=\"'Admin.DomainConfig.CsProduct' | transloco\" [showTooltip]=\"true\"\n                [tooltipText]=\"'Admin.DomainConfig.Tooltip.CsProduct' | transloco\" name=\"cs_product_id\">\n                <p-autoComplete [suggestions]=\"productsList\" formControlName=\"cs_product_id\" dataKey=\"id\" field=\"name\"\n                  [dropdown]=\"true\" [delay]=\"1000\" (completeMethod)=\"searchProduct($event)\" styleClass=\"w-100\"\n                  placeholder=\"Search Product\" [inputStyle]=\"\n                                                form.get('cs_product_id').touched &&\n                                                form.get('cs_product_id').invalid\n                                                    ? { border: '1px solid #ff586b' }\n                                                    : { border: '1px solid gray' }\n                                            \" [multiple]=\"false\">\n                </p-autoComplete>\n              </pw-input-container>\n            </div>\n            <div class=\"col-12 col-sm-3\">\n              <pw-input-container [label]=\"'Admin.DomainConfig.CsCrmSourceId' | transloco\" name=\"cs_crm_source_id\"\n                [showTooltip]=\"true\" [tooltipText]=\"'Admin.DomainConfig.Tooltip.CsCrmSourceId' | transloco\">\n                <p-dropdown [options]=\"crmSourcesList\" formControlName=\"cs_crm_source_id\"\n                  [ngClass]=\"{ 'is-invalid': submitted && f['cs_crm_source_id']?.errors }\" [placeholder]=\"'Select CRM Source'\"\n                  optionValue=\"id\" optionLabel=\"name\">\n                </p-dropdown>\n              </pw-input-container>\n            </div>\n            <div class=\"col-12 col-sm-3\">\n              <pw-input-container [label]=\"'Admin.DomainConfig.CsPdfSourceId' | transloco\" name=\"cs_pdf_source_id\"\n                [showTooltip]=\"true\" [tooltipText]=\"'Admin.DomainConfig.Tooltip.CsPdfSourceId' | transloco\">\n                <p-dropdown [options]=\"crmSourcesList\" formControlName=\"cs_pdf_source_id\"\n                  [ngClass]=\"{ 'is-invalid': submitted && f['cs_pdf_source_id']?.errors }\" [placeholder]=\"'Select CRM Source'\"\n                  optionValue=\"id\" optionLabel=\"name\">\n                </p-dropdown>\n              </pw-input-container>\n            </div>\n            <div class=\"col-12 col-sm-3\"></div>\n            <div class=\"col-12 col-sm-3\">\n              <pw-input-container [label]=\"'Admin.DomainConfig.CsVideoUrl' | transloco\" name=\"cs_video_url\" [showTooltip]=\"true\"\n                [tooltipText]=\"'Admin.DomainConfig.Tooltip.CsVideoUrl' | transloco\">\n                <input type=\"text\" class=\"form-control\" formControlName=\"cs_video_url\"\n                  [ngClass]=\"{ 'is-invalid': submitted && f['cs_video_url'].errors }\" />\n              </pw-input-container>\n            </div>\n            <div class=\"col-12 col-sm-3\">\n              <pw-input-container [label]=\"'Admin.DomainConfig.CsBookDemoUrl' | transloco\" name=\"cs_book_demo_url\"\n                [showTooltip]=\"true\" [tooltipText]=\"'Admin.DomainConfig.Tooltip.CsBookDemoUrl' | transloco\">\n                <input type=\"text\" class=\"form-control\" formControlName=\"cs_book_demo_url\"\n                  [ngClass]=\"{ 'is-invalid': submitted && f['cs_book_demo_url'].errors }\" />\n              </pw-input-container>\n            </div>\n            <div class=\"col-12\">\n              <pw-input-container [label]=\"'Admin.DomainConfig.CsCtaIframe' | transloco\" name=\"cs_cta_iframe\"\n                [showTooltip]=\"true\" [tooltipText]=\"'Admin.DomainConfig.Tooltip.CsCtaIframe' | transloco\">\n                <textarea class=\"form-control\" rows=\"3\" formControlName=\"cs_cta_iframe\"\n                  [ngClass]=\"{ 'is-invalid': submitted && f['cs_cta_iframe'].errors }\">\n                                        </textarea>\n              </pw-input-container>\n            </div>\n            <div class=\"col-12\">\n              <pw-input-container [label]=\"'Admin.DomainConfig.CsJoinMessage' | transloco\" name=\"cs_join_message\"\n                [showTooltip]=\"true\" [tooltipText]=\"'Admin.DomainConfig.Tooltip.CsJoinMessage' | transloco\">\n                <textarea class=\"form-control\" rows=\"3\" formControlName=\"cs_join_message\"\n                  [ngClass]=\"{ 'is-invalid': submitted && f['cs_join_message'].errors }\">\n                                        </textarea>\n              </pw-input-container>\n            </div>\n            <div class=\"col-12\">\n              <pw-input-container [label]=\"'Admin.DomainConfig.CsPdfDownloadText' | transloco\" name=\"cs_pdf_download_text\"\n                [showTooltip]=\"true\" [tooltipText]=\"\n                                            'Admin.DomainConfig.Tooltip.CsPdfDownloadText' | transloco\n                                        \">\n                <textarea class=\"form-control\" rows=\"3\" formControlName=\"cs_pdf_download_text\" [ngClass]=\"{\n                                                'is-invalid': submitted && f['cs_pdf_download_text'].errors\n                                            }\">\n                                        </textarea>\n              </pw-input-container>\n            </div>\n          </div>\n          <div class=\"row\" matchHeight=\"card\">\n            <div class=\"col-md-4\">\n              <label for=\"cs_image\">{{ 'Admin.DomainConfig.CsImage' | transloco }} <span class=\"info-circle\">\n                  <span class=\"tooltiptext gradient-custom-branding\">{{ 'Admin.DomainConfig.Tooltip.CsImage' | transloco\n                    }}</span>\n                </span>\n              </label>\n              <pw-custom-uploader (saveEvent)=\"onSaveFile($event)\" [aspectRatio]=\"'custom'\" [title]=\"'Cs Image'\"\n                [controlName]=\"'cs_image'\" [previewData]=\"data['cs_image']\">\n              </pw-custom-uploader>\n            </div>\n            <div class=\"col-md-4\">\n              <label for=\"cs_image2\">{{ 'Admin.DomainConfig.CsImage2' | transloco }} <span class=\"info-circle\">\n                  <span class=\"tooltiptext gradient-custom-branding\">{{ 'Admin.DomainConfig.Tooltip.CsImage2' | transloco\n                    }}</span>\n                </span>\n              </label>\n              <pw-custom-uploader (saveEvent)=\"onSaveFile($event)\" [aspectRatio]=\"'custom'\" [title]=\"'Cs Image2'\"\n                [controlName]=\"'cs_image2'\" [previewData]=\"data['cs_image2']\">\n              </pw-custom-uploader>\n            </div>\n            <div class=\"col-md-4\">\n              <label for=\"cs_pdf_image\">{{ 'Admin.DomainConfig.CsPdfImage' | transloco }} <span class=\"info-circle\">\n                  <span class=\"tooltiptext gradient-custom-branding\">{{ 'Admin.DomainConfig.Tooltip.CsPdfImage' | transloco\n                    }}</span>\n                </span>\n              </label>\n              <pw-custom-uploader (saveEvent)=\"onSaveFile($event)\" [aspectRatio]=\"'custom'\" [title]=\"'Cs Pdf Image'\"\n                [controlName]=\"'cs_pdf_image'\" [previewData]=\"data['cs_pdf_image']\">\n              </pw-custom-uploader>\n            </div>\n            <div class=\"col-md-4\">\n              <label for=\"cs_image_bg\">{{ 'Admin.DomainConfig.CsImageBg' | transloco }} <span class=\"info-circle\">\n                  <span class=\"tooltiptext gradient-custom-branding\">{{ 'Admin.DomainConfig.Tooltip.CsImageBg' | transloco\n                    }}</span>\n                </span>\n              </label>\n              <pw-custom-uploader (saveEvent)=\"onSaveFile($event)\" [aspectRatio]=\"'custom'\" [title]=\"'Cs Pdf Image Bg'\"\n                [controlName]=\"'cs_image_bg'\" [previewData]=\"data['cs_image_bg']\">\n              </pw-custom-uploader>\n            </div>\n            <div class=\"col-md-4\">\n              <label for=\"cs_image_bg2\">{{ 'Admin.DomainConfig.CsImageBg2' | transloco }} <span class=\"info-circle\">\n                  <span class=\"tooltiptext gradient-custom-branding\">{{ 'Admin.DomainConfig.Tooltip.CsImageBg2' | transloco\n                    }}</span>\n                </span>\n              </label>\n              <pw-custom-uploader (saveEvent)=\"onSaveFile($event)\" [aspectRatio]=\"'custom'\" [title]=\"'Cs Pdf Image Bg2'\"\n                [controlName]=\"'cs_image_bg2'\" [previewData]=\"data['cs_image_bg2']\">\n              </pw-custom-uploader>\n            </div>\n          </div>\n        </p-accordionTab>\n      </p-accordion>\n    </div>\n\n    <div class=\"col-12 text-end mt-3\">\n      <button type=\"button\"\n        class=\"btn btn-outline-default me-2\"\n        (click)=\"back()\">\n        {{ 'Button.Cancel' | transloco }}\n      </button>\n      <button type=\"submit\" [buttonBusy]=\"buttonBusy\"\n        class=\"btn btn-primary\">{{ 'Button.Submit' | transloco }}</button>\n    </div>\n  </form>\n</ng-container>\n<div *ngIf=\"!data?.host_name && !isLoading\">\n  <pw-no-data [withImage]=\"true\" [message]=\"'Admin.DomainConfig.EnableConfigTab' | transloco\"> </pw-no-data>\n</div>\n\n\n<ng-template #partnerCropper let-modal>\n  <div class=\"modal-header\">\n    <h5 class=\"modal-title\">Upload Partner Image</h5>\n    <button type=\"button\" class=\"btn-close\" aria-label=\"Close\" (click)=\"modal.dismiss()\"></button>\n  </div>\n  <div class=\"modal-body\">\n    <small>You can upload JPG, PNG, or GIF files. Avoid images with celebrities, nudity, or artwork.</small>\n    <pw-image-cropper\n      aspectRatio=\"auto\"\n      (imageSelectionEvent)=\"onPartnerImageSelected($event)\"\n      (closeEvent)=\"onClosePartnerModal()\"\n    ></pw-image-cropper>\n  </div>\n</ng-template>\n", dependencies: [{ kind: "directive", type: i3$3.PrimeTemplate, selector: "[pTemplate]", inputs: ["type", "pTemplate"] }, { kind: "directive", type: i4$2.Tooltip, selector: "[pTooltip]", inputs: ["tooltipPosition", "tooltipEvent", "appendTo", "positionStyle", "tooltipStyleClass", "tooltipZIndex", "escape", "showDelay", "hideDelay", "life", "positionTop", "positionLeft", "autoHide", "fitContent", "hideOnEscape", "pTooltip", "tooltipDisabled", "tooltipOptions"] }, { kind: "component", type: i7$1.Accordion, selector: "p-accordion", inputs: ["multiple", "style", "styleClass", "expandIcon", "collapseIcon", "activeIndex", "selectOnFocus", "headerAriaLevel"], outputs: ["onClose", "onOpen", "activeIndexChange"] }, { kind: "component", type: i7$1.AccordionTab, selector: "p-accordionTab", inputs: ["id", "header", "headerStyle", "tabStyle", "contentStyle", "tabStyleClass", "headerStyleClass", "contentStyleClass", "disabled", "cache", "transitionOptions", "iconPos", "selected", "headerAriaLevel"], outputs: ["selectedChange"] }, { kind: "component", type: i4$3.AutoComplete, selector: "p-autoComplete", inputs: ["minLength", "delay", "style", "panelStyle", "styleClass", "panelStyleClass", "inputStyle", "inputId", "inputStyleClass", "placeholder", "readonly", "disabled", "scrollHeight", "lazy", "virtualScroll", "virtualScrollItemSize", "virtualScrollOptions", "maxlength", "name", "required", "size", "appendTo", "autoHighlight", "forceSelection", "type", "autoZIndex", "baseZIndex", "ariaLabel", "dropdownAriaLabel", "ariaLabelledBy", "dropdownIcon", "unique", "group", "completeOnFocus", "showClear", "field", "dropdown", "showEmptyMessage", "dropdownMode", "multiple", "tabindex", "dataKey", "emptyMessage", "showTransitionOptions", "hideTransitionOptions", "autofocus", "autocomplete", "optionGroupChildren", "optionGroupLabel", "overlayOptions", "suggestions", "itemSize", "optionLabel", "optionValue", "id", "searchMessage", "emptySelectionMessage", "selectionMessage", "autoOptionFocus", "selectOnFocus", "searchLocale", "optionDisabled", "focusOnHover", "variant"], outputs: ["completeMethod", "onSelect", "onUnselect", "onFocus", "onBlur", "onDropdownClick", "onClear", "onKeyUp", "onShow", "onHide", "onLazyLoad"] }, { kind: "component", type: i3.Dropdown, selector: "p-dropdown", inputs: ["id", "scrollHeight", "filter", "name", "style", "panelStyle", "styleClass", "panelStyleClass", "readonly", "required", "editable", "appendTo", "tabindex", "placeholder", "loadingIcon", "filterPlaceholder", "filterLocale", "variant", "inputId", "dataKey", "filterBy", "filterFields", "autofocus", "resetFilterOnHide", "checkmark", "dropdownIcon", "loading", "optionLabel", "optionValue", "optionDisabled", "optionGroupLabel", "optionGroupChildren", "autoDisplayFirst", "group", "showClear", "emptyFilterMessage", "emptyMessage", "lazy", "virtualScroll", "virtualScrollItemSize", "virtualScrollOptions", "overlayOptions", "ariaFilterLabel", "ariaLabel", "ariaLabelledBy", "filterMatchMode", "maxlength", "tooltip", "tooltipPosition", "tooltipPositionStyle", "tooltipStyleClass", "focusOnHover", "selectOnFocus", "autoOptionFocus", "autofocusFilter", "disabled", "itemSize", "autoZIndex", "baseZIndex", "showTransitionOptions", "hideTransitionOptions", "filterValue", "options"], outputs: ["onChange", "onFilter", "onFocus", "onBlur", "onClick", "onShow", "onHide", "onClear", "onLazyLoad"] }, { kind: "directive", type: i3$1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i3$1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i3$1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i3$2.ɵNgNoValidate, selector: "form:not([ngNoForm]):not([ngNativeValidate])" }, { kind: "directive", type: i3$2.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: i3$2.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i3$2.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { kind: "component", type: i4.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: i9.CustomUploaderComponent, selector: "pw-custom-uploader", inputs: ["controlName", "previewData", "aspectRatio", "title"], outputs: ["saveEvent"] }, { kind: "component", type: i9.ProfileImageCropperComponent, selector: "pw-image-cropper", inputs: ["aspectRatio", "dynamicData"], outputs: ["imageSelectionEvent", "closeEvent", "fileChangeEvent"] }, { kind: "component", type: i5.ProgressSpinner, selector: "p-progressSpinner", inputs: ["styleClass", "style", "strokeWidth", "fill", "animationDuration", "ariaLabel"] }, { kind: "component", type: i9.InputContainerComponent, selector: "pw-input-container", inputs: ["name", "label", "labelClass", "tooltipPosition", "required", "errorMsg", "isReadOnly", "showTooltip", "tooltipText", "showTriangle", "afterLabel", "showAfterLabel", "showTriangleText", "isLeftTooltip"] }, { kind: "component", type: i9.NoDataComponent, selector: "pw-no-data", inputs: ["message", "description", "withImage"] }, { kind: "directive", type: i10.ButtonBusyDirective, selector: "[buttonBusy]", inputs: ["buttonBusy", "busyText"] }, { kind: "directive", type: i10.RbacAllowDirective, selector: "[rbacAllow]", inputs: ["rbacAllow"] }, { kind: "directive", type: i1$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$2.FormGroupDirective, selector: "[formGroup]", inputs: ["formGroup"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { kind: "directive", type: i3$2.FormControlName, selector: "[formControlName]", inputs: ["formControlName", "disabled", "ngModel"], outputs: ["ngModelChange"] }, { kind: "directive", type: i3$2.FormGroupName, selector: "[formGroupName]", inputs: ["formGroupName"] }, { kind: "directive", type: i3$2.FormArrayName, selector: "[formArrayName]", inputs: ["formArrayName"] }, { kind: "pipe", type: i12.TranslocoPipe, name: "transloco" }] }); }
 }
 __decorate([
     ValidateForm('form'),
@@ -1203,7 +1333,7 @@ __decorate([
 ], DomainConfigBuildComponent.prototype, "onSave", null);
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.11", ngImport: i0, type: DomainConfigBuildComponent, decorators: [{
             type: Component,
-            args: [{ selector: 'pw-domain-config-build', template: "<h3>Public Pages Configuration</h3>\n<div class=\"mb-4\">\n  <p> The following parameters and settings will be applied to all public pages of this domain. </p>\n</div>\n<div class=\"w-100 text-center mt-3\"\n  *ngIf=\"isLoading\">\n  <p-progressSpinner strokeWidth=\"2\"> </p-progressSpinner>\n</div>\n<ng-container *ngIf=\"!isLoading && data?.host_name\">\n  <form [formGroup]=\"form\"\n    (ngSubmit)=\"onSave()\">\n    <div class=\"row\">\n      <div class=\"col-12 col-sm-3\">\n        <pw-input-container [label]=\"'Admin.DomainConfig.MasterSubscription' | transloco\"\n          name=\"master_subscription_id\"\n          [showTooltip]=\"true\"\n          [tooltipText]=\"'Admin.DomainConfig.Tooltip.MasterSubscription' | transloco\">\n          <p-dropdown\n          [options]=\"masterSubscriptionsList\"\n          formControlName=\"master_subscription_id\"\n          [ngClass]=\"{ 'is-invalid': submitted && f['master_subscription_id']?.errors }\"\n          placeholder=\"Select Master Subscription\">\n        </p-dropdown>\n        </pw-input-container>\n      </div>\n      <div class=\"col-12 col-sm-3\">\n        <pw-input-container [label]=\"'Admin.DomainConfig.MasterSubscriptionProduct' | transloco\"\n          [showTooltip]=\"true\"\n          [tooltipText]=\"\n                        'Admin.DomainConfig.Tooltip.MasterSubscriptionProduct' | transloco\n                    \"\n          name=\"master_subscription_product_id\">\n          <p-dropdown\n            [options]=\"masterSubscriptionProductList\"\n            formControlName=\"master_subscription_product_id\"\n            [ngClass]=\"{'is-invalid': submitted && f['master_subscription_product_id']?.errors}\"\n            [placeholder]=\"'Select Master Product'\"\n            optionValue=\"id\"\n            optionLabel=\"name\"\n            >\n          </p-dropdown>\n        </pw-input-container>\n      </div>\n      <div class=\"col-12 col-sm-3\">\n        <pw-input-container [label]=\"'Admin.DomainConfig.BlogFeatureKey' | transloco\"\n          name=\"blog_feature_key\"\n          [showTooltip]=\"true\"\n          [tooltipText]=\"'Admin.DomainConfig.Tooltip.BlogFeatureKey' | transloco\">\n          <input type=\"text\"\n            class=\"form-control\"\n            formControlName=\"blog_feature_key\"\n            [ngClass]=\"{ 'is-invalid': submitted && f['blog_feature_key'].errors }\" />\n        </pw-input-container>\n      </div>\n      <div class=\"col-12 col-sm-3\">\n        <pw-input-container [label]=\"'Admin.DomainConfig.MainTos' | transloco\"\n          name=\"main_tos_id\"\n          [showTooltip]=\"true\"\n          [tooltipText]=\"'Admin.DomainConfig.Tooltip.MainTos' | transloco\">\n          <p-dropdown\n          [options]=\"subscriptionTosList\"\n          formControlName=\"main_tos_id\"\n          [ngClass]=\"{ 'is-invalid': submitted && f['main_tos_id']?.errors }\"\n          [placeholder]=\"'Select Main TOS'\"\n          optionValue=\"id\">\n          <ng-template pTemplate=\"selectedItem\" let-item>\n            <span [innerHTML]=\"item.title\"></span>\n          </ng-template>\n          <ng-template pTemplate=\"item\" let-item>\n            <span [innerHTML]=\"item.title\"></span>\n          </ng-template>\n        </p-dropdown>\n\n        </pw-input-container>\n      </div>\n      <!-- crm subscription fields -->\n      <div class=\"col-12 col-sm-3\">\n        <pw-input-container [label]=\"'Admin.DomainConfig.CrmSubscription' | transloco\"\n          name=\"crm_subscription_id\"\n          [showTooltip]=\"true\"\n          [tooltipText]=\"'Admin.DomainConfig.Tooltip.CrmSubscription' | transloco\">\n          <p-dropdown\n            [options]=\"crmSubscriptionsList\"\n            formControlName=\"crm_subscription_id\"\n            [ngClass]=\"{ 'is-invalid': submitted && f['crm_subscription_id']?.errors }\"\n            [placeholder]=\"'Select CRM Subscription'\"\n            optionValue=\"id\">\n            <ng-template pTemplate=\"selectedItem\" let-item>\n              {{item?.organisation ? item?.organisation + ' - ' + item.contact_name : item?.contact_name}}\n            </ng-template>\n            <ng-template pTemplate=\"item\" let-item>\n              {{item?.organisation ? item?.organisation + ' - ' + item.contact_name : item?.contact_name}}\n            </ng-template>\n          </p-dropdown>\n\n        </pw-input-container>\n      </div>\n      <div class=\"col-12 col-sm-3\">\n        <pw-input-container [label]=\"'Admin.DomainConfig.CrmProduct' | transloco\"\n          name=\"crm_product_id\"\n          [showTooltip]=\"true\"\n          [tooltipText]=\"'Admin.DomainConfig.Tooltip.CrmProduct' | transloco\">\n          <p-dropdown\n            [options]=\"crmProductList\"\n            formControlName=\"crm_product_id\"\n            [ngClass]=\"{ 'is-invalid': submitted && f['crm_product_id']?.errors }\"\n            [placeholder]=\"'Select CRM Product'\"\n            optionValue=\"id\"\n            >\n            <ng-template pTemplate=\"selectedItem\" let-item>\n              {{item?.subscription_id ? item?.name  +' - SubscriptionID = '+ item.subscription_id : item?.name}}\n            </ng-template>\n            <ng-template pTemplate=\"item\" let-item>\n              {{item?.subscription_id ? item?.name  +' - SubscriptionID = '+ item.subscription_id : item?.name}}\n            </ng-template>\n          </p-dropdown>\n        </pw-input-container>\n      </div>\n      <div class=\"col-12 col-sm-3\">\n        <pw-input-container [label]=\"'Admin.DomainConfig.CrmSource' | transloco\"\n          name=\"crm_source_id\"\n          [showTooltip]=\"true\"\n          [tooltipText]=\"'Admin.DomainConfig.Tooltip.CrmSource' | transloco\">\n          <p-dropdown\n            [options]=\"crmSourcesList\"\n            formControlName=\"crm_source_id\"\n            [ngClass]=\"{ 'is-invalid': submitted && f['crm_source_id']?.errors }\"\n            [placeholder]=\"'Select CRM Source'\"\n            optionValue=\"id\"\n            optionLabel=\"name\"\n            >\n          </p-dropdown>\n        </pw-input-container>\n      </div>\n      <!-- crm subscription fields end-->\n      <div class=\"col-12 col-sm-3\">\n        <pw-input-container [label]=\"'Admin.DomainConfig.Active' | transloco\" [showTooltip]=\"true\"\n          [tooltipText]=\"'Admin.DomainConfig.Tooltip.Active' | transloco\" name=\"active\">\n          <ui-switch size=\"small\" uncheckedLabel=\"false\" checkedLabel=\"true\" formControlName=\"active\" name=\"active\"\n            [ngClass]=\"{ 'is-invalid': submitted && f['active'].errors }\">\n          </ui-switch>\n        </pw-input-container>\n      </div>\n      <div class=\"col-12 col-sm-3\">\n        <pw-input-container [label]=\"'Admin.DomainConfig.IsProductDomain' | transloco\"\n          [showTooltip]=\"true\"\n          [tooltipText]=\"'Admin.DomainConfig.Tooltip.IsProductDomain' | transloco\"\n          name=\"is_product_domain\">\n          <ui-switch size=\"small\"\n            uncheckedLabel=\"false\"\n            checkedLabel=\"true\"\n            formControlName=\"is_product_domain\"\n            name=\"is_product_domain\"\n            [ngClass]=\"{ 'is-invalid': submitted && f['is_product_domain'].errors }\">\n          </ui-switch>\n        </pw-input-container>\n      </div>\n      <div class=\"col-12 col-sm-3\">\n        <pw-input-container [label]=\"'Admin.DomainConfig.CanRegisterOnMainPage' | transloco\" [showTooltip]=\"true\"\n          [tooltipText]=\"'Admin.DomainConfig.Tooltip.CanRegisterOnMainPage' | transloco\"\n          name=\"can_register_through_main_page\">\n          <ui-switch size=\"small\" uncheckedLabel=\"false\" checkedLabel=\"true\" formControlName=\"can_register_through_main_page\"\n            name=\"can_register_through_main_page\" [ngClass]=\"{\n                                  'is-invalid': submitted && f['can_register_through_main_page'].errors\n                              }\">\n          </ui-switch>\n        </pw-input-container>\n      </div>\n      <div class=\"col-12 col-sm-3\">\n        <pw-input-container [label]=\"'Admin.DomainConfig.SocialLoginEnabled' | transloco\" [showTooltip]=\"true\"\n          [tooltipText]=\"'Admin.DomainConfig.Tooltip.SocialLoginEnable' | transloco\" name=\"social_login_enabled\">\n          <ui-switch size=\"small\" uncheckedLabel=\"false\" checkedLabel=\"true\" formControlName=\"social_login_enabled\"\n            name=\"social_login_enabled\" [ngClass]=\"{ 'is-invalid': submitted && f['social_login_enabled'].errors }\">\n          </ui-switch>\n        </pw-input-container>\n      </div>\n      <div class=\"col-12 col-sm-3\">\n        <pw-input-container [label]=\"'Admin.DomainConfig.NotifyLogins' | transloco\" [showTooltip]=\"true\"\n          [tooltipText]=\"'Admin.DomainConfig.Tooltip.NotifyLogins' | transloco\" name=\"notify_logins\">\n          <ui-switch size=\"small\" uncheckedLabel=\"false\" checkedLabel=\"true\" formControlName=\"notify_logins\"\n            name=\"notify_logins\" [ngClass]=\"{ 'is-invalid': submitted && f['notify_logins'].errors }\">\n          </ui-switch>\n        </pw-input-container>\n      </div>\n    </div>\n\n    <div class=\"my-5\" *rbacAllow=\"'Pages.SuperAdmin'\">\n      <h3>Pre-Built Landing Pages for User Onboarding</h3>\n\n      <p-accordion class=\"mt-5\">\n        <p-accordionTab [header]=\"'Instructions - README FIRST'\">\n          <div class=\"mb-3\">\n            <p>We\u2019ve built and maintain a collection of high-converting landing pages designed to help you quickly launch polished\n              UIs for onboarding users.</p>\n            <p><strong>Newsletter Subscription Pages:</strong><br> After configuring your domain, you can access pages like\n              <strong>/join/cs1, /join/cs2, /join/cs3, etc.</strong>, specifically designed for newsletter sign-ups. <br>\n              Subscribers from these pages will be listed in the <strong>SmartCRM module</strong>.</p>\n            <p><strong>Trial Product Sign-Up Pages:</strong><br> For users interested in trial products, utilize pages such as\n              <strong>/join/trial1, /join/trial2, /join/trial3, etc.</strong>.<br> Users registering through these pages will\n              appear in the <strong>Admin > Users section</strong>.</p>\n            <p>Once you\u2019ve selected the landing page you want to use <strong>(e.g., /join/trial3)</strong>, make sure to update\n              the <strong>Internal Path</strong> in the <strong>Core tab</strong> accordingly\u2014i.e., set it to\n              <strong>/join/trial3</strong>.</p>\n            <p>If you need assistance integrating these pages into your workflow or have further questions, feel free to reach\n              out.</p>\n          </div>\n        </p-accordionTab>\n\n        <p-accordionTab [header]=\"'Subscribe to Product/Newsletter Config'\">\n          <div class=\"mb-3\">\n            <p>Trial Pages will enable users to sign up to real products and are accessible at the path /join/trial1,\n              /join/trial2, etc.</p>\n            <p>ComingSoon Pages will enable users to subscribe to Newsletters and are accessible at the internal paths\n              /join/cs1, /join/cs2, etc.</p>\n          </div>\n          <!-- live page link -->\n          <div class=\"text-end\" *ngIf=\"shardUrl\">\n            <span>See the live page <span class=\"tooltip-wrap ms-1\" [appendTo]=\"'body'\"\n                [pTooltip]=\"'Admin.DomainConfig.Tooltip.SeeLiveTrial' | transloco\" tooltipPosition=\"top\">\n                <i class=\"fas fa-info-circle\"></i>\n              </span> : <a [href]=\"shardUrl + '/join/trial1'\" target=\"_blank\">{{ shardUrl }}/join/trial1</a></span>\n          </div>\n          <div class=\"row\">\n            <div class=\"col-sm-3\">\n              <pw-input-container [label]=\"'Admin.DomainConfig.TrialProduct' | transloco\" [showTooltip]=\"true\"\n                [tooltipText]=\"'Admin.DomainConfig.Tooltip.TrialProduct' | transloco\" name=\"trial_product_id\">\n                <p-autoComplete [suggestions]=\"productsList\" formControlName=\"trial_product_id\" dataKey=\"id\" field=\"name\"\n                  [dropdown]=\"true\" [delay]=\"1000\" (completeMethod)=\"searchProduct($event)\" styleClass=\"w-100\"\n                  placeholder=\"Search Product\" [inputStyle]=\"\n                                                  form.get('trial_product_id').touched &&\n                                                  form.get('trial_product_id').invalid\n                                                      ? { border: '1px solid #ff586b' }\n                                                      : { border: '1px solid gray' }\n                                              \" [multiple]=\"false\">\n                </p-autoComplete>\n              </pw-input-container>\n            </div>\n            <div class=\"col-12 col-sm-3\">\n              <pw-input-container [label]=\"'Admin.DomainConfig.TrialCrmSourceId' | transloco\" name=\"trial_crm_source_id\"\n                [showTooltip]=\"true\" [tooltipText]=\"\n                                              'Admin.DomainConfig.Tooltip.TrialCrmSourceId' | transloco\n                                          \">\n                <p-dropdown [options]=\"crmSourcesList\" formControlName=\"trial_crm_source_id\"\n                  [ngClass]=\"{ 'is-invalid': submitted && f['trial_crm_source_id']?.errors }\"\n                  [placeholder]=\"'Select CRM Source'\" optionValue=\"id\" optionLabel=\"name\">\n                </p-dropdown>\n              </pw-input-container>\n            </div>\n            <div class=\"col-12 col-sm-3\">\n              <pw-input-container [label]=\"'Admin.DomainConfig.TrialPdfSourceId' | transloco\" name=\"trial_pdf_source_id\"\n                [showTooltip]=\"true\" [tooltipText]=\"\n                                              'Admin.DomainConfig.Tooltip.TrialPdfSourceId' | transloco\n                                          \">\n                <p-dropdown [options]=\"crmSourcesList\" formControlName=\"trial_pdf_source_id\"\n                  [ngClass]=\"{ 'is-invalid': submitted && f['trial_pdf_source_id']?.errors }\"\n                  [placeholder]=\"'Select CRM Source'\" optionValue=\"id\" optionLabel=\"name\">\n                </p-dropdown>\n              </pw-input-container>\n            </div>\n            <div class=\"col-12 col-sm-3\"></div>\n            <div class=\"col-12 col-sm-3\">\n              <pw-input-container [label]=\"'Admin.DomainConfig.TrialVideoUrl' | transloco\" name=\"trial_video_url\"\n                [showTooltip]=\"true\" [tooltipText]=\"'Admin.DomainConfig.Tooltip.TrialVideoUrl' | transloco\">\n                <input type=\"text\" class=\"form-control\" formControlName=\"trial_video_url\"\n                  [ngClass]=\"{ 'is-invalid': submitted && f['trial_video_url'].errors }\" />\n              </pw-input-container>\n            </div>\n            <div class=\"col-12 col-sm-3\">\n              <pw-input-container [label]=\"'Admin.DomainConfig.TrialBookDemoUrl' | transloco\" name=\"trial_book_demo_url\"\n                [showTooltip]=\"true\" [tooltipText]=\"\n                                              'Admin.DomainConfig.Tooltip.TrialBookDemoUrl' | transloco\n                                          \">\n                <input type=\"text\" class=\"form-control\" formControlName=\"trial_book_demo_url\" [ngClass]=\"{\n                                                  'is-invalid': submitted && f['trial_book_demo_url'].errors\n                                              }\" />\n              </pw-input-container>\n            </div>\n            <div class=\"col-12\">\n              <pw-input-container [label]=\"'Admin.DomainConfig.TrialCtaIframe' | transloco\" name=\"trial_cta_iframe\"\n                [showTooltip]=\"true\" [tooltipText]=\"\n                                              'Admin.DomainConfig.Tooltip.TrialCtaIframe' | transloco\n                                          \">\n                <textarea rows=\"3\" class=\"form-control\" formControlName=\"trial_cta_iframe\" [ngClass]=\"{\n                                                  'is-invalid': submitted && f['trial_cta_iframe'].errors\n                                              }\">\n                                          </textarea>\n              </pw-input-container>\n            </div>\n            <div class=\"col-12\">\n              <pw-input-container [label]=\"'Admin.DomainConfig.TrialJoinMessage' | transloco\" name=\"trial_join_message\"\n                [showTooltip]=\"true\" [tooltipText]=\"\n                                              'Admin.DomainConfig.Tooltip.TrialJoinMessage' | transloco\n                                          \">\n                <textarea rows=\"3\" class=\"form-control\" formControlName=\"trial_join_message\" [ngClass]=\"{\n                                                  'is-invalid': submitted && f['trial_join_message'].errors\n                                              }\">\n                                          </textarea>\n              </pw-input-container>\n            </div>\n            <div class=\"col-12\">\n              <pw-input-container [label]=\"'Admin.DomainConfig.TrialPdfDownloadText' | transloco\" name=\"trial_pdf_download_text\"\n                [showTooltip]=\"true\" [tooltipText]=\"\n                                              'Admin.DomainConfig.Tooltip.TrialPdfDownloadText' | transloco\n                                          \">\n                <textarea rows=\"3\" class=\"form-control\" formControlName=\"trial_pdf_download_text\" [ngClass]=\"{\n                                                  'is-invalid': submitted && f['trial_pdf_download_text'].errors\n                                              }\">\n                                          </textarea>\n              </pw-input-container>\n            </div>\n          </div>\n          <div class=\"row\" matchHeight=\"card\">\n            <div class=\"col-md-4\">\n              <label for=\"trial_image\">{{ 'Admin.DomainConfig.TrialImage' | transloco }} <span class=\"info-circle\">\n                  <span class=\"tooltiptext gradient-custom-branding\">{{ 'Admin.DomainConfig.Tooltip.TrialImage' | transloco\n                    }}</span>\n                </span>\n              </label>\n              <pw-custom-uploader (saveEvent)=\"onSaveFile($event)\" [aspectRatio]=\"'custom'\" [title]=\"'Trial Image'\"\n                [controlName]=\"'trial_image'\" [previewData]=\"data['trial_image']\">\n              </pw-custom-uploader>\n            </div>\n            <div class=\"col-md-4\">\n              <label for=\"trial_image2\">{{ 'Admin.DomainConfig.TrialImage2' | transloco }} <span class=\"info-circle\">\n                  <span class=\"tooltiptext gradient-custom-branding\">{{ 'Admin.DomainConfig.Tooltip.TrialImage2' | transloco\n                    }}</span>\n                </span>\n              </label>\n              <pw-custom-uploader (saveEvent)=\"onSaveFile($event)\" [title]=\"'Trial Image2'\" [aspectRatio]=\"'custom'\"\n                [controlName]=\"'trial_image2'\" [previewData]=\"data['trial_image2']\">\n              </pw-custom-uploader>\n            </div>\n            <div class=\"col-md-4\">\n              <label for=\"trial_pdf_image\">{{ 'Admin.DomainConfig.TrialPdfImage' | transloco }} <span class=\"info-circle\">\n                  <span class=\"tooltiptext gradient-custom-branding\">{{ 'Admin.DomainConfig.Tooltip.TrialPdfImage' | transloco\n                    }}</span>\n                </span>\n              </label>\n              <pw-custom-uploader (saveEvent)=\"onSaveFile($event)\" [title]=\"'Trial Pdf Image'\" [aspectRatio]=\"'custom'\"\n                [controlName]=\"'trial_pdf_image'\" [previewData]=\"data['trial_pdf_image']\">\n              </pw-custom-uploader>\n            </div>\n            <div class=\"col-md-4\">\n              <label for=\"trial_image_bg\">{{ 'Admin.DomainConfig.TrialImageBg' | transloco }} <span class=\"info-circle\">\n                  <span class=\"tooltiptext gradient-custom-branding\">{{ 'Admin.DomainConfig.Tooltip.TrialImageBg' | transloco\n                    }}</span>\n                </span>\n              </label>\n              <pw-custom-uploader (saveEvent)=\"onSaveFile($event)\" [title]=\"'Trial Image Bg'\" [aspectRatio]=\"'custom'\"\n                [controlName]=\"'trial_image_bg'\" [previewData]=\"data['trial_image_bg']\">\n              </pw-custom-uploader>\n            </div>\n            <div class=\"col-md-4\">\n              <label for=\"trial_image_bg2\">{{ 'Admin.DomainConfig.TrialImageBg2' | transloco }} <span class=\"info-circle\">\n                  <span class=\"tooltiptext gradient-custom-branding\">{{ 'Admin.DomainConfig.Tooltip.TrialImageBg2' | transloco\n                    }}</span>\n                </span>\n              </label>\n              <pw-custom-uploader (saveEvent)=\"onSaveFile($event)\" [title]=\"'Trial Image Bg2'\" [aspectRatio]=\"'custom'\"\n                [controlName]=\"'trial_image_bg2'\" [previewData]=\"data['trial_image_bg2']\">\n              </pw-custom-uploader>\n            </div>\n          </div>\n        </p-accordionTab>\n\n        <p-accordionTab [header]=\"'Header Section'\">\n          <div class=\"row mt-4\" formGroupName=\"header\">\n            <h4 class=\"mb-4\">Header Section</h4>\n            <div class=\"col-12 col-md-12\">\n              <pw-input-container label=\"Header Headline\" name=\"headline\">\n                <input type=\"text\" class=\"form-control\" formControlName=\"headline\" />\n              </pw-input-container>\n            </div>\n            <div class=\"col-12 col-md-6\">\n              <pw-input-container label=\"Header Video URL\" name=\"video_url\">\n                <input type=\"text\" class=\"form-control\" formControlName=\"video_url\" />\n              </pw-input-container>\n            </div>\n            <div class=\"col-12 col-md-6\">\n              <pw-input-container label=\"Header Background Image URL\" name=\"bg_image_url\">\n                <input type=\"text\" class=\"form-control\" formControlName=\"bg_image_url\" />\n              </pw-input-container>\n            </div>\n            <div class=\"col-12\">\n              <pw-input-container label=\"Header Description\">\n                <textarea class=\"form-control\" rows=\"5\" formControlName=\"description\"\n                  [ngClass]=\"{ 'is-invalid': submitted && f['description']?.errors }\">\n                                                </textarea>\n              </pw-input-container>\n            </div>\n            <div formArrayName=\"sub_headings\" class=\"col-12\">\n              <div *ngFor=\"let sub of f['header'].get('sub_headings')['controls']; let i = index\" [formGroupName]=\"i\"\n                class=\"row mb-3\">\n                <div class=\"col-md-10\" *ngIf=\"f['header'].get('sub_headings')['controls'].length\">\n                  <pw-input-container label=\"Sub Header Description\">\n                    <textarea class=\"form-control\" rows=\"3\" formControlName=\"description\"\n                      [ngClass]=\"{ 'is-invalid': submitted && f['description']?.errors }\">\n                                                    </textarea>\n                  </pw-input-container>\n                </div>\n                <div class=\"col-md-2 d-flex align-items-center mt-3\">\n                  <i class=\"fa fa-trash delete-icon\" (click)=\"removeHeaderSubHeading(i)\"\n                    (keydown.enter)=\"removeHeaderSubHeading(i)\" (keydown.space)=\"removeHeaderSubHeading(i)\" ngbTooltip=\"Remove\"\n                    aria-hidden=\"true\"></i>\n                </div>\n              </div>\n              <button type=\"button\" class=\"btn btn-primary mt-2 mb-2\" (click)=\"addHeaderSubHeading()\"> + Add Sub Heading\n              </button>\n            </div>\n          </div>\n        </p-accordionTab>\n\n        <p-accordionTab [header]=\"'Resources Section'\">\n          <div class=\"row row mt-4 mb-4\">\n            <h4 class=\"mb-3\">Resources Section</h4>\n            <div class=\"col-12 col-sm-6\">\n              <pw-input-container [label]=\"'Admin.DomainConfig.ResourceTagline' | transloco\" name=\"resources_tagline\"\n                [showTooltip]=\"true\" [tooltipText]=\"'Admin.DomainConfig.Tooltip.ResourceTagline' | transloco\">\n                <input type=\"text\" class=\"form-control\" formControlName=\"resources_tagline\"\n                  [ngClass]=\"{ 'is-invalid': submitted && f['resources_tagline'].errors }\" />\n              </pw-input-container>\n            </div>\n            <div class=\"col-12\">\n              <pw-input-container [label]=\"'Admin.DomainConfig.ResourceDescription' | transloco\" name=\"resources_description\"\n                [showTooltip]=\"true\" [tooltipText]=\"'Admin.DomainConfig.Tooltip.ResourceDescription' | transloco\">\n                <textarea class=\"form-control\" rows=\"3\" formControlName=\"resources_description\"\n                  [ngClass]=\"{ 'is-invalid': submitted && f['resources_description'].errors }\">\n                                          </textarea>\n              </pw-input-container>\n            </div>\n          </div>\n          <div class=\"row\" matchHeight=\"card\">\n            <div class=\"col-md-4\">\n              <label for=\"resource_image\">{{ 'Admin.DomainConfig.ResourceImage' | transloco }} <span class=\"info-circle\">\n                  <span class=\"tooltiptext gradient-custom-branding\">{{ 'Admin.DomainConfig.Tooltip.ResourceImage' | transloco\n                    }}</span>\n                </span>\n              </label>\n              <pw-custom-uploader (saveEvent)=\"onSaveFile($event)\" [aspectRatio]=\"'custom'\" [title]=\"'Cs Image'\"\n                [controlName]=\"'resources_image'\" [previewData]=\"data['resources_image']\">\n              </pw-custom-uploader>\n            </div>\n          </div>\n        </p-accordionTab>\n\n        <p-accordionTab [header]=\"'Unique Selling Proposition Section (USP) '\">\n          <div class=\"row mt-4 mb-4\" formGroupName=\"usps\">\n            <h4 class=\"mb-4\">Unique Selling Proposition Section (USP)</h4>\n            <div class=\"col-12 col-md-6\">\n              <pw-input-container label=\"USPs Title\" name=\"title\">\n                <input type=\"text\" class=\"form-control\" formControlName=\"title\" />\n              </pw-input-container>\n            </div>\n            <div class=\"col-12 col-md-6\">\n              <pw-input-container label=\"USPs Video Url\" name=\"video_url\">\n                <input type=\"text\" class=\"form-control\" formControlName=\"video_url\" />\n              </pw-input-container>\n            </div>\n            <div class=\"col-12\">\n              <pw-input-container label=\"USPs Description\" name=\"description\">\n                <textarea class=\"form-control\" rows=\"3\" formControlName=\"description\"\n                 >\n                                  </textarea>\n              </pw-input-container>\n            </div>\n            <div formArrayName=\"items\" class=\"col-12\">\n              <div\n                *ngFor=\"let item of f['usps'].get('items')['controls']; let i = index\"\n                [formGroupName]=\"i\"\n                class=\"row mb-3\"\n              >\n                <div class=\"col-sm-10\">\n                  <pw-input-container label=\"Item Description\">\n                    <textarea class=\"form-control\" rows=\"3\" formControlName=\"description\"\n                  >\n                                  </textarea>\n                  </pw-input-container>\n                </div>\n                <div class=\"col-sm-2 d-flex align-items-center mt-3\">\n                  <i\n                    class=\"fa fa-trash delete-icon\"\n                    (click)=\"removeUspItem(i)\"\n                    (keydown.enter)=\"removeUspItem(i)\"\n                    (keydown.space)=\"removeUspItem(i)\"\n                    ngbTooltip=\"Remove\"\n                    aria-hidden=\"true\"\n                  ></i>\n                </div>\n              </div>\n              <button type=\"button\" class=\"btn btn-primary mt-2 mb-2\" (click)=\"addUspItem()\">\n                + Add USP Item\n              </button>\n            </div>\n          </div>\n        </p-accordionTab>\n\n        <p-accordionTab [header]=\"'Partners (Clients) Section'\">\n\n          <div class=\"row mt-4 mb-4\" formGroupName=\"partners\">\n            <h4 class=\"mb-4\">Partners (Clients) Section</h4>\n            <!-- Title -->\n            <div class=\"col-12 col-md-6\">\n              <pw-input-container label=\"Partner Title\" name=\"title\">\n                <input type=\"text\" class=\"form-control\" formControlName=\"title\" />\n              </pw-input-container>\n            </div>\n\n            <!-- Description -->\n            <div class=\"col-12\">\n              <pw-input-container label=\"Partners Description\" name=\"description\">\n                <textarea class=\"form-control\" rows=\"3\" formControlName=\"description\"></textarea>\n              </pw-input-container>\n            </div>\n\n            <!-- Partner Items -->\n            <div formArrayName=\"items\" class=\"col-12\">\n              <div *ngFor=\"let item of partnersItems.controls; let i = index\" [formGroupName]=\"i\" class=\"row border p-3 mb-3\">\n                <!-- Name -->\n                <div class=\"col-md-6\">\n                  <pw-input-container label=\"Name\" class=\"col-12 col-md-6\" name=\"name\">\n                    <input class=\"form-control\" formControlName=\"name\"/>\n                  </pw-input-container>\n                </div>\n\n                <!-- Blog URL -->\n                <div class=\"col-md-6\">\n                  <pw-input-container label=\"Blog Url\" class=\"col-12 col-md-6\" name=\"blog_url\">\n                    <input class=\"form-control\" formControlName=\"blog_url\"/>\n                  </pw-input-container>\n                </div>\n\n                <!-- Video URL -->\n                <div class=\"col-md-6\">\n                  <pw-input-container label=\"Video Url\" class=\"col-12 col-md-6\" name=\"video_url\">\n                    <input class=\"form-control\" formControlName=\"video_url\"/>\n                  </pw-input-container>\n                </div>\n                <div class=\"col-md-6\">\n                  <pw-input-container label=\"Image Url\" class=\"col-12 col-md-6\" name=\"ctas_title\">\n                    <input class=\"form-control\" formControlName=\"image_url\"/>\n                  </pw-input-container>\n                </div>\n\n                <!-- Remove Button -->\n                <div class=\"col-md-6 text-start mt-2 align-self-center\">\n                  <i ngbTooltip=\"Remove\" (click)=\"removePartnerItem(i)\" class=\"fa fa-trash delete-icon\" aria-hidden=\"true\"></i>\n                </div>\n              </div>\n\n              <!-- Add New Partner -->\n              <div class=\"text-start mt-2\">\n                <button type=\"button\" class=\"btn btn-primary mt-2 mb-2\" (click)=\"addPartnerItem()\">+ Add Partner</button>\n              </div>\n            </div>\n          </div>\n        </p-accordionTab>\n\n        <p-accordionTab [header]=\"'Testimonials Section'\">\n          <div class=\"row mt-3 mb-4\" formGroupName=\"testimonials\">\n            <h4 class=\"mb-4\">Testimonials Section</h4>\n\n            <pw-input-container label=\"Title\" class=\"col-12 col-md-6\" name=\"testimonials_title\">\n              <input type=\"text\" class=\"form-control\" formControlName=\"title\" />\n            </pw-input-container>\n\n            <pw-input-container label=\"Description\" class=\"col-12\" name=\"testimonials_description\">\n              <textarea rows=\"3\" class=\"form-control\" formControlName=\"description\"></textarea>\n            </pw-input-container>\n\n            <!-- Items List -->\n            <div formArrayName=\"items\" class=\"col-12 mt-3\">\n              <div *ngFor=\"let item of testimonialsItems.controls; let i = index\" [formGroupName]=\"i\" class=\"row border p-3 mb-3\">\n\n                <pw-input-container label=\"Name\" class=\"col-md-6\">\n                  <input type=\"text\" class=\"form-control\" formControlName=\"name\" />\n                </pw-input-container>\n\n                <pw-input-container label=\"Blog URL\" class=\"col-md-6\">\n                  <input type=\"text\" class=\"form-control\" formControlName=\"blog_url\" />\n                </pw-input-container>\n\n                <pw-input-container label=\"Image URL\" class=\"col-md-6\">\n                  <input type=\"text\" class=\"form-control\" formControlName=\"image_url\" />\n                </pw-input-container>\n\n                <pw-input-container label=\"Video URL\" class=\"col-md-6\">\n                  <input type=\"text\" class=\"form-control\" formControlName=\"video_url\" />\n                </pw-input-container>\n\n                <pw-input-container label=\"Testimonial\" class=\"col-md-10\">\n                  <textarea class=\"form-control\" rows=\"3\" formControlName=\"testimonial\"></textarea>\n                </pw-input-container>\n\n                <div class=\"col-md-2 d-flex align-items-center mt-3\">\n                  <i\n                      ngbTooltip=\"Remove\" (click)=\"removeTestimonialItem(i)\"\n                      (keydown.enter)=\"removeTestimonialItem(i)\"\n                      (keydown.space)=\"removeTestimonialItem(i)\" class=\"fa fa-trash delete-icon\"\n                      aria-hidden=\"true\"\n                  ></i>\n                </div>\n              </div>\n\n              <div class=\"text-start mt-2\">\n                <button type=\"button\" class=\"btn btn-primary mt-2 mb-2\" (click)=\"addTestimonialItem()\">+ Add Testimonial</button>\n              </div>\n            </div>\n          </div>\n        </p-accordionTab>\n\n        <p-accordionTab [header]=\"'Video Section'\">\n          <div class=\"row mt-3 mb-4\" formGroupName=\"videos\">\n            <h4 class=\"mb-3\">Video Section</h4>\n\n            <pw-input-container label=\"Title\" class=\"col-12 col-md-6\" name=\"videos_title\">\n              <input type=\"text\" class=\"form-control\" formControlName=\"title\" />\n            </pw-input-container>\n\n            <pw-input-container label=\"Description\" class=\"col-12\" name=\"videos_description\">\n              <textarea rows=\"3\" class=\"form-control\" formControlName=\"description\"></textarea>\n            </pw-input-container>\n\n            <!-- Video Items -->\n            <div formArrayName=\"items\" class=\"col-12 mt-3\">\n              <div *ngFor=\"let item of videosItems.controls; let i = index\" [formGroupName]=\"i\" class=\"row border p-3 mb-3\">\n\n                <pw-input-container label=\"Title\" class=\"col-md-6\">\n                  <input type=\"text\" class=\"form-control\" formControlName=\"title\" />\n                </pw-input-container>\n\n                <pw-input-container label=\"Blog URL\" class=\"col-md-6\">\n                  <input type=\"text\" class=\"form-control\" formControlName=\"blog_url\" />\n                </pw-input-container>\n\n                <pw-input-container label=\"Image URL\" class=\"col-md-6\">\n                  <input type=\"text\" class=\"form-control\" formControlName=\"image_url\" />\n                </pw-input-container>\n\n                <pw-input-container label=\"Video URL\" class=\"col-md-6\">\n                  <input type=\"text\" class=\"form-control\" formControlName=\"video_url\" />\n                </pw-input-container>\n\n                <pw-input-container label=\"Description\" class=\"col-md-10\">\n                  <textarea class=\"form-control\" rows=\"3\" formControlName=\"description\"></textarea>\n                </pw-input-container>\n\n                <div class=\"col-md-2 d-flex align-items-center mt-3\">\n                  <i\n                    class=\"fa fa-trash delete-icon\"\n                    (click)=\"removeVideoItem(i)\"\n                    (keydown.enter)=\"removeVideoItem(i)\"\n                    (keydown.space)=\"removeVideoItem(i)\"\n                    ngbTooltip=\"Remove\"\n                    aria-hidden=\"true\"\n                  ></i>\n                </div>\n              </div>\n\n              <div class=\"text-start mt-2\">\n                <button type=\"button\" class=\"btn btn-primary mt-2 mb-2\" (click)=\"addVideoItem()\">+ Add Video</button>\n              </div>\n            </div>\n          </div>\n        </p-accordionTab>\n\n        <p-accordionTab [header]=\"'Call to Actions Section (CTAs)'\">\n          <div class=\"row mt-4 mb-4\" formGroupName=\"ctas\">\n            <h4 class=\"mb-4\">CTAs Section</h4>\n\n            <div class=\"col-12 col-md-6\">\n              <pw-input-container label=\"Title\" name=\"title\">\n                <input type=\"text\" class=\"form-control\" formControlName=\"title\" />\n              </pw-input-container>\n            </div>\n\n            <div class=\"col-12 col-md-6\">\n              <pw-input-container label=\"Description\" name=\"description\">\n                <input type=\"text\" class=\"form-control\" formControlName=\"description\" />\n              </pw-input-container>\n            </div>\n\n            <div class=\"col-12\">\n              <pw-input-container label=\"Image URL\" name=\"image_url\">\n                <input type=\"text\" class=\"form-control\" formControlName=\"image_url\" />\n              </pw-input-container>\n            </div>\n\n            <!-- CTA Items -->\n            <div formArrayName=\"items\" class=\"col-12 mt-3\">\n              <div *ngFor=\"let item of ctasItems.controls; let i = index\" [formGroupName]=\"i\" class=\"row border p-3 mb-3 ng-untouched ng-pristine ng-valid ng-star-inserted\">\n                <div class=\"col-12 col-md-6\">\n                  <pw-input-container label=\"Image URL\" name=\"image_url\">\n                    <input type=\"text\" class=\"form-control\" formControlName=\"image_url\" />\n                  </pw-input-container>\n                </div>\n\n                <div class=\"col-12 col-md-6\">\n                  <pw-input-container label=\"Cta URL\" name=\"cta_url\">\n                    <input type=\"text\" class=\"form-control\" formControlName=\"cta_url\" />\n                  </pw-input-container>\n                </div>\n\n                <div class=\"col-12 col-md-6\">\n                  <pw-input-container label=\"Video URL\" name=\"video_url\">\n                    <input type=\"text\" class=\"form-control\" formControlName=\"video_url\" />\n                  </pw-input-container>\n                </div>\n                <div class=\"col-12 col-md-6\">\n                  <pw-input-container label=\"CTA Title\">\n                    <input class=\"form-control\" formControlName=\"title\" />\n                  </pw-input-container>\n                </div>\n                <div class=\"col-12 col-md-6\">\n                  <pw-input-container label=\"CTA Description\">\n                    <input class=\"form-control\" formControlName=\"description\" />\n                  </pw-input-container>\n                </div>\n                <div class=\"col-12 col-md-6\">\n                  <pw-input-container label=\"Button Text\">\n                    <input class=\"form-control\" formControlName=\"button_text\" />\n                  </pw-input-container>\n                </div>\n                <div class=\"col-md-1 d-flex align-items-center mt-3\">\n                  <i\n                    class=\"fa fa-trash delete-icon\"\n                    (click)=\"removeCtasItem(i)\"\n                    (keydown.enter)=\"removeCtasItem(i)\"\n                    (keydown.space)=\"removeCtasItem(i)\"\n                    ngbTooltip=\"Remove\"\n                    aria-hidden=\"true\"\n                  ></i>\n                </div>\n              </div>\n              <div class=\"text-start mt-2\">\n                <button type=\"button\" class=\"btn btn-primary mt-2 mb-2\" (click)=\"addCtasItem()\">+ Add CTA Item</button>\n              </div>\n            </div>\n          </div>\n        </p-accordionTab>\n\n        <p-accordionTab [header]=\"'Integrations Section'\">\n          <div class=\"row mt-3 mb-4\" formGroupName=\"integrations\">\n            <h4 class=\"mb-3\">Integrations Section</h4>\n\n            <pw-input-container label=\"Title\" class=\"col-12\">\n              <input type=\"text\" class=\"form-control\" formControlName=\"title\" />\n            </pw-input-container>\n\n            <pw-input-container label=\"Description\" class=\"col-12\">\n              <textarea class=\"form-control\" formControlName=\"description\" rows=\"3\"></textarea>\n            </pw-input-container>\n\n            <div formArrayName=\"items\" class=\"col-12\">\n              <div\n                *ngFor=\"let item of integrationsItems.controls; let i = index\"\n                [formGroupName]=\"i\"\n                class=\"row border p-3 mb-3 rounded bg-light\"\n              >\n                <pw-input-container label=\"Title\" class=\"col-md-6\">\n                  <input type=\"text\" class=\"form-control\" formControlName=\"title\" />\n                </pw-input-container>\n\n                <pw-input-container label=\"Description\" class=\"col-md-6\">\n                  <input type=\"text\" class=\"form-control\" formControlName=\"description\" />\n                </pw-input-container>\n\n                <pw-input-container label=\"Blog URL\" class=\"col-md-6\">\n                  <input type=\"text\" class=\"form-control\" formControlName=\"blog_url\" />\n                </pw-input-container>\n\n                <pw-input-container label=\"Image URL\" class=\"col-md-6\">\n                  <input type=\"text\" class=\"form-control\" formControlName=\"image_url\" />\n                </pw-input-container>\n\n                <pw-input-container label=\"Video URL\" class=\"col-md-6\">\n                  <input type=\"text\" class=\"form-control\" formControlName=\"video_url\" />\n                </pw-input-container>\n\n                <div class=\"col-md-6 d-flex align-items-end justify-content-end\">\n                  <button\n                    type=\"button\"\n                    class=\"btn btn-danger\"\n                    (click)=\"removeIntegrationItem(i)\"\n                  >\n                    Remove\n                  </button>\n                </div>\n              </div>\n\n              <div class=\"text-start mt-2\">\n                <button type=\"button\" class=\"btn btn-primary\" (click)=\"addIntegrationItem()\">\n                  + Add Integration\n                </button>\n              </div>\n            </div>\n          </div>\n        </p-accordionTab>\n\n        <p-accordionTab [header]=\"'Contact Us Section'\">\n          <div class=\"row mt-3 mb-4\" formGroupName=\"contact_us\">\n            <h4 class=\"mb-3\">Contact Us Section</h4>\n            <pw-input-container label=\"Url\" class=\"col-md-6\">\n              <input type=\"text\" class=\"form-control\" formControlName=\"url\" />\n            </pw-input-container>\n            <pw-input-container label=\"Description\" class=\"col-12\" name=\"contact_us_description\">\n              <textarea rows=\"3\" class=\"form-control\" formControlName=\"description\"></textarea>\n            </pw-input-container>\n            <!-- Questions -->\n            <div formArrayName=\"questions\" class=\"col-12 mt-3\">\n              <div *ngFor=\"let questionGroup of contactUsQuestions.controls; let i = index\" [formGroupName]=\"i\"\n                class=\"row border p-3 mb-3\">\n                <pw-input-container label=\"Question\" class=\"col-md-10\">\n                  <input type=\"text\" class=\"form-control\" formControlName=\"question\" />\n                </pw-input-container>\n                <div class=\"col-md-2 d-flex align-items-center mt-3\">\n                  <i class=\"fa fa-trash delete-icon\" (click)=\"removeContactUsQuestion(i)\"\n                    (keydown.enter)=\"removeContactUsQuestion(i)\" (keydown.space)=\"removeContactUsQuestion(i)\"\n                    ngbTooltip=\"Remove\" aria-hidden=\"true\"></i>\n                </div>\n                <!-- Options inside each question -->\n                <div class=\"col-12\" formArrayName=\"options\">\n                  <div class=\"row align-items-center mb-2 border p-3\"\n                    *ngFor=\"let option of getQuestionOptions(i).controls; let j = index\" [formGroupName]=\"j\">\n                    <pw-input-container label=\"Option\" class=\"col-md-10\">\n                      <input type=\"text\" class=\"form-control\" formControlName=\"option\" />\n                    </pw-input-container>\n                    <div class=\"col-md-2 d-flex align-items-center mt-3\">\n                      <i class=\"fa fa-trash delete-icon\" (click)=\"removeContactUsOption(i, j)\"\n                        (keydown.enter)=\"removeContactUsOption(i, j)\" (keydown.space)=\"removeContactUsOption(i, j)\"\n                        ngbTooltip=\"Remove Option\" aria-hidden=\"true\"></i>\n                    </div>\n                  </div>\n                  <div class=\"text-start\">\n                    <button type=\"button\" class=\"btn btn-primary btn-sm\" (click)=\"addContactUsOption(i)\"> + Add Option </button>\n                  </div>\n                </div>\n                <!-- End options -->\n              </div>\n              <div class=\"text-start mt-3\">\n                <button type=\"button\" class=\"btn btn-primary\" (click)=\"addContactUsQuestion()\">+ Add Question</button>\n              </div>\n            </div>\n          </div>\n        </p-accordionTab>\n\n        <p-accordionTab [header]=\"'Book a Demo Section'\">\n          <!-- Book a Demo Links -->\n          <div class=\"row mt-4\">\n            <div class=\"col-12\">\n              <h4 class=\"mb-3\">{{ 'Admin.DomainConfig.BookDemoLinks' | transloco }}</h4>\n              <div formGroupName=\"book_demo\">\n                <pw-input-container label=\"Title\">\n                  <input type=\"text\" formControlName=\"title\" class=\"form-control\" />\n                </pw-input-container>\n\n                <pw-input-container label=\"Description\">\n                  <input type=\"text\" formControlName=\"description\" class=\"form-control\" />\n                </pw-input-container>\n\n                <div formArrayName=\"items\">\n                  <div *ngFor=\"let link of f['book_demo'].get('items')['controls']; let i = index\" [formGroupName]=\"i\" class=\"row mb-3\">\n                    <div class=\"col-sm-5\">\n                      <pw-input-container label=\"Link Title\">\n                        <input type=\"text\" class=\"form-control\" formControlName=\"title\" />\n                      </pw-input-container>\n                    </div>\n                    <div class=\"col-sm-5\">\n                      <pw-input-container label=\"Link URL\">\n                        <input type=\"text\" class=\"form-control\" formControlName=\"url\" />\n                      </pw-input-container>\n                    </div>\n                    <div class=\"col-sm-2 d-flex align-items-center mt-3\">\n                      <i\n                      ngbTooltip=\"Remove\"\n                      (click)=\"removeBookDemoLink(i)\"\n                                          (keydown.enter)=\"removeBookDemoLink(i)\"\n                                          (keydown.space)=\"removeBookDemoLink(i)\"\n                                          class=\"fa fa-trash delete-icon\"\n                                          aria-hidden=\"true\"\n                                      ></i>\n                    </div>\n                  </div>\n                  <button type=\"button\" class=\"btn btn-primary mt-2 mb-2\" (click)=\"addBookDemoLink()\">+ Add Book Demo Link</button>\n                </div>\n              </div>\n            </div>\n          </div>\n        </p-accordionTab>\n\n        <p-accordionTab [header]=\"'Coming soon pages - Subscribe to newsletter (TO DISCONTINUE)'\">\n          <div class=\"mb-3\">\n            <p>ComingSoon Pages will enable users to subscribe to Newsletters and are accessible at the internal paths\n              /join/cs1, /join/cs2, etc.</p>\n          </div>\n          <!-- live page link -->\n          <div class=\"text-end\" *ngIf=\"shardUrl\">\n            <span>See the live page <span class=\"tooltip-wrap ms-1\" [appendTo]=\"'body'\"\n                [pTooltip]=\"'Admin.DomainConfig.Tooltip.SeeLiveCs' | transloco\" tooltipPosition=\"top\">\n                <i class=\"fas fa-info-circle\"></i>\n              </span> : <a [href]=\"shardUrl + '/join/cs1'\" target=\"_blank\">{{ shardUrl }}/join/cs1</a></span>\n          </div>\n          <div class=\"row\">\n            <div class=\"col-12 col-sm-3\">\n              <pw-input-container [label]=\"'Admin.DomainConfig.CsProduct' | transloco\" [showTooltip]=\"true\"\n                [tooltipText]=\"'Admin.DomainConfig.Tooltip.CsProduct' | transloco\" name=\"cs_product_id\">\n                <p-autoComplete [suggestions]=\"productsList\" formControlName=\"cs_product_id\" dataKey=\"id\" field=\"name\"\n                  [dropdown]=\"true\" [delay]=\"1000\" (completeMethod)=\"searchProduct($event)\" styleClass=\"w-100\"\n                  placeholder=\"Search Product\" [inputStyle]=\"\n                                                form.get('cs_product_id').touched &&\n                                                form.get('cs_product_id').invalid\n                                                    ? { border: '1px solid #ff586b' }\n                                                    : { border: '1px solid gray' }\n                                            \" [multiple]=\"false\">\n                </p-autoComplete>\n              </pw-input-container>\n            </div>\n            <div class=\"col-12 col-sm-3\">\n              <pw-input-container [label]=\"'Admin.DomainConfig.CsCrmSourceId' | transloco\" name=\"cs_crm_source_id\"\n                [showTooltip]=\"true\" [tooltipText]=\"'Admin.DomainConfig.Tooltip.CsCrmSourceId' | transloco\">\n                <p-dropdown [options]=\"crmSourcesList\" formControlName=\"cs_crm_source_id\"\n                  [ngClass]=\"{ 'is-invalid': submitted && f['cs_crm_source_id']?.errors }\" [placeholder]=\"'Select CRM Source'\"\n                  optionValue=\"id\" optionLabel=\"name\">\n                </p-dropdown>\n              </pw-input-container>\n            </div>\n            <div class=\"col-12 col-sm-3\">\n              <pw-input-container [label]=\"'Admin.DomainConfig.CsPdfSourceId' | transloco\" name=\"cs_pdf_source_id\"\n                [showTooltip]=\"true\" [tooltipText]=\"'Admin.DomainConfig.Tooltip.CsPdfSourceId' | transloco\">\n                <p-dropdown [options]=\"crmSourcesList\" formControlName=\"cs_pdf_source_id\"\n                  [ngClass]=\"{ 'is-invalid': submitted && f['cs_pdf_source_id']?.errors }\" [placeholder]=\"'Select CRM Source'\"\n                  optionValue=\"id\" optionLabel=\"name\">\n                </p-dropdown>\n              </pw-input-container>\n            </div>\n            <div class=\"col-12 col-sm-3\"></div>\n            <div class=\"col-12 col-sm-3\">\n              <pw-input-container [label]=\"'Admin.DomainConfig.CsVideoUrl' | transloco\" name=\"cs_video_url\" [showTooltip]=\"true\"\n                [tooltipText]=\"'Admin.DomainConfig.Tooltip.CsVideoUrl' | transloco\">\n                <input type=\"text\" class=\"form-control\" formControlName=\"cs_video_url\"\n                  [ngClass]=\"{ 'is-invalid': submitted && f['cs_video_url'].errors }\" />\n              </pw-input-container>\n            </div>\n            <div class=\"col-12 col-sm-3\">\n              <pw-input-container [label]=\"'Admin.DomainConfig.CsBookDemoUrl' | transloco\" name=\"cs_book_demo_url\"\n                [showTooltip]=\"true\" [tooltipText]=\"'Admin.DomainConfig.Tooltip.CsBookDemoUrl' | transloco\">\n                <input type=\"text\" class=\"form-control\" formControlName=\"cs_book_demo_url\"\n                  [ngClass]=\"{ 'is-invalid': submitted && f['cs_book_demo_url'].errors }\" />\n              </pw-input-container>\n            </div>\n            <div class=\"col-12\">\n              <pw-input-container [label]=\"'Admin.DomainConfig.CsCtaIframe' | transloco\" name=\"cs_cta_iframe\"\n                [showTooltip]=\"true\" [tooltipText]=\"'Admin.DomainConfig.Tooltip.CsCtaIframe' | transloco\">\n                <textarea class=\"form-control\" rows=\"3\" formControlName=\"cs_cta_iframe\"\n                  [ngClass]=\"{ 'is-invalid': submitted && f['cs_cta_iframe'].errors }\">\n                                        </textarea>\n              </pw-input-container>\n            </div>\n            <div class=\"col-12\">\n              <pw-input-container [label]=\"'Admin.DomainConfig.CsJoinMessage' | transloco\" name=\"cs_join_message\"\n                [showTooltip]=\"true\" [tooltipText]=\"'Admin.DomainConfig.Tooltip.CsJoinMessage' | transloco\">\n                <textarea class=\"form-control\" rows=\"3\" formControlName=\"cs_join_message\"\n                  [ngClass]=\"{ 'is-invalid': submitted && f['cs_join_message'].errors }\">\n                                        </textarea>\n              </pw-input-container>\n            </div>\n            <div class=\"col-12\">\n              <pw-input-container [label]=\"'Admin.DomainConfig.CsPdfDownloadText' | transloco\" name=\"cs_pdf_download_text\"\n                [showTooltip]=\"true\" [tooltipText]=\"\n                                            'Admin.DomainConfig.Tooltip.CsPdfDownloadText' | transloco\n                                        \">\n                <textarea class=\"form-control\" rows=\"3\" formControlName=\"cs_pdf_download_text\" [ngClass]=\"{\n                                                'is-invalid': submitted && f['cs_pdf_download_text'].errors\n                                            }\">\n                                        </textarea>\n              </pw-input-container>\n            </div>\n          </div>\n          <div class=\"row\" matchHeight=\"card\">\n            <div class=\"col-md-4\">\n              <label for=\"cs_image\">{{ 'Admin.DomainConfig.CsImage' | transloco }} <span class=\"info-circle\">\n                  <span class=\"tooltiptext gradient-custom-branding\">{{ 'Admin.DomainConfig.Tooltip.CsImage' | transloco\n                    }}</span>\n                </span>\n              </label>\n              <pw-custom-uploader (saveEvent)=\"onSaveFile($event)\" [aspectRatio]=\"'custom'\" [title]=\"'Cs Image'\"\n                [controlName]=\"'cs_image'\" [previewData]=\"data['cs_image']\">\n              </pw-custom-uploader>\n            </div>\n            <div class=\"col-md-4\">\n              <label for=\"cs_image2\">{{ 'Admin.DomainConfig.CsImage2' | transloco }} <span class=\"info-circle\">\n                  <span class=\"tooltiptext gradient-custom-branding\">{{ 'Admin.DomainConfig.Tooltip.CsImage2' | transloco\n                    }}</span>\n                </span>\n              </label>\n              <pw-custom-uploader (saveEvent)=\"onSaveFile($event)\" [aspectRatio]=\"'custom'\" [title]=\"'Cs Image2'\"\n                [controlName]=\"'cs_image2'\" [previewData]=\"data['cs_image2']\">\n              </pw-custom-uploader>\n            </div>\n            <div class=\"col-md-4\">\n              <label for=\"cs_pdf_image\">{{ 'Admin.DomainConfig.CsPdfImage' | transloco }} <span class=\"info-circle\">\n                  <span class=\"tooltiptext gradient-custom-branding\">{{ 'Admin.DomainConfig.Tooltip.CsPdfImage' | transloco\n                    }}</span>\n                </span>\n              </label>\n              <pw-custom-uploader (saveEvent)=\"onSaveFile($event)\" [aspectRatio]=\"'custom'\" [title]=\"'Cs Pdf Image'\"\n                [controlName]=\"'cs_pdf_image'\" [previewData]=\"data['cs_pdf_image']\">\n              </pw-custom-uploader>\n            </div>\n            <div class=\"col-md-4\">\n              <label for=\"cs_image_bg\">{{ 'Admin.DomainConfig.CsImageBg' | transloco }} <span class=\"info-circle\">\n                  <span class=\"tooltiptext gradient-custom-branding\">{{ 'Admin.DomainConfig.Tooltip.CsImageBg' | transloco\n                    }}</span>\n                </span>\n              </label>\n              <pw-custom-uploader (saveEvent)=\"onSaveFile($event)\" [aspectRatio]=\"'custom'\" [title]=\"'Cs Pdf Image Bg'\"\n                [controlName]=\"'cs_image_bg'\" [previewData]=\"data['cs_image_bg']\">\n              </pw-custom-uploader>\n            </div>\n            <div class=\"col-md-4\">\n              <label for=\"cs_image_bg2\">{{ 'Admin.DomainConfig.CsImageBg2' | transloco }} <span class=\"info-circle\">\n                  <span class=\"tooltiptext gradient-custom-branding\">{{ 'Admin.DomainConfig.Tooltip.CsImageBg2' | transloco\n                    }}</span>\n                </span>\n              </label>\n              <pw-custom-uploader (saveEvent)=\"onSaveFile($event)\" [aspectRatio]=\"'custom'\" [title]=\"'Cs Pdf Image Bg2'\"\n                [controlName]=\"'cs_image_bg2'\" [previewData]=\"data['cs_image_bg2']\">\n              </pw-custom-uploader>\n            </div>\n          </div>\n        </p-accordionTab>\n      </p-accordion>\n    </div>\n\n    <div class=\"col-12 text-end mt-3\">\n      <button type=\"button\"\n        class=\"btn btn-outline-default me-2\"\n        (click)=\"back()\">\n        {{ 'Button.Cancel' | transloco }}\n      </button>\n      <button type=\"submit\" [buttonBusy]=\"buttonBusy\"\n        class=\"btn btn-primary\">{{ 'Button.Submit' | transloco }}</button>\n    </div>\n  </form>\n</ng-container>\n<div *ngIf=\"!data?.host_name && !isLoading\">\n  <pw-no-data [withImage]=\"true\" [message]=\"'Admin.DomainConfig.EnableConfigTab' | transloco\"> </pw-no-data>\n</div>\n\n\n<ng-template #partnerCropper let-modal>\n  <div class=\"modal-header\">\n    <h5 class=\"modal-title\">Upload Partner Image</h5>\n    <button type=\"button\" class=\"btn-close\" aria-label=\"Close\" (click)=\"modal.dismiss()\"></button>\n  </div>\n  <div class=\"modal-body\">\n    <small>You can upload JPG, PNG, or GIF files. Avoid images with celebrities, nudity, or artwork.</small>\n    <pw-image-cropper\n      aspectRatio=\"auto\"\n      (imageSelectionEvent)=\"onPartnerImageSelected($event)\"\n      (closeEvent)=\"onClosePartnerModal()\"\n    ></pw-image-cropper>\n  </div>\n</ng-template>\n" }]
+            args: [{ selector: 'pw-domain-config-build', template: "<h3>Public Pages Configuration</h3>\n<div class=\"mb-4\">\n  <p> The following parameters and settings will be applied to all public pages of this domain. </p>\n</div>\n<div class=\"w-100 text-center mt-3\"\n  *ngIf=\"isLoading\">\n  <p-progressSpinner strokeWidth=\"2\"> </p-progressSpinner>\n</div>\n<ng-container *ngIf=\"!isLoading && data?.host_name\">\n  <form [formGroup]=\"form\"\n    (ngSubmit)=\"onSave()\">\n    <div class=\"row\">\n      <div class=\"col-12 col-sm-3\">\n        <pw-input-container [label]=\"'Admin.DomainConfig.MasterSubscription' | transloco\"\n          name=\"master_subscription_id\"\n          [showTooltip]=\"true\"\n          [tooltipText]=\"'Admin.DomainConfig.Tooltip.MasterSubscription' | transloco\">\n          <p-dropdown\n          [options]=\"masterSubscriptionsList\"\n          formControlName=\"master_subscription_id\"\n          [ngClass]=\"{ 'is-invalid': submitted && f['master_subscription_id']?.errors }\"\n          placeholder=\"Select Master Subscription\">\n        </p-dropdown>\n        </pw-input-container>\n      </div>\n      <div class=\"col-12 col-sm-3\">\n        <pw-input-container [label]=\"'Admin.DomainConfig.MasterSubscriptionProduct' | transloco\"\n          [showTooltip]=\"true\"\n          [tooltipText]=\"\n                        'Admin.DomainConfig.Tooltip.MasterSubscriptionProduct' | transloco\n                    \"\n          name=\"master_subscription_product_id\">\n          <p-dropdown\n            [options]=\"masterSubscriptionProductList\"\n            formControlName=\"master_subscription_product_id\"\n            [ngClass]=\"{'is-invalid': submitted && f['master_subscription_product_id']?.errors}\"\n            [placeholder]=\"'Select Master Product'\"\n            optionValue=\"id\"\n            optionLabel=\"name\"\n            >\n          </p-dropdown>\n        </pw-input-container>\n      </div>\n      <div class=\"col-12 col-sm-3\">\n        <pw-input-container [label]=\"'Admin.DomainConfig.BlogFeatureKey' | transloco\"\n          name=\"blog_feature_key\"\n          [showTooltip]=\"true\"\n          [tooltipText]=\"'Admin.DomainConfig.Tooltip.BlogFeatureKey' | transloco\">\n          <input type=\"text\"\n            class=\"form-control\"\n            formControlName=\"blog_feature_key\"\n            [ngClass]=\"{ 'is-invalid': submitted && f['blog_feature_key'].errors }\" />\n        </pw-input-container>\n      </div>\n      <div class=\"col-12 col-sm-3\">\n        <pw-input-container [label]=\"'Admin.DomainConfig.MainTos' | transloco\"\n          name=\"main_tos_id\"\n          [showTooltip]=\"true\"\n          [tooltipText]=\"'Admin.DomainConfig.Tooltip.MainTos' | transloco\">\n          <p-dropdown\n          [options]=\"subscriptionTosList\"\n          formControlName=\"main_tos_id\"\n          [ngClass]=\"{ 'is-invalid': submitted && f['main_tos_id']?.errors }\"\n          [placeholder]=\"'Select Main TOS'\"\n          optionValue=\"id\">\n          <ng-template pTemplate=\"selectedItem\" let-item>\n            <span [innerHTML]=\"item.title\"></span>\n          </ng-template>\n          <ng-template pTemplate=\"item\" let-item>\n            <span [innerHTML]=\"item.title\"></span>\n          </ng-template>\n        </p-dropdown>\n\n        </pw-input-container>\n      </div>\n      <!-- crm subscription fields -->\n      <div class=\"col-12 col-sm-3\">\n        <pw-input-container [label]=\"'Admin.DomainConfig.CrmSubscription' | transloco\"\n          name=\"crm_subscription_id\"\n          [showTooltip]=\"true\"\n          [tooltipText]=\"'Admin.DomainConfig.Tooltip.CrmSubscription' | transloco\">\n          <p-dropdown\n            [options]=\"crmSubscriptionsList\"\n            formControlName=\"crm_subscription_id\"\n            [ngClass]=\"{ 'is-invalid': submitted && f['crm_subscription_id']?.errors }\"\n            [placeholder]=\"'Select CRM Subscription'\"\n            optionValue=\"id\">\n            <ng-template pTemplate=\"selectedItem\" let-item>\n              {{item?.organisation ? item?.organisation + ' - ' + item.contact_name : item?.contact_name}}\n            </ng-template>\n            <ng-template pTemplate=\"item\" let-item>\n              {{item?.organisation ? item?.organisation + ' - ' + item.contact_name : item?.contact_name}}\n            </ng-template>\n          </p-dropdown>\n\n        </pw-input-container>\n      </div>\n      <div class=\"col-12 col-sm-3\">\n        <pw-input-container [label]=\"'Admin.DomainConfig.CrmProduct' | transloco\"\n          name=\"crm_product_id\"\n          [showTooltip]=\"true\"\n          [tooltipText]=\"'Admin.DomainConfig.Tooltip.CrmProduct' | transloco\">\n          <p-dropdown\n            [options]=\"crmProductList\"\n            formControlName=\"crm_product_id\"\n            [ngClass]=\"{ 'is-invalid': submitted && f['crm_product_id']?.errors }\"\n            [placeholder]=\"'Select CRM Product'\"\n            optionValue=\"id\"\n            >\n            <ng-template pTemplate=\"selectedItem\" let-item>\n              {{item?.subscription_id ? item?.name  +' - SubscriptionID = '+ item.subscription_id : item?.name}}\n            </ng-template>\n            <ng-template pTemplate=\"item\" let-item>\n              {{item?.subscription_id ? item?.name  +' - SubscriptionID = '+ item.subscription_id : item?.name}}\n            </ng-template>\n          </p-dropdown>\n        </pw-input-container>\n      </div>\n      <div class=\"col-12 col-sm-3\">\n        <pw-input-container [label]=\"'Admin.DomainConfig.CrmSource' | transloco\"\n          name=\"crm_source_id\"\n          [showTooltip]=\"true\"\n          [tooltipText]=\"'Admin.DomainConfig.Tooltip.CrmSource' | transloco\">\n          <p-dropdown\n            [options]=\"crmSourcesList\"\n            formControlName=\"crm_source_id\"\n            [ngClass]=\"{ 'is-invalid': submitted && f['crm_source_id']?.errors }\"\n            [placeholder]=\"'Select CRM Source'\"\n            optionValue=\"id\"\n            optionLabel=\"name\"\n            >\n          </p-dropdown>\n        </pw-input-container>\n      </div>\n      <!-- crm subscription fields end-->\n      <div class=\"col-12 col-sm-3\">\n        <pw-input-container [label]=\"'Admin.DomainConfig.Active' | transloco\" [showTooltip]=\"true\"\n          [tooltipText]=\"'Admin.DomainConfig.Tooltip.Active' | transloco\" name=\"active\">\n          <ui-switch size=\"small\" uncheckedLabel=\"false\" checkedLabel=\"true\" formControlName=\"active\" name=\"active\"\n            [ngClass]=\"{ 'is-invalid': submitted && f['active'].errors }\">\n          </ui-switch>\n        </pw-input-container>\n      </div>\n      <div class=\"col-12 col-sm-3\">\n        <pw-input-container [label]=\"'Admin.DomainConfig.IsProductDomain' | transloco\"\n          [showTooltip]=\"true\"\n          [tooltipText]=\"'Admin.DomainConfig.Tooltip.IsProductDomain' | transloco\"\n          name=\"is_product_domain\">\n          <ui-switch size=\"small\"\n            uncheckedLabel=\"false\"\n            checkedLabel=\"true\"\n            formControlName=\"is_product_domain\"\n            name=\"is_product_domain\"\n            [ngClass]=\"{ 'is-invalid': submitted && f['is_product_domain'].errors }\">\n          </ui-switch>\n        </pw-input-container>\n      </div>\n      <div class=\"col-12 col-sm-3\">\n        <pw-input-container [label]=\"'Admin.DomainConfig.CanRegisterOnMainPage' | transloco\" [showTooltip]=\"true\"\n          [tooltipText]=\"'Admin.DomainConfig.Tooltip.CanRegisterOnMainPage' | transloco\"\n          name=\"can_register_through_main_page\">\n          <ui-switch size=\"small\" uncheckedLabel=\"false\" checkedLabel=\"true\" formControlName=\"can_register_through_main_page\"\n            name=\"can_register_through_main_page\" [ngClass]=\"{\n                                  'is-invalid': submitted && f['can_register_through_main_page'].errors\n                              }\">\n          </ui-switch>\n        </pw-input-container>\n      </div>\n      <div class=\"col-12 col-sm-3\">\n        <pw-input-container [label]=\"'Admin.DomainConfig.SocialLoginEnabled' | transloco\" [showTooltip]=\"true\"\n          [tooltipText]=\"'Admin.DomainConfig.Tooltip.SocialLoginEnable' | transloco\" name=\"social_login_enabled\">\n          <ui-switch size=\"small\" uncheckedLabel=\"false\" checkedLabel=\"true\" formControlName=\"social_login_enabled\"\n            name=\"social_login_enabled\" [ngClass]=\"{ 'is-invalid': submitted && f['social_login_enabled'].errors }\">\n          </ui-switch>\n        </pw-input-container>\n      </div>\n      <div class=\"col-12 col-sm-3\">\n        <pw-input-container [label]=\"'Admin.DomainConfig.NotifyLogins' | transloco\" [showTooltip]=\"true\"\n          [tooltipText]=\"'Admin.DomainConfig.Tooltip.NotifyLogins' | transloco\" name=\"notify_logins\">\n          <ui-switch size=\"small\" uncheckedLabel=\"false\" checkedLabel=\"true\" formControlName=\"notify_logins\"\n            name=\"notify_logins\" [ngClass]=\"{ 'is-invalid': submitted && f['notify_logins'].errors }\">\n          </ui-switch>\n        </pw-input-container>\n      </div>\n    </div>\n\n    <div class=\"my-5\" *rbacAllow=\"'Pages.SuperAdmin'\">\n      <h3>Pre-Built Landing Pages for User Onboarding</h3>\n\n      <p-accordion class=\"mt-5\">\n        <p-accordionTab [header]=\"'Instructions - README FIRST'\">\n          <div class=\"mb-3\">\n            <p>We\u2019ve built and maintain a collection of high-converting landing pages designed to help you quickly launch polished\n              UIs for onboarding users.</p>\n            <p><strong>Newsletter Subscription Pages:</strong><br> After configuring your domain, you can access pages like\n              <strong>/join/cs1, /join/cs2, /join/cs3, etc.</strong>, specifically designed for newsletter sign-ups. <br>\n              Subscribers from these pages will be listed in the <strong>SmartCRM module</strong>.</p>\n            <p><strong>Trial Product Sign-Up Pages:</strong><br> For users interested in trial products, utilize pages such as\n              <strong>/join/trial1, /join/trial2, /join/trial3, etc.</strong>.<br> Users registering through these pages will\n              appear in the <strong>Admin > Users section</strong>.</p>\n            <p>Once you\u2019ve selected the landing page you want to use <strong>(e.g., /join/trial3)</strong>, make sure to update\n              the <strong>Internal Path</strong> in the <strong>Core tab</strong> accordingly\u2014i.e., set it to\n              <strong>/join/trial3</strong>.</p>\n            <p>If you need assistance integrating these pages into your workflow or have further questions, feel free to reach\n              out.</p>\n          </div>\n        </p-accordionTab>\n\n        <p-accordionTab [header]=\"'Subscribe to Product/Newsletter Config'\">\n          <div class=\"mb-3\">\n            <p>Trial Pages will enable users to sign up to real products and are accessible at the path /join/trial1,\n              /join/trial2, etc.</p>\n            <p>ComingSoon Pages will enable users to subscribe to Newsletters and are accessible at the internal paths\n              /join/cs1, /join/cs2, etc.</p>\n          </div>\n          <!-- live page link -->\n          <div class=\"text-end\" *ngIf=\"shardUrl\">\n            <span>See the live page <span class=\"tooltip-wrap ms-1\" [appendTo]=\"'body'\"\n                [pTooltip]=\"'Admin.DomainConfig.Tooltip.SeeLiveTrial' | transloco\" tooltipPosition=\"top\">\n                <i class=\"fas fa-info-circle\"></i>\n              </span> : <a [href]=\"shardUrl + '/join/trial1'\" target=\"_blank\">{{ shardUrl }}/join/trial1</a></span>\n          </div>\n          <div class=\"row\">\n            <div class=\"col-sm-3\">\n              <pw-input-container [label]=\"'Admin.DomainConfig.TrialProduct' | transloco\" [showTooltip]=\"true\"\n                [tooltipText]=\"'Admin.DomainConfig.Tooltip.TrialProduct' | transloco\" name=\"trial_product_id\">\n                <p-autoComplete [suggestions]=\"productsList\" formControlName=\"trial_product_id\" dataKey=\"id\" field=\"name\"\n                  [dropdown]=\"true\" [delay]=\"1000\" (completeMethod)=\"searchProduct($event)\" styleClass=\"w-100\"\n                  placeholder=\"Search Product\" [inputStyle]=\"\n                                                  form.get('trial_product_id').touched &&\n                                                  form.get('trial_product_id').invalid\n                                                      ? { border: '1px solid #ff586b' }\n                                                      : { border: '1px solid gray' }\n                                              \" [multiple]=\"false\">\n                </p-autoComplete>\n              </pw-input-container>\n            </div>\n            <div class=\"col-12 col-sm-3\">\n              <pw-input-container [label]=\"'Admin.DomainConfig.TrialCrmSourceId' | transloco\" name=\"trial_crm_source_id\"\n                [showTooltip]=\"true\" [tooltipText]=\"\n                                              'Admin.DomainConfig.Tooltip.TrialCrmSourceId' | transloco\n                                          \">\n                <p-dropdown [options]=\"crmSourcesList\" formControlName=\"trial_crm_source_id\"\n                  [ngClass]=\"{ 'is-invalid': submitted && f['trial_crm_source_id']?.errors }\"\n                  [placeholder]=\"'Select CRM Source'\" optionValue=\"id\" optionLabel=\"name\">\n                </p-dropdown>\n              </pw-input-container>\n            </div>\n            <div class=\"col-12 col-sm-3\">\n              <pw-input-container [label]=\"'Admin.DomainConfig.TrialPdfSourceId' | transloco\" name=\"trial_pdf_source_id\"\n                [showTooltip]=\"true\" [tooltipText]=\"\n                                              'Admin.DomainConfig.Tooltip.TrialPdfSourceId' | transloco\n                                          \">\n                <p-dropdown [options]=\"crmSourcesList\" formControlName=\"trial_pdf_source_id\"\n                  [ngClass]=\"{ 'is-invalid': submitted && f['trial_pdf_source_id']?.errors }\"\n                  [placeholder]=\"'Select CRM Source'\" optionValue=\"id\" optionLabel=\"name\">\n                </p-dropdown>\n              </pw-input-container>\n            </div>\n            <div class=\"col-12 col-sm-3\"></div>\n            <div class=\"col-12 col-sm-3\">\n              <pw-input-container [label]=\"'Admin.DomainConfig.TrialVideoUrl' | transloco\" name=\"trial_video_url\"\n                [showTooltip]=\"true\" [tooltipText]=\"'Admin.DomainConfig.Tooltip.TrialVideoUrl' | transloco\">\n                <input type=\"text\" class=\"form-control\" formControlName=\"trial_video_url\"\n                  [ngClass]=\"{ 'is-invalid': submitted && f['trial_video_url'].errors }\" />\n              </pw-input-container>\n            </div>\n            <div class=\"col-12 col-sm-3\">\n              <pw-input-container [label]=\"'Admin.DomainConfig.TrialBookDemoUrl' | transloco\" name=\"trial_book_demo_url\"\n                [showTooltip]=\"true\" [tooltipText]=\"\n                                              'Admin.DomainConfig.Tooltip.TrialBookDemoUrl' | transloco\n                                          \">\n                <input type=\"text\" class=\"form-control\" formControlName=\"trial_book_demo_url\" [ngClass]=\"{\n                                                  'is-invalid': submitted && f['trial_book_demo_url'].errors\n                                              }\" />\n              </pw-input-container>\n            </div>\n            <div class=\"col-12\">\n              <pw-input-container [label]=\"'Admin.DomainConfig.TrialCtaIframe' | transloco\" name=\"trial_cta_iframe\"\n                [showTooltip]=\"true\" [tooltipText]=\"\n                                              'Admin.DomainConfig.Tooltip.TrialCtaIframe' | transloco\n                                          \">\n                <textarea rows=\"3\" class=\"form-control\" formControlName=\"trial_cta_iframe\" [ngClass]=\"{\n                                                  'is-invalid': submitted && f['trial_cta_iframe'].errors\n                                              }\">\n                                          </textarea>\n              </pw-input-container>\n            </div>\n            <div class=\"col-12\">\n              <pw-input-container [label]=\"'Admin.DomainConfig.TrialJoinMessage' | transloco\" name=\"trial_join_message\"\n                [showTooltip]=\"true\" [tooltipText]=\"\n                                              'Admin.DomainConfig.Tooltip.TrialJoinMessage' | transloco\n                                          \">\n                <textarea rows=\"3\" class=\"form-control\" formControlName=\"trial_join_message\" [ngClass]=\"{\n                                                  'is-invalid': submitted && f['trial_join_message'].errors\n                                              }\">\n                                          </textarea>\n              </pw-input-container>\n            </div>\n            <div class=\"col-12\">\n              <pw-input-container [label]=\"'Admin.DomainConfig.TrialPdfDownloadText' | transloco\" name=\"trial_pdf_download_text\"\n                [showTooltip]=\"true\" [tooltipText]=\"\n                                              'Admin.DomainConfig.Tooltip.TrialPdfDownloadText' | transloco\n                                          \">\n                <textarea rows=\"3\" class=\"form-control\" formControlName=\"trial_pdf_download_text\" [ngClass]=\"{\n                                                  'is-invalid': submitted && f['trial_pdf_download_text'].errors\n                                              }\">\n                                          </textarea>\n              </pw-input-container>\n            </div>\n          </div>\n          <div class=\"row\" matchHeight=\"card\">\n            <div class=\"col-md-4\">\n              <label for=\"trial_image\">{{ 'Admin.DomainConfig.TrialImage' | transloco }} <span class=\"info-circle\">\n                  <span class=\"tooltiptext gradient-custom-branding\">{{ 'Admin.DomainConfig.Tooltip.TrialImage' | transloco\n                    }}</span>\n                </span>\n              </label>\n              <pw-custom-uploader (saveEvent)=\"onSaveFile($event)\" [aspectRatio]=\"'custom'\" [title]=\"'Trial Image'\"\n                [controlName]=\"'trial_image'\" [previewData]=\"data['trial_image']\">\n              </pw-custom-uploader>\n            </div>\n            <div class=\"col-md-4\">\n              <label for=\"trial_image2\">{{ 'Admin.DomainConfig.TrialImage2' | transloco }} <span class=\"info-circle\">\n                  <span class=\"tooltiptext gradient-custom-branding\">{{ 'Admin.DomainConfig.Tooltip.TrialImage2' | transloco\n                    }}</span>\n                </span>\n              </label>\n              <pw-custom-uploader (saveEvent)=\"onSaveFile($event)\" [title]=\"'Trial Image2'\" [aspectRatio]=\"'custom'\"\n                [controlName]=\"'trial_image2'\" [previewData]=\"data['trial_image2']\">\n              </pw-custom-uploader>\n            </div>\n            <div class=\"col-md-4\">\n              <label for=\"trial_pdf_image\">{{ 'Admin.DomainConfig.TrialPdfImage' | transloco }} <span class=\"info-circle\">\n                  <span class=\"tooltiptext gradient-custom-branding\">{{ 'Admin.DomainConfig.Tooltip.TrialPdfImage' | transloco\n                    }}</span>\n                </span>\n              </label>\n              <pw-custom-uploader (saveEvent)=\"onSaveFile($event)\" [title]=\"'Trial Pdf Image'\" [aspectRatio]=\"'custom'\"\n                [controlName]=\"'trial_pdf_image'\" [previewData]=\"data['trial_pdf_image']\">\n              </pw-custom-uploader>\n            </div>\n            <div class=\"col-md-4\">\n              <label for=\"trial_image_bg\">{{ 'Admin.DomainConfig.TrialImageBg' | transloco }} <span class=\"info-circle\">\n                  <span class=\"tooltiptext gradient-custom-branding\">{{ 'Admin.DomainConfig.Tooltip.TrialImageBg' | transloco\n                    }}</span>\n                </span>\n              </label>\n              <pw-custom-uploader (saveEvent)=\"onSaveFile($event)\" [title]=\"'Trial Image Bg'\" [aspectRatio]=\"'custom'\"\n                [controlName]=\"'trial_image_bg'\" [previewData]=\"data['trial_image_bg']\">\n              </pw-custom-uploader>\n            </div>\n            <div class=\"col-md-4\">\n              <label for=\"trial_image_bg2\">{{ 'Admin.DomainConfig.TrialImageBg2' | transloco }} <span class=\"info-circle\">\n                  <span class=\"tooltiptext gradient-custom-branding\">{{ 'Admin.DomainConfig.Tooltip.TrialImageBg2' | transloco\n                    }}</span>\n                </span>\n              </label>\n              <pw-custom-uploader (saveEvent)=\"onSaveFile($event)\" [title]=\"'Trial Image Bg2'\" [aspectRatio]=\"'custom'\"\n                [controlName]=\"'trial_image_bg2'\" [previewData]=\"data['trial_image_bg2']\">\n              </pw-custom-uploader>\n            </div>\n          </div>\n        </p-accordionTab>\n\n        <p-accordionTab [header]=\"'Header Section'\">\n          <div class=\"row mt-4\" formGroupName=\"header\">\n            <h4 class=\"mb-4\">Header Section</h4>\n            <div class=\"col-12 col-md-12\">\n              <pw-input-container label=\"Header Headline\" name=\"headline\">\n                <input type=\"text\" class=\"form-control\" formControlName=\"headline\" />\n              </pw-input-container>\n            </div>\n            <div class=\"col-12 col-md-6\">\n              <pw-input-container label=\"Header Video URL\" name=\"video_url\">\n                <input type=\"text\" class=\"form-control\" formControlName=\"video_url\" />\n              </pw-input-container>\n            </div>\n            <div class=\"col-12 col-md-6\">\n              <pw-input-container label=\"Header Background Image URL\" name=\"bg_image_url\">\n                <input type=\"text\" class=\"form-control\" formControlName=\"bg_image_url\" />\n              </pw-input-container>\n            </div>\n            <div class=\"col-12\">\n              <pw-input-container label=\"Header Description\">\n                <textarea class=\"form-control\" rows=\"5\" formControlName=\"description\"\n                  [ngClass]=\"{ 'is-invalid': submitted && f['description']?.errors }\">\n                                                </textarea>\n              </pw-input-container>\n            </div>\n            <div formArrayName=\"sub_headings\" class=\"col-12\">\n              <div *ngFor=\"let sub of f['header'].get('sub_headings')['controls']; let i = index\" [formGroupName]=\"i\"\n                class=\"row mb-3\">\n                <div class=\"col-md-10\" *ngIf=\"f['header'].get('sub_headings')['controls'].length\">\n                  <pw-input-container label=\"Sub Header Description\">\n                    <textarea class=\"form-control\" rows=\"3\" formControlName=\"description\"\n                      [ngClass]=\"{ 'is-invalid': submitted && f['description']?.errors }\">\n                                                    </textarea>\n                  </pw-input-container>\n                </div>\n                <div class=\"col-md-2 d-flex align-items-center mt-3\">\n                  <i class=\"fa fa-trash delete-icon\" (click)=\"removeHeaderSubHeading(i)\"\n                    (keydown.enter)=\"removeHeaderSubHeading(i)\" (keydown.space)=\"removeHeaderSubHeading(i)\" ngbTooltip=\"Remove\"\n                    aria-hidden=\"true\"></i>\n                </div>\n              </div>\n              <button type=\"button\" class=\"btn btn-primary mt-2 mb-2\" (click)=\"addHeaderSubHeading()\"> + Add Sub Heading\n              </button>\n            </div>\n          </div>\n        </p-accordionTab>\n\n        <p-accordionTab [header]=\"'Resources Section'\">\n          <div class=\"row row mt-4 mb-4\">\n            <h4 class=\"mb-3\">Resources Section</h4>\n            <div class=\"col-12 col-sm-6\">\n              <pw-input-container [label]=\"'Admin.DomainConfig.ResourceTagline' | transloco\" name=\"resources_tagline\"\n                [showTooltip]=\"true\" [tooltipText]=\"'Admin.DomainConfig.Tooltip.ResourceTagline' | transloco\">\n                <input type=\"text\" class=\"form-control\" formControlName=\"resources_tagline\"\n                  [ngClass]=\"{ 'is-invalid': submitted && f['resources_tagline'].errors }\" />\n              </pw-input-container>\n            </div>\n            <div class=\"col-12\">\n              <pw-input-container [label]=\"'Admin.DomainConfig.ResourceDescription' | transloco\" name=\"resources_description\"\n                [showTooltip]=\"true\" [tooltipText]=\"'Admin.DomainConfig.Tooltip.ResourceDescription' | transloco\">\n                <textarea class=\"form-control\" rows=\"3\" formControlName=\"resources_description\"\n                  [ngClass]=\"{ 'is-invalid': submitted && f['resources_description'].errors }\">\n                                          </textarea>\n              </pw-input-container>\n            </div>\n          </div>\n          <div class=\"row\" matchHeight=\"card\">\n            <div class=\"col-md-4\">\n              <label for=\"resource_image\">{{ 'Admin.DomainConfig.ResourceImage' | transloco }} <span class=\"info-circle\">\n                  <span class=\"tooltiptext gradient-custom-branding\">{{ 'Admin.DomainConfig.Tooltip.ResourceImage' | transloco\n                    }}</span>\n                </span>\n              </label>\n              <pw-custom-uploader (saveEvent)=\"onSaveFile($event)\" [aspectRatio]=\"'custom'\" [title]=\"'Cs Image'\"\n                [controlName]=\"'resources_image'\" [previewData]=\"data['resources_image']\">\n              </pw-custom-uploader>\n            </div>\n          </div>\n        </p-accordionTab>\n\n        <p-accordionTab [header]=\"'Unique Selling Proposition Section (USP) '\">\n          <div class=\"row mt-4 mb-4\" formGroupName=\"usps\">\n            <h4 class=\"mb-4\">Unique Selling Proposition Section (USP)</h4>\n            <div class=\"col-12 col-md-6\">\n              <pw-input-container label=\"USPs Title\" name=\"title\">\n                <input type=\"text\" class=\"form-control\" formControlName=\"title\" />\n              </pw-input-container>\n            </div>\n            <div class=\"col-12 col-md-6\">\n              <pw-input-container label=\"USPs Video Url\" name=\"video_url\">\n                <input type=\"text\" class=\"form-control\" formControlName=\"video_url\" />\n              </pw-input-container>\n            </div>\n            <div class=\"col-12\">\n              <pw-input-container label=\"USPs Description\" name=\"description\">\n                <textarea class=\"form-control\" rows=\"3\" formControlName=\"description\"\n                 >\n                                  </textarea>\n              </pw-input-container>\n            </div>\n            <div formArrayName=\"items\" class=\"col-12\">\n              <div\n                *ngFor=\"let item of f['usps'].get('items')['controls']; let i = index\"\n                [formGroupName]=\"i\"\n                class=\"row mb-3\"\n              >\n                <div class=\"col-sm-10\">\n                  <pw-input-container label=\"Item Description\">\n                    <textarea class=\"form-control\" rows=\"3\" formControlName=\"description\"\n                  >\n                                  </textarea>\n                  </pw-input-container>\n                </div>\n                <div class=\"col-sm-2 d-flex align-items-center mt-3\">\n                  <i\n                    class=\"fa fa-trash delete-icon\"\n                    (click)=\"removeUspItem(i)\"\n                    (keydown.enter)=\"removeUspItem(i)\"\n                    (keydown.space)=\"removeUspItem(i)\"\n                    ngbTooltip=\"Remove\"\n                    aria-hidden=\"true\"\n                  ></i>\n                </div>\n              </div>\n              <button type=\"button\" class=\"btn btn-primary mt-2 mb-2\" (click)=\"addUspItem()\">\n                + Add USP Item\n              </button>\n            </div>\n          </div>\n        </p-accordionTab>\n\n        <p-accordionTab [header]=\"'Partners (Clients) Section'\">\n\n          <div class=\"row mt-4 mb-4\" formGroupName=\"partners\">\n            <h4 class=\"mb-4\">Partners (Clients) Section</h4>\n            <!-- Title -->\n            <div class=\"col-12 col-md-6\">\n              <pw-input-container label=\"Partner Title\" name=\"title\">\n                <input type=\"text\" class=\"form-control\" formControlName=\"title\" />\n              </pw-input-container>\n            </div>\n\n            <!-- Description -->\n            <div class=\"col-12\">\n              <pw-input-container label=\"Partners Description\" name=\"description\">\n                <textarea class=\"form-control\" rows=\"3\" formControlName=\"description\"></textarea>\n              </pw-input-container>\n            </div>\n\n            <!-- Partner Items -->\n            <div formArrayName=\"items\" class=\"col-12\">\n              <div *ngFor=\"let item of partnersItems.controls; let i = index\" [formGroupName]=\"i\" class=\"row border p-3 mb-3\">\n                <!-- Name -->\n                <div class=\"col-md-6\">\n                  <pw-input-container label=\"Name\" class=\"col-12 col-md-6\" name=\"name\">\n                    <input class=\"form-control\" formControlName=\"name\"/>\n                  </pw-input-container>\n                </div>\n\n                <!-- Blog URL -->\n                <div class=\"col-md-6\">\n                  <pw-input-container label=\"Blog Url\" class=\"col-12 col-md-6\" name=\"blog_url\">\n                    <input class=\"form-control\" formControlName=\"blog_url\"/>\n                  </pw-input-container>\n                </div>\n\n                <!-- Video URL -->\n                <div class=\"col-md-6\">\n                  <pw-input-container label=\"Video Url\" class=\"col-12 col-md-6\" name=\"video_url\">\n                    <input class=\"form-control\" formControlName=\"video_url\"/>\n                  </pw-input-container>\n                </div>\n                <div class=\"col-md-6\">\n                  <pw-input-container label=\"Image Url\" class=\"col-12 col-md-6\" name=\"ctas_title\">\n                    <input class=\"form-control\" formControlName=\"image_url\"/>\n                  </pw-input-container>\n                </div>\n\n                <!-- Remove Button -->\n                <div class=\"col-md-6 text-start mt-2 align-self-center\">\n                  <i ngbTooltip=\"Remove\" (click)=\"removePartnerItem(i)\" class=\"fa fa-trash delete-icon\" aria-hidden=\"true\"></i>\n                </div>\n              </div>\n\n              <!-- Add New Partner -->\n              <div class=\"text-start mt-2\">\n                <button type=\"button\" class=\"btn btn-primary mt-2 mb-2\" (click)=\"addPartnerItem()\">+ Add Partner</button>\n              </div>\n            </div>\n          </div>\n        </p-accordionTab>\n\n        <p-accordionTab [header]=\"'Testimonials Section'\">\n          <div class=\"row mt-3 mb-4\" formGroupName=\"testimonials\">\n            <h4 class=\"mb-4\">Testimonials Section</h4>\n\n            <pw-input-container label=\"Title\" class=\"col-12 col-md-6\" name=\"testimonials_title\">\n              <input type=\"text\" class=\"form-control\" formControlName=\"title\" />\n            </pw-input-container>\n\n            <pw-input-container label=\"Description\" class=\"col-12\" name=\"testimonials_description\">\n              <textarea rows=\"3\" class=\"form-control\" formControlName=\"description\"></textarea>\n            </pw-input-container>\n\n            <!-- Items List -->\n            <div formArrayName=\"items\" class=\"col-12 mt-3\">\n              <div *ngFor=\"let item of testimonialsItems.controls; let i = index\" [formGroupName]=\"i\" class=\"row border p-3 mb-3\">\n\n                <pw-input-container label=\"Name\" class=\"col-md-6\">\n                  <input type=\"text\" class=\"form-control\" formControlName=\"name\" />\n                </pw-input-container>\n\n                <pw-input-container label=\"Blog URL\" class=\"col-md-6\">\n                  <input type=\"text\" class=\"form-control\" formControlName=\"blog_url\" />\n                </pw-input-container>\n\n                <pw-input-container label=\"Image URL\" class=\"col-md-6\">\n                  <input type=\"text\" class=\"form-control\" formControlName=\"image_url\" />\n                </pw-input-container>\n\n                <pw-input-container label=\"Video URL\" class=\"col-md-6\">\n                  <input type=\"text\" class=\"form-control\" formControlName=\"video_url\" />\n                </pw-input-container>\n\n                <pw-input-container label=\"Testimonial\" class=\"col-md-10\">\n                  <textarea class=\"form-control\" rows=\"3\" formControlName=\"testimonial\"></textarea>\n                </pw-input-container>\n\n                <div class=\"col-md-2 d-flex align-items-center mt-3\">\n                  <i\n                      ngbTooltip=\"Remove\" (click)=\"removeTestimonialItem(i)\"\n                      (keydown.enter)=\"removeTestimonialItem(i)\"\n                      (keydown.space)=\"removeTestimonialItem(i)\" class=\"fa fa-trash delete-icon\"\n                      aria-hidden=\"true\"\n                  ></i>\n                </div>\n              </div>\n\n              <div class=\"text-start mt-2\">\n                <button type=\"button\" class=\"btn btn-primary mt-2 mb-2\" (click)=\"addTestimonialItem()\">+ Add Testimonial</button>\n              </div>\n            </div>\n          </div>\n        </p-accordionTab>\n\n        <p-accordionTab [header]=\"'Video Section'\">\n          <div class=\"row mt-3 mb-4\" formGroupName=\"videos\">\n            <h4 class=\"mb-3\">Video Section</h4>\n\n            <pw-input-container label=\"Title\" class=\"col-12 col-md-6\" name=\"videos_title\">\n              <input type=\"text\" class=\"form-control\" formControlName=\"title\" />\n            </pw-input-container>\n\n            <pw-input-container label=\"Description\" class=\"col-12\" name=\"videos_description\">\n              <textarea rows=\"3\" class=\"form-control\" formControlName=\"description\"></textarea>\n            </pw-input-container>\n\n            <!-- Video Items -->\n            <div formArrayName=\"items\" class=\"col-12 mt-3\">\n              <div *ngFor=\"let item of videosItems.controls; let i = index\" [formGroupName]=\"i\" class=\"row border p-3 mb-3\">\n\n                <pw-input-container label=\"Title\" class=\"col-md-6\">\n                  <input type=\"text\" class=\"form-control\" formControlName=\"title\" />\n                </pw-input-container>\n\n                <pw-input-container label=\"Blog URL\" class=\"col-md-6\">\n                  <input type=\"text\" class=\"form-control\" formControlName=\"blog_url\" />\n                </pw-input-container>\n\n                <pw-input-container label=\"Image URL\" class=\"col-md-6\">\n                  <input type=\"text\" class=\"form-control\" formControlName=\"image_url\" />\n                </pw-input-container>\n\n                <pw-input-container label=\"Video URL\" class=\"col-md-6\">\n                  <input type=\"text\" class=\"form-control\" formControlName=\"video_url\" />\n                </pw-input-container>\n\n                <pw-input-container label=\"Description\" class=\"col-md-10\">\n                  <textarea class=\"form-control\" rows=\"3\" formControlName=\"description\"></textarea>\n                </pw-input-container>\n\n                <div class=\"col-md-2 d-flex align-items-center mt-3\">\n                  <i\n                    class=\"fa fa-trash delete-icon\"\n                    (click)=\"removeVideoItem(i)\"\n                    (keydown.enter)=\"removeVideoItem(i)\"\n                    (keydown.space)=\"removeVideoItem(i)\"\n                    ngbTooltip=\"Remove\"\n                    aria-hidden=\"true\"\n                  ></i>\n                </div>\n              </div>\n\n              <div class=\"text-start mt-2\">\n                <button type=\"button\" class=\"btn btn-primary mt-2 mb-2\" (click)=\"addVideoItem()\">+ Add Video</button>\n              </div>\n            </div>\n          </div>\n        </p-accordionTab>\n\n        <p-accordionTab [header]=\"'Call to Actions Section (CTAs)'\">\n          <div class=\"row mt-4 mb-4\" formGroupName=\"ctas\">\n            <h4 class=\"mb-4\">CTAs Section</h4>\n\n            <div class=\"col-12 col-md-6\">\n              <pw-input-container label=\"Title\" name=\"title\">\n                <input type=\"text\" class=\"form-control\" formControlName=\"title\" />\n              </pw-input-container>\n            </div>\n\n            <div class=\"col-12 col-md-6\">\n              <pw-input-container label=\"Description\" name=\"description\">\n                <input type=\"text\" class=\"form-control\" formControlName=\"description\" />\n              </pw-input-container>\n            </div>\n\n            <div class=\"col-12\">\n              <pw-input-container label=\"Image URL\" name=\"image_url\">\n                <input type=\"text\" class=\"form-control\" formControlName=\"image_url\" />\n              </pw-input-container>\n            </div>\n\n            <!-- CTA Items -->\n            <div formArrayName=\"items\" class=\"col-12 mt-3\">\n              <div *ngFor=\"let item of ctasItems.controls; let i = index\" [formGroupName]=\"i\" class=\"row border p-3 mb-3 ng-untouched ng-pristine ng-valid ng-star-inserted\">\n                <div class=\"col-12 col-md-6\">\n                  <pw-input-container label=\"Image URL\" name=\"image_url\">\n                    <input type=\"text\" class=\"form-control\" formControlName=\"image_url\" />\n                  </pw-input-container>\n                </div>\n\n                <div class=\"col-12 col-md-6\">\n                  <pw-input-container label=\"Cta URL\" name=\"cta_url\">\n                    <input type=\"text\" class=\"form-control\" formControlName=\"cta_url\" />\n                  </pw-input-container>\n                </div>\n\n                <div class=\"col-12 col-md-6\">\n                  <pw-input-container label=\"Video URL\" name=\"video_url\">\n                    <input type=\"text\" class=\"form-control\" formControlName=\"video_url\" />\n                  </pw-input-container>\n                </div>\n                <div class=\"col-12 col-md-6\">\n                  <pw-input-container label=\"CTA Title\">\n                    <input class=\"form-control\" formControlName=\"title\" />\n                  </pw-input-container>\n                </div>\n                <div class=\"col-12 col-md-6\">\n                  <pw-input-container label=\"CTA Description\">\n                    <input class=\"form-control\" formControlName=\"description\" />\n                  </pw-input-container>\n                </div>\n                <div class=\"col-12 col-md-6\">\n                  <pw-input-container label=\"Button Text\">\n                    <input class=\"form-control\" formControlName=\"button_text\" />\n                  </pw-input-container>\n                </div>\n                <div class=\"col-md-1 d-flex align-items-center mt-3\">\n                  <i\n                    class=\"fa fa-trash delete-icon\"\n                    (click)=\"removeCtasItem(i)\"\n                    (keydown.enter)=\"removeCtasItem(i)\"\n                    (keydown.space)=\"removeCtasItem(i)\"\n                    ngbTooltip=\"Remove\"\n                    aria-hidden=\"true\"\n                  ></i>\n                </div>\n              </div>\n              <div class=\"text-start mt-2\">\n                <button type=\"button\" class=\"btn btn-primary mt-2 mb-2\" (click)=\"addCtasItem()\">+ Add CTA Item</button>\n              </div>\n            </div>\n          </div>\n        </p-accordionTab>\n\n        <p-accordionTab [header]=\"'Integrations Section'\">\n          <div class=\"row mt-3 mb-4\" formGroupName=\"integrations\">\n            <h4 class=\"mb-3\">Integrations Section</h4>\n\n            <pw-input-container label=\"Title\" class=\"col-12\">\n              <input type=\"text\" class=\"form-control\" formControlName=\"title\" />\n            </pw-input-container>\n\n            <pw-input-container label=\"Description\" class=\"col-12\">\n              <textarea class=\"form-control\" formControlName=\"description\" rows=\"3\"></textarea>\n            </pw-input-container>\n\n            <div formArrayName=\"items\" class=\"col-12\">\n              <div\n                *ngFor=\"let item of integrationsItems.controls; let i = index\"\n                [formGroupName]=\"i\"\n                class=\"row border p-3 mb-3 rounded bg-light\"\n              >\n                <pw-input-container label=\"Title\" class=\"col-md-6\">\n                  <input type=\"text\" class=\"form-control\" formControlName=\"title\" />\n                </pw-input-container>\n\n                <pw-input-container label=\"Description\" class=\"col-md-6\">\n                  <input type=\"text\" class=\"form-control\" formControlName=\"description\" />\n                </pw-input-container>\n\n                <pw-input-container label=\"Blog URL\" class=\"col-md-6\">\n                  <input type=\"text\" class=\"form-control\" formControlName=\"blog_url\" />\n                </pw-input-container>\n\n                <pw-input-container label=\"Image URL\" class=\"col-md-6\">\n                  <input type=\"text\" class=\"form-control\" formControlName=\"image_url\" />\n                </pw-input-container>\n\n                <pw-input-container label=\"Video URL\" class=\"col-md-6\">\n                  <input type=\"text\" class=\"form-control\" formControlName=\"video_url\" />\n                </pw-input-container>\n\n                <div class=\"col-md-6 d-flex align-items-end justify-content-end\">\n                  <button\n                    type=\"button\"\n                    class=\"btn btn-danger\"\n                    (click)=\"removeIntegrationItem(i)\"\n                  >\n                    Remove\n                  </button>\n                </div>\n              </div>\n\n              <div class=\"text-start mt-2\">\n                <button type=\"button\" class=\"btn btn-primary\" (click)=\"addIntegrationItem()\">\n                  + Add Integration\n                </button>\n              </div>\n            </div>\n          </div>\n        </p-accordionTab>\n\n        <p-accordionTab [header]=\"'Contact Us Section'\">\n          <div class=\"row mt-3 mb-4\" formGroupName=\"contact_us\">\n            <h4 class=\"mb-3\">Contact Us Section</h4>\n            <pw-input-container label=\"Url\" class=\"col-md-6\">\n              <input type=\"text\" class=\"form-control\" formControlName=\"url\" />\n            </pw-input-container>\n            <pw-input-container label=\"Description\" class=\"col-12\" name=\"contact_us_description\">\n              <textarea rows=\"3\" class=\"form-control\" formControlName=\"description\"></textarea>\n            </pw-input-container>\n            <div formArrayName=\"questions\" class=\"col-12 mt-3\">\n              <div *ngFor=\"let questionGroup of contactUsQuestions.controls; let i = index\" [formGroupName]=\"i\"\n                class=\"row border p-3 mb-3\">\n                <pw-input-container label=\"Question\" class=\"col-md-10\">\n                  <input type=\"text\" class=\"form-control\" formControlName=\"question\" />\n                </pw-input-container>\n                <div class=\"col-md-2 d-flex align-items-center mt-3\">\n                  <i class=\"fa fa-trash delete-icon\" (click)=\"removeContactUsQuestion(i)\"\n                    (keydown.enter)=\"removeContactUsQuestion(i)\" (keydown.space)=\"removeContactUsQuestion(i)\"\n                    ngbTooltip=\"Remove\" aria-hidden=\"true\"></i>\n                </div>\n                <!-- Options inside each question -->\n                <div class=\"col-12\" formArrayName=\"options\">\n                  <div class=\"row align-items-center mb-2 border p-3\"\n                    *ngFor=\"let option of getQuestionOptions(i).controls; let j = index\" [formGroupName]=\"j\">\n                    <pw-input-container label=\"Option\" class=\"col-md-10\">\n                      <input type=\"text\" class=\"form-control\" formControlName=\"option\" />\n                    </pw-input-container>\n                    <div class=\"col-md-2 d-flex align-items-center mt-3\">\n                      <i class=\"fa fa-trash delete-icon\" (click)=\"removeContactUsOption(i, j)\"\n                        (keydown.enter)=\"removeContactUsOption(i, j)\" (keydown.space)=\"removeContactUsOption(i, j)\"\n                        ngbTooltip=\"Remove Option\" aria-hidden=\"true\"></i>\n                    </div>\n                  </div>\n                  <div class=\"text-start\">\n                    <button type=\"button\" class=\"btn btn-primary btn-sm\" (click)=\"addContactUsOption(i)\"> + Add Option </button>\n                  </div>\n                </div>\n                <!-- End options -->\n              </div>\n              <div class=\"text-start mt-3\">\n                <button type=\"button\" class=\"btn btn-primary\" (click)=\"addContactUsQuestion()\">+ Add Question</button>\n              </div>\n            </div>\n            <div formArrayName=\"hubspot\" class=\"col-12 mt-4\">\n              <h5 class=\"mb-4\">Hubspot Embeds</h5>\n              <div *ngFor=\"let hub of contactUsHubspotItems.controls; let i = index\" [formGroupName]=\"i\" class=\"row border p-3 mb-2\">\n                <pw-input-container label=\"ID\" class=\"col-md-4\">\n                  <input type=\"text\" class=\"form-control\" formControlName=\"id\" />\n                </pw-input-container>\n\n                <pw-input-container label=\"Position\" class=\"col-md-4\">\n                  <input type=\"text\" class=\"form-control\" formControlName=\"position\" />\n                </pw-input-container>\n\n                <pw-input-container label=\"Div\" class=\"col-md-3\">\n                  <input type=\"text\" class=\"form-control\" formControlName=\"div\" />\n                </pw-input-container>\n\n                <div class=\"col-md-1 d-flex align-items-center mt-3\">\n                  <i\n                    class=\"fa fa-trash delete-icon\"\n                    (click)=\"removeHubspotItem(i)\"\n                    (keydown.enter)=\"removeHubspotItem(i)\"\n                    (keydown.space)=\"removeHubspotItem(i)\"\n                    ngbTooltip=\"Remove Hubspot Embed\"\n                    aria-hidden=\"true\">\n                  </i>\n                </div>\n              </div>\n\n              <div class=\"text-start mt-2\">\n                <button type=\"button\" class=\"btn btn-primary btn-sm\" (click)=\"addHubspotItem()\">+ Add Hubspot Embed</button>\n              </div>\n            </div>\n\n          </div>\n        </p-accordionTab>\n\n        <p-accordionTab [header]=\"'Book a Demo Section'\">\n          <div class=\"row mt-4\">\n            <div class=\"col-12\">\n              <h4 class=\"mb-3\">{{ 'Admin.DomainConfig.BookDemoLinks' | transloco }}</h4>\n              <div formGroupName=\"book_demo\">\n                <pw-input-container label=\"Title\">\n                  <input type=\"text\" formControlName=\"title\" class=\"form-control\" />\n                </pw-input-container>\n\n                <pw-input-container label=\"Description\">\n                  <input type=\"text\" formControlName=\"description\" class=\"form-control\" />\n                </pw-input-container>\n\n                <div formArrayName=\"items\">\n                  <div *ngFor=\"let link of f['book_demo'].get('items')['controls']; let i = index\" [formGroupName]=\"i\" class=\"row mb-3\">\n                    <div class=\"col-sm-5\">\n                      <pw-input-container label=\"Link Title\">\n                        <input type=\"text\" class=\"form-control\" formControlName=\"title\" />\n                      </pw-input-container>\n                    </div>\n                    <div class=\"col-sm-5\">\n                      <pw-input-container label=\"Link URL\">\n                        <input type=\"text\" class=\"form-control\" formControlName=\"url\" />\n                      </pw-input-container>\n                    </div>\n                    <div class=\"col-sm-2 d-flex align-items-center mt-3\">\n                      <i\n                      ngbTooltip=\"Remove\"\n                      (click)=\"removeBookDemoLink(i)\"\n                                          (keydown.enter)=\"removeBookDemoLink(i)\"\n                                          (keydown.space)=\"removeBookDemoLink(i)\"\n                                          class=\"fa fa-trash delete-icon\"\n                                          aria-hidden=\"true\"\n                                      ></i>\n                    </div>\n                  </div>\n                  <button type=\"button\" class=\"btn btn-primary mt-2 mb-2\" (click)=\"addBookDemoLink()\">+ Add Book Demo Link</button>\n                </div>\n              </div>\n            </div>\n          </div>\n        </p-accordionTab>\n\n\n        <p-accordionTab [header]=\"'Navbar Section'\">\n          <div class=\"row mt-3 mb-4\" formGroupName=\"navbar\">\n            <h4 class=\"mb-3\">Navbar Section</h4>\n\n            <div formArrayName=\"items\" class=\"col-12\">\n              <div *ngFor=\"let item of navbarItems.controls; let i = index\" [formGroupName]=\"i\" class=\"row mb-3\">\n\n                <pw-input-container label=\"Title\" class=\"col-md-6\">\n                  <input type=\"text\" class=\"form-control\" formControlName=\"title\" />\n                </pw-input-container>\n\n                <pw-input-container label=\"Path\" class=\"col-md-6\">\n                  <input type=\"text\" class=\"form-control\" formControlName=\"path\" />\n                </pw-input-container>\n\n                <div class=\"col-12\" formArrayName=\"subtitles\">\n                  <div *ngFor=\"let sub of getNavbarSubtitles(i).controls; let j = index\" [formGroupName]=\"j\" class=\"row border p-3 mb-2\">\n                    <div class=\"col-md-5\">\n                      <pw-input-container label=\"Subtitle Title\">\n                        <input type=\"text\" class=\"form-control\" formControlName=\"title\" />\n                      </pw-input-container>\n                    </div>\n                    <div class=\"col-md-5\">\n                      <pw-input-container label=\"Subtitle Path\">\n                        <input type=\"text\" class=\"form-control\" formControlName=\"path\" />\n                      </pw-input-container>\n                    </div>\n                    <div class=\"col-md-2 d-flex align-items-center mt-3\">\n                      <i class=\"fa fa-trash delete-icon\"\n                        (click)=\"removeSubtitle(i, j)\"\n                        (keydown.enter)=\"removeSubtitle(i, j)\"\n                        (keydown.space)=\"removeSubtitle(i, j)\"\n                        ngbTooltip=\"Remove Subtitle\"\n                        aria-hidden=\"true\">\n                      </i>\n                    </div>\n                  </div>\n                  <button type=\"button\" class=\"btn btn-sm btn-primary mt-2\" (click)=\"addSubtitle(i)\">\n                    + Add Subtitle\n                  </button>\n                </div>\n\n                <div class=\"col-md-12 text-end mt-2\">\n                  <i class=\"fa fa-trash delete-icon\"\n                    (click)=\"removeNavbarItem(i)\"\n                    (keydown.enter)=\"removeNavbarItem(i)\"\n                    (keydown.space)=\"removeNavbarItem(i)\"\n                    ngbTooltip=\"Remove Navbar Item\"\n                    aria-hidden=\"true\">\n                  </i>\n                </div>\n              </div>\n\n              <button type=\"button\" class=\"btn btn-primary mt-2 mb-2\" (click)=\"addNavbarItem()\">+ Add Navbar Item</button>\n            </div>\n          </div>\n        </p-accordionTab>\n\n\n        <p-accordionTab [header]=\"'Footer Links Section'\">\n          <div class=\"row mt-3 mb-4\" formGroupName=\"footer_links\">\n            <h4 class=\"mb-3\">Footer Links Section</h4>\n\n            <div formArrayName=\"items\" class=\"col-12\">\n              <div *ngFor=\"let item of footerLinksItems.controls; let i = index\" [formGroupName]=\"i\" class=\"row mb-3\">\n\n                <pw-input-container label=\"Title\" class=\"col-md-6\">\n                  <input type=\"text\" class=\"form-control\" formControlName=\"title\" />\n                </pw-input-container>\n\n                <pw-input-container label=\"Path\" class=\"col-md-6\">\n                  <input type=\"text\" class=\"form-control\" formControlName=\"path\" />\n                </pw-input-container>\n\n                <div class=\"col-12\" formArrayName=\"subtitles\">\n                  <div *ngFor=\"let sub of getFooterSubtitles(i).controls; let j = index\" [formGroupName]=\"j\" class=\"row border p-3 mb-2\">\n                    <div class=\"col-md-5\">\n                      <pw-input-container label=\"Subtitle Title\">\n                        <input type=\"text\" class=\"form-control\" formControlName=\"title\" />\n                      </pw-input-container>\n                    </div>\n                    <div class=\"col-md-5\">\n                      <pw-input-container label=\"Subtitle Path\">\n                        <input type=\"text\" class=\"form-control\" formControlName=\"path\" />\n                      </pw-input-container>\n                    </div>\n                    <div class=\"col-md-2 d-flex align-items-center mt-3\">\n                      <i class=\"fa fa-trash delete-icon\"\n                        (click)=\"removeFooterSubtitle(i, j)\"\n                        (keydown.enter)=\"removeFooterSubtitle(i, j)\"\n                        (keydown.space)=\"removeFooterSubtitle(i, j)\"\n                        ngbTooltip=\"Remove Subtitle\"\n                        aria-hidden=\"true\">\n                      </i>\n                    </div>\n                  </div>\n                  <button type=\"button\" class=\"btn btn-sm btn-primary mt-2\" (click)=\"addFooterSubtitle(i)\">\n                    + Add Subtitle\n                  </button>\n                </div>\n\n                <div class=\"col-md-12 text-end mt-2\">\n                  <i class=\"fa fa-trash delete-icon\"\n                    (click)=\"removeFooterLinkItem(i)\"\n                    (keydown.enter)=\"removeFooterLinkItem(i)\"\n                    (keydown.space)=\"removeFooterLinkItem(i)\"\n                    ngbTooltip=\"Remove Footer Item\"\n                    aria-hidden=\"true\">\n                  </i>\n                </div>\n              </div>\n\n              <button type=\"button\" class=\"btn btn-primary mt-2 mb-2\" (click)=\"addFooterLinkItem()\">+ Add Footer Link</button>\n            </div>\n          </div>\n        </p-accordionTab>\n\n\n\n        <p-accordionTab [header]=\"'Guides Section'\">\n          <div class=\"row mt-3 mb-4\" formGroupName=\"guides\">\n            <h4 class=\"mb-3\">Guides Section</h4>\n\n            <div formArrayName=\"items\" class=\"col-12\">\n              <div *ngFor=\"let item of guidesItems.controls; let i = index\" [formGroupName]=\"i\" class=\"row border p-3 mb-3\">\n                <pw-input-container label=\"Title\" class=\"col-md-6\">\n                  <input type=\"text\" class=\"form-control\" formControlName=\"title\" />\n                </pw-input-container>\n\n                <pw-input-container label=\"Description\" class=\"col-md-6\">\n                  <input type=\"text\" class=\"form-control\" formControlName=\"description\" />\n                </pw-input-container>\n\n                <pw-input-container label=\"Button Text\" class=\"col-md-6\">\n                  <input type=\"text\" class=\"form-control\" formControlName=\"button_text\" />\n                </pw-input-container>\n\n                <pw-input-container label=\"Image URL\" class=\"col-md-6\">\n                  <input type=\"text\" class=\"form-control\" formControlName=\"image_url\" />\n                </pw-input-container>\n\n                <pw-input-container label=\"Guide URL\" class=\"col-md-6\">\n                  <input type=\"text\" class=\"form-control\" formControlName=\"guide_url\" />\n                </pw-input-container>\n\n                <div class=\"col-md-1 d-flex align-items-center mt-3\">\n                  <i\n                    class=\"fa fa-trash delete-icon\"\n                    (click)=\"removeGuideItem(i)\"\n                    (keydown.enter)=\"removeGuideItem(i)\"\n                    (keydown.space)=\"removeGuideItem(i)\"\n                    ngbTooltip=\"Remove Guide\"\n                    aria-hidden=\"true\"\n                  ></i>\n                </div>\n              </div>\n\n              <div class=\"text-start mt-2\">\n                <button type=\"button\" class=\"btn btn-primary\" (click)=\"addGuideItem()\">+ Add Guide</button>\n              </div>\n            </div>\n          </div>\n        </p-accordionTab>\n\n\n\n\n        <p-accordionTab [header]=\"'Coming soon pages - Subscribe to newsletter (TO DISCONTINUE)'\">\n          <div class=\"mb-3\">\n            <p>ComingSoon Pages will enable users to subscribe to Newsletters and are accessible at the internal paths\n              /join/cs1, /join/cs2, etc.</p>\n          </div>\n          <!-- live page link -->\n          <div class=\"text-end\" *ngIf=\"shardUrl\">\n            <span>See the live page <span class=\"tooltip-wrap ms-1\" [appendTo]=\"'body'\"\n                [pTooltip]=\"'Admin.DomainConfig.Tooltip.SeeLiveCs' | transloco\" tooltipPosition=\"top\">\n                <i class=\"fas fa-info-circle\"></i>\n              </span> : <a [href]=\"shardUrl + '/join/cs1'\" target=\"_blank\">{{ shardUrl }}/join/cs1</a></span>\n          </div>\n          <div class=\"row\">\n            <div class=\"col-12 col-sm-3\">\n              <pw-input-container [label]=\"'Admin.DomainConfig.CsProduct' | transloco\" [showTooltip]=\"true\"\n                [tooltipText]=\"'Admin.DomainConfig.Tooltip.CsProduct' | transloco\" name=\"cs_product_id\">\n                <p-autoComplete [suggestions]=\"productsList\" formControlName=\"cs_product_id\" dataKey=\"id\" field=\"name\"\n                  [dropdown]=\"true\" [delay]=\"1000\" (completeMethod)=\"searchProduct($event)\" styleClass=\"w-100\"\n                  placeholder=\"Search Product\" [inputStyle]=\"\n                                                form.get('cs_product_id').touched &&\n                                                form.get('cs_product_id').invalid\n                                                    ? { border: '1px solid #ff586b' }\n                                                    : { border: '1px solid gray' }\n                                            \" [multiple]=\"false\">\n                </p-autoComplete>\n              </pw-input-container>\n            </div>\n            <div class=\"col-12 col-sm-3\">\n              <pw-input-container [label]=\"'Admin.DomainConfig.CsCrmSourceId' | transloco\" name=\"cs_crm_source_id\"\n                [showTooltip]=\"true\" [tooltipText]=\"'Admin.DomainConfig.Tooltip.CsCrmSourceId' | transloco\">\n                <p-dropdown [options]=\"crmSourcesList\" formControlName=\"cs_crm_source_id\"\n                  [ngClass]=\"{ 'is-invalid': submitted && f['cs_crm_source_id']?.errors }\" [placeholder]=\"'Select CRM Source'\"\n                  optionValue=\"id\" optionLabel=\"name\">\n                </p-dropdown>\n              </pw-input-container>\n            </div>\n            <div class=\"col-12 col-sm-3\">\n              <pw-input-container [label]=\"'Admin.DomainConfig.CsPdfSourceId' | transloco\" name=\"cs_pdf_source_id\"\n                [showTooltip]=\"true\" [tooltipText]=\"'Admin.DomainConfig.Tooltip.CsPdfSourceId' | transloco\">\n                <p-dropdown [options]=\"crmSourcesList\" formControlName=\"cs_pdf_source_id\"\n                  [ngClass]=\"{ 'is-invalid': submitted && f['cs_pdf_source_id']?.errors }\" [placeholder]=\"'Select CRM Source'\"\n                  optionValue=\"id\" optionLabel=\"name\">\n                </p-dropdown>\n              </pw-input-container>\n            </div>\n            <div class=\"col-12 col-sm-3\"></div>\n            <div class=\"col-12 col-sm-3\">\n              <pw-input-container [label]=\"'Admin.DomainConfig.CsVideoUrl' | transloco\" name=\"cs_video_url\" [showTooltip]=\"true\"\n                [tooltipText]=\"'Admin.DomainConfig.Tooltip.CsVideoUrl' | transloco\">\n                <input type=\"text\" class=\"form-control\" formControlName=\"cs_video_url\"\n                  [ngClass]=\"{ 'is-invalid': submitted && f['cs_video_url'].errors }\" />\n              </pw-input-container>\n            </div>\n            <div class=\"col-12 col-sm-3\">\n              <pw-input-container [label]=\"'Admin.DomainConfig.CsBookDemoUrl' | transloco\" name=\"cs_book_demo_url\"\n                [showTooltip]=\"true\" [tooltipText]=\"'Admin.DomainConfig.Tooltip.CsBookDemoUrl' | transloco\">\n                <input type=\"text\" class=\"form-control\" formControlName=\"cs_book_demo_url\"\n                  [ngClass]=\"{ 'is-invalid': submitted && f['cs_book_demo_url'].errors }\" />\n              </pw-input-container>\n            </div>\n            <div class=\"col-12\">\n              <pw-input-container [label]=\"'Admin.DomainConfig.CsCtaIframe' | transloco\" name=\"cs_cta_iframe\"\n                [showTooltip]=\"true\" [tooltipText]=\"'Admin.DomainConfig.Tooltip.CsCtaIframe' | transloco\">\n                <textarea class=\"form-control\" rows=\"3\" formControlName=\"cs_cta_iframe\"\n                  [ngClass]=\"{ 'is-invalid': submitted && f['cs_cta_iframe'].errors }\">\n                                        </textarea>\n              </pw-input-container>\n            </div>\n            <div class=\"col-12\">\n              <pw-input-container [label]=\"'Admin.DomainConfig.CsJoinMessage' | transloco\" name=\"cs_join_message\"\n                [showTooltip]=\"true\" [tooltipText]=\"'Admin.DomainConfig.Tooltip.CsJoinMessage' | transloco\">\n                <textarea class=\"form-control\" rows=\"3\" formControlName=\"cs_join_message\"\n                  [ngClass]=\"{ 'is-invalid': submitted && f['cs_join_message'].errors }\">\n                                        </textarea>\n              </pw-input-container>\n            </div>\n            <div class=\"col-12\">\n              <pw-input-container [label]=\"'Admin.DomainConfig.CsPdfDownloadText' | transloco\" name=\"cs_pdf_download_text\"\n                [showTooltip]=\"true\" [tooltipText]=\"\n                                            'Admin.DomainConfig.Tooltip.CsPdfDownloadText' | transloco\n                                        \">\n                <textarea class=\"form-control\" rows=\"3\" formControlName=\"cs_pdf_download_text\" [ngClass]=\"{\n                                                'is-invalid': submitted && f['cs_pdf_download_text'].errors\n                                            }\">\n                                        </textarea>\n              </pw-input-container>\n            </div>\n          </div>\n          <div class=\"row\" matchHeight=\"card\">\n            <div class=\"col-md-4\">\n              <label for=\"cs_image\">{{ 'Admin.DomainConfig.CsImage' | transloco }} <span class=\"info-circle\">\n                  <span class=\"tooltiptext gradient-custom-branding\">{{ 'Admin.DomainConfig.Tooltip.CsImage' | transloco\n                    }}</span>\n                </span>\n              </label>\n              <pw-custom-uploader (saveEvent)=\"onSaveFile($event)\" [aspectRatio]=\"'custom'\" [title]=\"'Cs Image'\"\n                [controlName]=\"'cs_image'\" [previewData]=\"data['cs_image']\">\n              </pw-custom-uploader>\n            </div>\n            <div class=\"col-md-4\">\n              <label for=\"cs_image2\">{{ 'Admin.DomainConfig.CsImage2' | transloco }} <span class=\"info-circle\">\n                  <span class=\"tooltiptext gradient-custom-branding\">{{ 'Admin.DomainConfig.Tooltip.CsImage2' | transloco\n                    }}</span>\n                </span>\n              </label>\n              <pw-custom-uploader (saveEvent)=\"onSaveFile($event)\" [aspectRatio]=\"'custom'\" [title]=\"'Cs Image2'\"\n                [controlName]=\"'cs_image2'\" [previewData]=\"data['cs_image2']\">\n              </pw-custom-uploader>\n            </div>\n            <div class=\"col-md-4\">\n              <label for=\"cs_pdf_image\">{{ 'Admin.DomainConfig.CsPdfImage' | transloco }} <span class=\"info-circle\">\n                  <span class=\"tooltiptext gradient-custom-branding\">{{ 'Admin.DomainConfig.Tooltip.CsPdfImage' | transloco\n                    }}</span>\n                </span>\n              </label>\n              <pw-custom-uploader (saveEvent)=\"onSaveFile($event)\" [aspectRatio]=\"'custom'\" [title]=\"'Cs Pdf Image'\"\n                [controlName]=\"'cs_pdf_image'\" [previewData]=\"data['cs_pdf_image']\">\n              </pw-custom-uploader>\n            </div>\n            <div class=\"col-md-4\">\n              <label for=\"cs_image_bg\">{{ 'Admin.DomainConfig.CsImageBg' | transloco }} <span class=\"info-circle\">\n                  <span class=\"tooltiptext gradient-custom-branding\">{{ 'Admin.DomainConfig.Tooltip.CsImageBg' | transloco\n                    }}</span>\n                </span>\n              </label>\n              <pw-custom-uploader (saveEvent)=\"onSaveFile($event)\" [aspectRatio]=\"'custom'\" [title]=\"'Cs Pdf Image Bg'\"\n                [controlName]=\"'cs_image_bg'\" [previewData]=\"data['cs_image_bg']\">\n              </pw-custom-uploader>\n            </div>\n            <div class=\"col-md-4\">\n              <label for=\"cs_image_bg2\">{{ 'Admin.DomainConfig.CsImageBg2' | transloco }} <span class=\"info-circle\">\n                  <span class=\"tooltiptext gradient-custom-branding\">{{ 'Admin.DomainConfig.Tooltip.CsImageBg2' | transloco\n                    }}</span>\n                </span>\n              </label>\n              <pw-custom-uploader (saveEvent)=\"onSaveFile($event)\" [aspectRatio]=\"'custom'\" [title]=\"'Cs Pdf Image Bg2'\"\n                [controlName]=\"'cs_image_bg2'\" [previewData]=\"data['cs_image_bg2']\">\n              </pw-custom-uploader>\n            </div>\n          </div>\n        </p-accordionTab>\n      </p-accordion>\n    </div>\n\n    <div class=\"col-12 text-end mt-3\">\n      <button type=\"button\"\n        class=\"btn btn-outline-default me-2\"\n        (click)=\"back()\">\n        {{ 'Button.Cancel' | transloco }}\n      </button>\n      <button type=\"submit\" [buttonBusy]=\"buttonBusy\"\n        class=\"btn btn-primary\">{{ 'Button.Submit' | transloco }}</button>\n    </div>\n  </form>\n</ng-container>\n<div *ngIf=\"!data?.host_name && !isLoading\">\n  <pw-no-data [withImage]=\"true\" [message]=\"'Admin.DomainConfig.EnableConfigTab' | transloco\"> </pw-no-data>\n</div>\n\n\n<ng-template #partnerCropper let-modal>\n  <div class=\"modal-header\">\n    <h5 class=\"modal-title\">Upload Partner Image</h5>\n    <button type=\"button\" class=\"btn-close\" aria-label=\"Close\" (click)=\"modal.dismiss()\"></button>\n  </div>\n  <div class=\"modal-body\">\n    <small>You can upload JPG, PNG, or GIF files. Avoid images with celebrities, nudity, or artwork.</small>\n    <pw-image-cropper\n      aspectRatio=\"auto\"\n      (imageSelectionEvent)=\"onPartnerImageSelected($event)\"\n      (closeEvent)=\"onClosePartnerModal()\"\n    ></pw-image-cropper>\n  </div>\n</ng-template>\n" }]
         }], ctorParameters: () => [{ type: i0.Injector }, { type: i1.AdminService }, { type: i1$2.ProductService }, { type: i1$1.NgbModal }, { type: i3$2.FormBuilder }], propDecorators: { uploader: [{
                 type: ViewChildren,
                 args: [CustomUploaderComponent]
@@ -5191,6 +5321,7 @@ class ResourceAdminDetailsComponent extends AppBaseComponent {
         this.tagsSuggestion = [];
         this.selectedTags = [];
         this.isLoading = true;
+        this.routers = ROUTERS;
         QuillHelper.init();
         this.editorConfig = QuillHelper.getEditorConfig();
         this.form = AppAdmin.getResourcesForm();
@@ -5199,6 +5330,7 @@ class ResourceAdminDetailsComponent extends AppBaseComponent {
         HelperService.subscribeToEditorChanges(this.form, 'body');
     }
     ngOnInit() {
+        this.filterData = history.state;
         this.isBlogAdmin = this.permissionService.evaluatePermissions(`${PermissionService.selectedProduct?.permission}.${PermissionService.selectedProduct?.feature_key}.Blog.Admin`);
         if (!this.isBlogAdmin) {
             this.form.get('accepted_at').disable();
@@ -5375,7 +5507,11 @@ class ResourceAdminDetailsComponent extends AppBaseComponent {
             .updatePost(data, this.id)
             .subscribe(() => {
             this.toast.success(this.translation.translate('Resource.UpdatedMessage'));
-            this.back();
+            this.router.navigate(['/' + this.routers.resourcesList], {
+                state: {
+                    ...this.filterData
+                }
+            });
         })
             .add(() => {
             this.submitted = false;
@@ -5481,6 +5617,12 @@ class ResourcesIndexComponent extends AppBaseComponent {
         this.routers = ROUTERS;
     }
     ngOnInit() {
+        const state = history.state;
+        if (state) {
+            this.selectedTags = Array.isArray(state.selectedTags) ? state.selectedTags : [];
+            this.searchTextItems =
+                typeof state.searchTextItems === 'string' ? state.searchTextItems : '';
+        }
         this.getUserSubscriptionId().subscribe(_ => {
             this.blogPermission = `${PermissionService.selectedProduct?.permission}.${PermissionService.selectedProduct?.feature_key}.Blog`;
             this.isBlogAdmin = `${PermissionService.selectedProduct?.permission}.${PermissionService.selectedProduct?.feature_key}.Blog.Admin`;
@@ -5521,6 +5663,7 @@ class ResourcesIndexComponent extends AppBaseComponent {
             page_size: PAGE_SIZE,
             order_by: pageDetails.sortField,
             order_direction: pageDetails.sortOrder,
+            tag_id: this.selectedTags.join(','),
             search: this.searchTextItems
         });
     }
@@ -5544,6 +5687,15 @@ class ResourcesIndexComponent extends AppBaseComponent {
             });
         }
     }
+    navigateToEdit(item) {
+        this.router.navigate(['/' + this.routers.posts + item.slug], {
+            state: {
+                selectedTags: this.selectedTags,
+                searchTextItems: this.searchTextItems,
+                page: this.page
+            }
+        });
+    }
     onDeletePost(item) {
         swal.fire({
             title: 'Delete',
@@ -5568,11 +5720,11 @@ class ResourcesIndexComponent extends AppBaseComponent {
         super.ngOnDestroy();
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.11", ngImport: i0, type: ResourcesIndexComponent, deps: [{ token: i1.AdminService }, { token: i1$2.TagService }, { token: i0.Injector }, { token: i0.ChangeDetectorRef }], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.3.11", type: ResourcesIndexComponent, selector: "pw-resources-index", usesInheritance: true, ngImport: i0, template: "\n<div class=\"row\">\n  <div class=\"col-12 d-flex flex-wrap justify-content-between align-items-center\">\n    <h2 class=\"card-title p-0 float-start\">{{'Resource.Posts.Title' | transloco}}</h2>\n    <button *rbacAllow=\"blogPermission\"\n      class=\"btn btn-sm btn-outline-primary float-end\"\n      [routerLink]=\"['/' + routers.createResource]\">\n      <i class=\"fa fa-plus-circle\" aria-hidden=\"true\"></i> {{'Resource.Add' | transloco}}\n    </button>\n  </div>\n  </div>\n  <div class=\"col-12 mb-3\">\n    <p [innerHTML]=\"'Resource.Description' | transloco\"></p>\n  </div>\n\n<div class=\"w-100 text-center mt-3\"\n  *ngIf=\"!isLoaded\">\n  <p-progressSpinner strokeWidth=\"2\"> </p-progressSpinner>\n</div>\n<div class=\"primeng-datatable-container table-responsive\"\n  [class.hideTable]=\"data.unfiltered_count === 0\">\n  <p-table #dt\n    [value]=\"data.posts\"\n    [paginator]=\"data.object_count !== 0\"\n    [lazy]=\"true\"\n    [rows]=\"PAGE_SIZE\"\n    [totalRecords]=\"data.object_count\"\n    [loading]=\"loading\"\n    [filterDelay]=\"1000\"\n    (onLazyLoad)=\"onLazyLoad($event)\">\n    <ng-template pTemplate=\"caption\">\n      <div class=\"search-filter\">\n        <div class=\"col-sm-4\">\n          <p-multiSelect\n            [showToggleAll]=\"true\"\n            [options]=\"tagOptions\"\n            [(ngModel)]=\"selectedTags\"\n            (onChange)=\"onTagChange($event)\"\n            placeholder=\"Search by Tags\"\n            [showHeader]=\"true\"\n            maxSelectedLabels=\"2\"\n            appendTo=\"body\">\n          </p-multiSelect>\n        </div>\n        <div class=\"text-end\">\n          <i class=\"fa fa-search mt-2 me-2\" aria-hidden=\"true\"></i>\n          <input type=\"text\"\n            [(ngModel)]=\"searchTextItems\"\n            pInputText\n            size=\"50\"\n            placeholder=\"Search Resources...\"\n            (input)=\"dt.filterGlobal($event.target.value, 'contains')\"\n            style=\"max-width: 90%\" />\n        </div>\n      </div>\n    </ng-template>\n    <ng-template pTemplate=\"header\">\n      <tr>\n        <th scope=\"true\">{{ 'Resource.Posts.Author' | transloco }}</th>\n        <th scope=\"true\"\n          pSortableColumn=\"title\">\n          {{ 'Label.Title' | transloco }}\n          <p-sortIcon field=\"title\"></p-sortIcon>\n        </th>\n        <th scope=\"true\">\n          {{ 'Resource.Posts.Tags' | transloco }}\n        </th>\n        <th scope=\"true\"\n          pSortableColumn=\"showcase\">\n          {{ 'Resource.Posts.Showcase' | transloco }}\n          <p-sortIcon field=\"showcase\"></p-sortIcon>\n        </th>\n        <th scope=\"true\"\n          pSortableColumn=\"when\">\n          {{ 'Resource.Posts.When' | transloco }}\n          <p-sortIcon field=\"when\"></p-sortIcon>\n        </th>\n        <th scope=\"true\"\n          pSortableColumn=\"published_at\">\n          {{ 'Resource.Posts.PublishedAt' | transloco }}\n          <p-sortIcon field=\"published_at\"></p-sortIcon>\n        </th>\n        <th scope=\"true\"\n          pSortableColumn=\"accepted_at\">\n          {{ 'Resource.Posts.AcceptedAt' | transloco }}\n          <p-sortIcon field=\"accepted_at\"></p-sortIcon>\n        </th>\n        <th scope=\"true\"\n          pSortableColumn=\"view\">\n          {{ 'Resource.Posts.View' | transloco }}\n          <p-sortIcon field=\"view\"></p-sortIcon>\n        </th>\n        <th 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=\"Title\">\n          <a [routerLink]=\"['/members', item.author?.slug]\"\n            class=\"d-flex align-items-center\">\n            <img *ngIf=\"item.author?.avatar\"\n              [src]=\"item.author?.avatar[0].url\"\n              alt=\"author\"\n              width=\"25\"\n              class=\"img-fluid\" />\n            <img *ngIf=\"!item.author?.avatar\"\n              src=\"assets/img/icons/male.png\"\n              alt=\"author\"\n              width=\"25\"\n              class=\"img-fluid\" />\n            <span class=\"ms-2\">{{ item.author | ifNameNullShowEmail }}</span>\n          </a>\n        </td>\n        <td data-head=\"Title\">\n          <a [routerLink]=\"['/resources/view', item?.slug]\"\n            target=\"_blank\">{{ item.title }}</a>\n        </td>\n        <td data-head=\"tags\">\n          <span *ngFor=\"let tag of item?.tags?.slice(0, 3)\"\n                class=\"badge m-1\"\n                [appDynamicBadge]=\"{ itemsArray: item?.tags, item: tag }\"\n                [colorByName]=\"true\"\n                [dataName]=\"tag.name\"\n                color=\"cyan\">{{ tag.name }}</span>\n\n          <span *ngIf=\"item.expandedTags\">\n            <span *ngFor=\"let tag of item?.tags?.slice(3)\"\n                  class=\"badge m-1\"\n                  [appDynamicBadge]=\"{ itemsArray: item?.tags, item: tag }\"\n                  [colorByName]=\"true\"\n                  [dataName]=\"tag.name\"\n                  color=\"cyan\" >{{ tag.name }}</span>\n          </span>\n\n          <span *ngIf=\"item?.tags?.length > 3\" class=\"fw-bold\">\n            <a (click)=\"item.expandedTags = !item.expandedTags\">\n              <span>...</span>\n            </a>\n          </span>\n        </td>\n\n        <td data-head=\"showcase\">\n          <span [appDynamicBadge]=\"{ itemsArray: [true, false], item: item?.showcase }\"\n          [ngClass]=\"item?.showcase ? 'bg-success' : 'bg-secondary'\"\n            class=\"badge\">{{ !!item?.showcase }}</span>\n        </td>\n        <td data-head=\"when\">{{ item.when | dateFormat }}</td>\n        <td data-head=\"Published At\">{{ item.published_at | dateFormat }}</td>\n        <td data-head=\"Accepted At\">{{ item.accepted_at | dateFormat }}</td>\n        <td data-head=\"View\">{{ item.view }}</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              *rbacAllow=\"blogPermission\"\n              [routerLink]=\"['/' + routers.posts + item?.slug]\">\n              <i class=\"fa fa-edit edit-icon\" aria-hidden=\"true\"></i>\n            </li>\n            <li ngbTooltip=\"Delete\"\n              class=\"me-2 me-sm-3\"\n              *rbacAllow=\"blogPermission\"\n              (keydown.enter)=\"onDeletePost(item)\"\n              (click)=\"onDeletePost(item)\">\n              <i class=\"fa fa-trash delete-icon\" aria-hidden=\"true\"></i>\n            </li>\n            <li ngbTooltip=\"Insight\"\n              class=\"me-2 me-sm-3\"\n              *rbacAllow=\"isBlogAdmin\"\n              [routerLink]=\"[\n                                '/' + routers.resourcesList + item.id + '/insight'\n                            ]\"\n              [queryParams]=\"{ insight_name: item?.title }\">\n              <i class=\"fa fa-fw fa-list fa-lg\" aria-hidden=\"true\"></i>\n            </li>\n          </ul>\n        </td>\n      </tr>\n    </ng-template>\n  </p-table>\n  <span *ngIf=\"data.object_count !== 0\" class=\"total-records-count\">{{ 'Label.Total' | transloco }}: {{  data.object_count }}</span>\n  <div *ngIf=\"data.object_count === 0 && isLoaded\">\n    <pw-no-data [withImage]=\"true\" [message]=\"'Search.NoDataMessage'| transloco\" [description]=\"'Search.NoDataDescription' | transloco\"  >\n    </pw-no-data>\n  </div>\n</div>\n<div class=\"col-12 text-center\">\n  <pw-no-data [withImage]=\"true\" [message]=\"'Resource.Posts.NoDataMessage' | transloco\"\n    *ngIf=\"data.unfiltered_count === 0 && isLoaded\">\n  </pw-no-data>\n</div>\n", dependencies: [{ kind: "component", type: i2.Table, selector: "p-table", inputs: ["frozenColumns", "frozenValue", "style", "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", "scrollDirection", "rowGroupMode", "scrollHeight", "virtualScroll", "virtualScrollItemSize", "virtualScrollOptions", "virtualScrollDelay", "frozenWidth", "responsive", "contextMenu", "resizableColumns", "columnResizeMode", "reorderableColumns", "loading", "loadingIcon", "showLoader", "rowHover", "customSort", "showInitialSortBadge", "autoLayout", "exportFunction", "exportHeader", "stateKey", "stateStorage", "editMode", "groupRowsBy", "groupRowsByOrder", "responsiveLayout", "breakpoint", "paginatorLocale", "value", "columns", "first", "rows", "totalRecords", "sortField", "sortOrder", "multiSortMeta", "selection", "selectAll", "virtualRowHeight"], 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$3.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: i4$4.MultiSelect, selector: "p-multiSelect", inputs: ["id", "ariaLabel", "style", "styleClass", "panelStyle", "panelStyleClass", "inputId", "disabled", "readonly", "group", "filter", "filterPlaceHolder", "filterLocale", "overlayVisible", "tabindex", "variant", "appendTo", "dataKey", "name", "ariaLabelledBy", "displaySelectedLabel", "maxSelectedLabels", "selectionLimit", "selectedItemsLabel", "showToggleAll", "emptyFilterMessage", "emptyMessage", "resetFilterOnHide", "dropdownIcon", "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", "autoZIndex", "baseZIndex", "showTransitionOptions", "hideTransitionOptions", "defaultLabel", "placeholder", "options", "filterValue", "itemSize", "selectAll", "focusOnHover", "filterFields", "selectOnFocus", "autoOptionFocus"], outputs: ["onChange", "onFilter", "onFocus", "onBlur", "onClick", "onClear", "onPanelShow", "onPanelHide", "onLazyLoad", "onRemove", "onSelectAllChange"] }, { kind: "directive", type: i4$1.InputText, selector: "[pInputText]", inputs: ["variant"] }, { kind: "directive", type: i3$1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i3$1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i3$1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i3$2.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: i3$2.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i3$2.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "directive", type: i7.RouterLink, selector: "[routerLink]", inputs: ["target", "queryParams", "fragment", "queryParamsHandling", "state", "info", "relativeTo", "preserveFragment", "skipLocationChange", "replaceUrl", "routerLink"] }, { kind: "component", type: i5.ProgressSpinner, selector: "p-progressSpinner", inputs: ["styleClass", "style", "strokeWidth", "fill", "animationDuration", "ariaLabel"] }, { kind: "component", type: i9.NoDataComponent, selector: "pw-no-data", inputs: ["message", "description", "withImage"] }, { kind: "directive", type: i10.DynamicBadgeDirective, selector: "[appDynamicBadge]", inputs: ["appDynamicBadge", "color", "colorByName", "dataName"] }, { kind: "directive", type: i10.LazyImgDirective, selector: "img" }, { kind: "directive", type: i10.RbacAllowDirective, selector: "[rbacAllow]", inputs: ["rbacAllow"] }, { kind: "directive", type: i1$1.NgbTooltip, selector: "[ngbTooltip]", inputs: ["animation", "autoClose", "placement", "popperOptions", "triggers", "positionTarget", "container", "disableTooltip", "tooltipClass", "tooltipContext", "openDelay", "closeDelay", "ngbTooltip"], outputs: ["shown", "hidden"], exportAs: ["ngbTooltip"] }, { kind: "pipe", type: i12.TranslocoPipe, name: "transloco" }, { kind: "pipe", type: i13.DateFormatPipe, name: "dateFormat" }, { kind: "pipe", type: i13.IfNameNullShowEmailPipe, name: "ifNameNullShowEmail" }] }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.3.11", type: ResourcesIndexComponent, selector: "pw-resources-index", usesInheritance: true, ngImport: i0, template: "\n<div class=\"row\">\n  <div class=\"col-12 d-flex flex-wrap justify-content-between align-items-center\">\n    <h2 class=\"card-title p-0 float-start\">{{'Resource.Posts.Title' | transloco}}</h2>\n    <button *rbacAllow=\"blogPermission\"\n      class=\"btn btn-sm btn-outline-primary float-end\"\n      [routerLink]=\"['/' + routers.createResource]\">\n      <i class=\"fa fa-plus-circle\" aria-hidden=\"true\"></i> {{'Resource.Add' | transloco}}\n    </button>\n  </div>\n  </div>\n  <div class=\"col-12 mb-3\">\n    <p [innerHTML]=\"'Resource.Description' | transloco\"></p>\n  </div>\n\n<div class=\"w-100 text-center mt-3\"\n  *ngIf=\"!isLoaded\">\n  <p-progressSpinner strokeWidth=\"2\"> </p-progressSpinner>\n</div>\n<div class=\"primeng-datatable-container table-responsive\"\n  [class.hideTable]=\"data.unfiltered_count === 0\">\n  <p-table #dt\n    [value]=\"data.posts\"\n    [paginator]=\"data.object_count !== 0\"\n    [lazy]=\"true\"\n    [rows]=\"PAGE_SIZE\"\n    [totalRecords]=\"data.object_count\"\n    [loading]=\"loading\"\n    [filterDelay]=\"1000\"\n    (onLazyLoad)=\"onLazyLoad($event)\">\n    <ng-template pTemplate=\"caption\">\n      <div class=\"search-filter\">\n        <div class=\"col-sm-4\">\n          <p-multiSelect\n            [showToggleAll]=\"true\"\n            [options]=\"tagOptions\"\n            [(ngModel)]=\"selectedTags\"\n            (onChange)=\"onTagChange($event)\"\n            placeholder=\"Search by Tags\"\n            [showHeader]=\"true\"\n            maxSelectedLabels=\"2\"\n            appendTo=\"body\">\n          </p-multiSelect>\n        </div>\n        <div class=\"text-end\">\n          <i class=\"fa fa-search mt-2 me-2\" aria-hidden=\"true\"></i>\n          <input type=\"text\"\n            [(ngModel)]=\"searchTextItems\"\n            pInputText\n            size=\"50\"\n            placeholder=\"Search Resources...\"\n            (input)=\"dt.filterGlobal($event.target.value, 'contains')\"\n            style=\"max-width: 90%\" />\n        </div>\n      </div>\n    </ng-template>\n    <ng-template pTemplate=\"header\">\n      <tr>\n        <th scope=\"true\">{{ 'Resource.Posts.Author' | transloco }}</th>\n        <th scope=\"true\"\n          pSortableColumn=\"title\">\n          {{ 'Label.Title' | transloco }}\n          <p-sortIcon field=\"title\"></p-sortIcon>\n        </th>\n        <th scope=\"true\">\n          {{ 'Resource.Posts.Tags' | transloco }}\n        </th>\n        <th scope=\"true\"\n          pSortableColumn=\"showcase\">\n          {{ 'Resource.Posts.Showcase' | transloco }}\n          <p-sortIcon field=\"showcase\"></p-sortIcon>\n        </th>\n        <th scope=\"true\"\n          pSortableColumn=\"when\">\n          {{ 'Resource.Posts.When' | transloco }}\n          <p-sortIcon field=\"when\"></p-sortIcon>\n        </th>\n        <th scope=\"true\"\n          pSortableColumn=\"published_at\">\n          {{ 'Resource.Posts.PublishedAt' | transloco }}\n          <p-sortIcon field=\"published_at\"></p-sortIcon>\n        </th>\n        <th scope=\"true\"\n          pSortableColumn=\"accepted_at\">\n          {{ 'Resource.Posts.AcceptedAt' | transloco }}\n          <p-sortIcon field=\"accepted_at\"></p-sortIcon>\n        </th>\n        <th scope=\"true\"\n          pSortableColumn=\"view\">\n          {{ 'Resource.Posts.View' | transloco }}\n          <p-sortIcon field=\"view\"></p-sortIcon>\n        </th>\n        <th 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=\"Title\">\n          <a [routerLink]=\"['/members', item.author?.slug]\"\n            class=\"d-flex align-items-center\">\n            <img *ngIf=\"item.author?.avatar\"\n              [src]=\"item.author?.avatar[0].url\"\n              alt=\"author\"\n              width=\"25\"\n              class=\"img-fluid\" />\n            <img *ngIf=\"!item.author?.avatar\"\n              src=\"assets/img/icons/male.png\"\n              alt=\"author\"\n              width=\"25\"\n              class=\"img-fluid\" />\n            <span class=\"ms-2\">{{ item.author | ifNameNullShowEmail }}</span>\n          </a>\n        </td>\n        <td data-head=\"Title\">\n          <a [routerLink]=\"['/resources/view', item?.slug]\"\n            target=\"_blank\">{{ item.title }}</a>\n        </td>\n        <td data-head=\"tags\">\n          <span *ngFor=\"let tag of item?.tags?.slice(0, 3)\"\n                class=\"badge m-1\"\n                [appDynamicBadge]=\"{ itemsArray: item?.tags, item: tag }\"\n                [colorByName]=\"true\"\n                [dataName]=\"tag.name\"\n                color=\"cyan\">{{ tag.name }}</span>\n\n          <span *ngIf=\"item.expandedTags\">\n            <span *ngFor=\"let tag of item?.tags?.slice(3)\"\n                  class=\"badge m-1\"\n                  [appDynamicBadge]=\"{ itemsArray: item?.tags, item: tag }\"\n                  [colorByName]=\"true\"\n                  [dataName]=\"tag.name\"\n                  color=\"cyan\" >{{ tag.name }}</span>\n          </span>\n\n          <span *ngIf=\"item?.tags?.length > 3\" class=\"fw-bold\">\n            <a (click)=\"item.expandedTags = !item.expandedTags\">\n              <span>...</span>\n            </a>\n          </span>\n        </td>\n\n        <td data-head=\"showcase\">\n          <span [appDynamicBadge]=\"{ itemsArray: [true, false], item: item?.showcase }\"\n          [ngClass]=\"item?.showcase ? 'bg-success' : 'bg-secondary'\"\n            class=\"badge\">{{ !!item?.showcase }}</span>\n        </td>\n        <td data-head=\"when\">{{ item.when | dateFormat }}</td>\n        <td data-head=\"Published At\">{{ item.published_at | dateFormat }}</td>\n        <td data-head=\"Accepted At\">{{ item.accepted_at | dateFormat }}</td>\n        <td data-head=\"View\">{{ item.view }}</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              *rbacAllow=\"blogPermission\"\n              (click)=\"navigateToEdit(item)\">\n              <i class=\"fa fa-edit edit-icon\" aria-hidden=\"true\"></i>\n            </li>\n            <li ngbTooltip=\"Delete\"\n              class=\"me-2 me-sm-3\"\n              *rbacAllow=\"blogPermission\"\n              (keydown.enter)=\"onDeletePost(item)\"\n              (click)=\"onDeletePost(item)\">\n              <i class=\"fa fa-trash delete-icon\" aria-hidden=\"true\"></i>\n            </li>\n            <li ngbTooltip=\"Insight\"\n              class=\"me-2 me-sm-3\"\n              *rbacAllow=\"isBlogAdmin\"\n              [routerLink]=\"[\n                                '/' + routers.resourcesList + item.id + '/insight'\n                            ]\"\n              [queryParams]=\"{ insight_name: item?.title }\">\n              <i class=\"fa fa-fw fa-list fa-lg\" aria-hidden=\"true\"></i>\n            </li>\n          </ul>\n        </td>\n      </tr>\n    </ng-template>\n  </p-table>\n  <span *ngIf=\"data.object_count !== 0\" class=\"total-records-count\">{{ 'Label.Total' | transloco }}: {{  data.object_count }}</span>\n  <div *ngIf=\"data.object_count === 0 && isLoaded\">\n    <pw-no-data [withImage]=\"true\" [message]=\"'Search.NoDataMessage'| transloco\" [description]=\"'Search.NoDataDescription' | transloco\"  >\n    </pw-no-data>\n  </div>\n</div>\n<div class=\"col-12 text-center\">\n  <pw-no-data [withImage]=\"true\" [message]=\"'Resource.Posts.NoDataMessage' | transloco\"\n    *ngIf=\"data.unfiltered_count === 0 && isLoaded\">\n  </pw-no-data>\n</div>\n", dependencies: [{ kind: "component", type: i2.Table, selector: "p-table", inputs: ["frozenColumns", "frozenValue", "style", "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", "scrollDirection", "rowGroupMode", "scrollHeight", "virtualScroll", "virtualScrollItemSize", "virtualScrollOptions", "virtualScrollDelay", "frozenWidth", "responsive", "contextMenu", "resizableColumns", "columnResizeMode", "reorderableColumns", "loading", "loadingIcon", "showLoader", "rowHover", "customSort", "showInitialSortBadge", "autoLayout", "exportFunction", "exportHeader", "stateKey", "stateStorage", "editMode", "groupRowsBy", "groupRowsByOrder", "responsiveLayout", "breakpoint", "paginatorLocale", "value", "columns", "first", "rows", "totalRecords", "sortField", "sortOrder", "multiSortMeta", "selection", "selectAll", "virtualRowHeight"], 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$3.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: i4$4.MultiSelect, selector: "p-multiSelect", inputs: ["id", "ariaLabel", "style", "styleClass", "panelStyle", "panelStyleClass", "inputId", "disabled", "readonly", "group", "filter", "filterPlaceHolder", "filterLocale", "overlayVisible", "tabindex", "variant", "appendTo", "dataKey", "name", "ariaLabelledBy", "displaySelectedLabel", "maxSelectedLabels", "selectionLimit", "selectedItemsLabel", "showToggleAll", "emptyFilterMessage", "emptyMessage", "resetFilterOnHide", "dropdownIcon", "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", "autoZIndex", "baseZIndex", "showTransitionOptions", "hideTransitionOptions", "defaultLabel", "placeholder", "options", "filterValue", "itemSize", "selectAll", "focusOnHover", "filterFields", "selectOnFocus", "autoOptionFocus"], outputs: ["onChange", "onFilter", "onFocus", "onBlur", "onClick", "onClear", "onPanelShow", "onPanelHide", "onLazyLoad", "onRemove", "onSelectAllChange"] }, { kind: "directive", type: i4$1.InputText, selector: "[pInputText]", inputs: ["variant"] }, { kind: "directive", type: i3$1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i3$1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i3$1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i3$2.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: i3$2.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i3$2.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "directive", type: i7.RouterLink, selector: "[routerLink]", inputs: ["target", "queryParams", "fragment", "queryParamsHandling", "state", "info", "relativeTo", "preserveFragment", "skipLocationChange", "replaceUrl", "routerLink"] }, { kind: "component", type: i5.ProgressSpinner, selector: "p-progressSpinner", inputs: ["styleClass", "style", "strokeWidth", "fill", "animationDuration", "ariaLabel"] }, { kind: "component", type: i9.NoDataComponent, selector: "pw-no-data", inputs: ["message", "description", "withImage"] }, { kind: "directive", type: i10.DynamicBadgeDirective, selector: "[appDynamicBadge]", inputs: ["appDynamicBadge", "color", "colorByName", "dataName"] }, { kind: "directive", type: i10.LazyImgDirective, selector: "img" }, { kind: "directive", type: i10.RbacAllowDirective, selector: "[rbacAllow]", inputs: ["rbacAllow"] }, { kind: "directive", type: i1$1.NgbTooltip, selector: "[ngbTooltip]", inputs: ["animation", "autoClose", "placement", "popperOptions", "triggers", "positionTarget", "container", "disableTooltip", "tooltipClass", "tooltipContext", "openDelay", "closeDelay", "ngbTooltip"], outputs: ["shown", "hidden"], exportAs: ["ngbTooltip"] }, { kind: "pipe", type: i12.TranslocoPipe, name: "transloco" }, { kind: "pipe", type: i13.DateFormatPipe, name: "dateFormat" }, { kind: "pipe", type: i13.IfNameNullShowEmailPipe, name: "ifNameNullShowEmail" }] }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.11", ngImport: i0, type: ResourcesIndexComponent, decorators: [{
             type: Component,
-            args: [{ selector: 'pw-resources-index', template: "\n<div class=\"row\">\n  <div class=\"col-12 d-flex flex-wrap justify-content-between align-items-center\">\n    <h2 class=\"card-title p-0 float-start\">{{'Resource.Posts.Title' | transloco}}</h2>\n    <button *rbacAllow=\"blogPermission\"\n      class=\"btn btn-sm btn-outline-primary float-end\"\n      [routerLink]=\"['/' + routers.createResource]\">\n      <i class=\"fa fa-plus-circle\" aria-hidden=\"true\"></i> {{'Resource.Add' | transloco}}\n    </button>\n  </div>\n  </div>\n  <div class=\"col-12 mb-3\">\n    <p [innerHTML]=\"'Resource.Description' | transloco\"></p>\n  </div>\n\n<div class=\"w-100 text-center mt-3\"\n  *ngIf=\"!isLoaded\">\n  <p-progressSpinner strokeWidth=\"2\"> </p-progressSpinner>\n</div>\n<div class=\"primeng-datatable-container table-responsive\"\n  [class.hideTable]=\"data.unfiltered_count === 0\">\n  <p-table #dt\n    [value]=\"data.posts\"\n    [paginator]=\"data.object_count !== 0\"\n    [lazy]=\"true\"\n    [rows]=\"PAGE_SIZE\"\n    [totalRecords]=\"data.object_count\"\n    [loading]=\"loading\"\n    [filterDelay]=\"1000\"\n    (onLazyLoad)=\"onLazyLoad($event)\">\n    <ng-template pTemplate=\"caption\">\n      <div class=\"search-filter\">\n        <div class=\"col-sm-4\">\n          <p-multiSelect\n            [showToggleAll]=\"true\"\n            [options]=\"tagOptions\"\n            [(ngModel)]=\"selectedTags\"\n            (onChange)=\"onTagChange($event)\"\n            placeholder=\"Search by Tags\"\n            [showHeader]=\"true\"\n            maxSelectedLabels=\"2\"\n            appendTo=\"body\">\n          </p-multiSelect>\n        </div>\n        <div class=\"text-end\">\n          <i class=\"fa fa-search mt-2 me-2\" aria-hidden=\"true\"></i>\n          <input type=\"text\"\n            [(ngModel)]=\"searchTextItems\"\n            pInputText\n            size=\"50\"\n            placeholder=\"Search Resources...\"\n            (input)=\"dt.filterGlobal($event.target.value, 'contains')\"\n            style=\"max-width: 90%\" />\n        </div>\n      </div>\n    </ng-template>\n    <ng-template pTemplate=\"header\">\n      <tr>\n        <th scope=\"true\">{{ 'Resource.Posts.Author' | transloco }}</th>\n        <th scope=\"true\"\n          pSortableColumn=\"title\">\n          {{ 'Label.Title' | transloco }}\n          <p-sortIcon field=\"title\"></p-sortIcon>\n        </th>\n        <th scope=\"true\">\n          {{ 'Resource.Posts.Tags' | transloco }}\n        </th>\n        <th scope=\"true\"\n          pSortableColumn=\"showcase\">\n          {{ 'Resource.Posts.Showcase' | transloco }}\n          <p-sortIcon field=\"showcase\"></p-sortIcon>\n        </th>\n        <th scope=\"true\"\n          pSortableColumn=\"when\">\n          {{ 'Resource.Posts.When' | transloco }}\n          <p-sortIcon field=\"when\"></p-sortIcon>\n        </th>\n        <th scope=\"true\"\n          pSortableColumn=\"published_at\">\n          {{ 'Resource.Posts.PublishedAt' | transloco }}\n          <p-sortIcon field=\"published_at\"></p-sortIcon>\n        </th>\n        <th scope=\"true\"\n          pSortableColumn=\"accepted_at\">\n          {{ 'Resource.Posts.AcceptedAt' | transloco }}\n          <p-sortIcon field=\"accepted_at\"></p-sortIcon>\n        </th>\n        <th scope=\"true\"\n          pSortableColumn=\"view\">\n          {{ 'Resource.Posts.View' | transloco }}\n          <p-sortIcon field=\"view\"></p-sortIcon>\n        </th>\n        <th 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=\"Title\">\n          <a [routerLink]=\"['/members', item.author?.slug]\"\n            class=\"d-flex align-items-center\">\n            <img *ngIf=\"item.author?.avatar\"\n              [src]=\"item.author?.avatar[0].url\"\n              alt=\"author\"\n              width=\"25\"\n              class=\"img-fluid\" />\n            <img *ngIf=\"!item.author?.avatar\"\n              src=\"assets/img/icons/male.png\"\n              alt=\"author\"\n              width=\"25\"\n              class=\"img-fluid\" />\n            <span class=\"ms-2\">{{ item.author | ifNameNullShowEmail }}</span>\n          </a>\n        </td>\n        <td data-head=\"Title\">\n          <a [routerLink]=\"['/resources/view', item?.slug]\"\n            target=\"_blank\">{{ item.title }}</a>\n        </td>\n        <td data-head=\"tags\">\n          <span *ngFor=\"let tag of item?.tags?.slice(0, 3)\"\n                class=\"badge m-1\"\n                [appDynamicBadge]=\"{ itemsArray: item?.tags, item: tag }\"\n                [colorByName]=\"true\"\n                [dataName]=\"tag.name\"\n                color=\"cyan\">{{ tag.name }}</span>\n\n          <span *ngIf=\"item.expandedTags\">\n            <span *ngFor=\"let tag of item?.tags?.slice(3)\"\n                  class=\"badge m-1\"\n                  [appDynamicBadge]=\"{ itemsArray: item?.tags, item: tag }\"\n                  [colorByName]=\"true\"\n                  [dataName]=\"tag.name\"\n                  color=\"cyan\" >{{ tag.name }}</span>\n          </span>\n\n          <span *ngIf=\"item?.tags?.length > 3\" class=\"fw-bold\">\n            <a (click)=\"item.expandedTags = !item.expandedTags\">\n              <span>...</span>\n            </a>\n          </span>\n        </td>\n\n        <td data-head=\"showcase\">\n          <span [appDynamicBadge]=\"{ itemsArray: [true, false], item: item?.showcase }\"\n          [ngClass]=\"item?.showcase ? 'bg-success' : 'bg-secondary'\"\n            class=\"badge\">{{ !!item?.showcase }}</span>\n        </td>\n        <td data-head=\"when\">{{ item.when | dateFormat }}</td>\n        <td data-head=\"Published At\">{{ item.published_at | dateFormat }}</td>\n        <td data-head=\"Accepted At\">{{ item.accepted_at | dateFormat }}</td>\n        <td data-head=\"View\">{{ item.view }}</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              *rbacAllow=\"blogPermission\"\n              [routerLink]=\"['/' + routers.posts + item?.slug]\">\n              <i class=\"fa fa-edit edit-icon\" aria-hidden=\"true\"></i>\n            </li>\n            <li ngbTooltip=\"Delete\"\n              class=\"me-2 me-sm-3\"\n              *rbacAllow=\"blogPermission\"\n              (keydown.enter)=\"onDeletePost(item)\"\n              (click)=\"onDeletePost(item)\">\n              <i class=\"fa fa-trash delete-icon\" aria-hidden=\"true\"></i>\n            </li>\n            <li ngbTooltip=\"Insight\"\n              class=\"me-2 me-sm-3\"\n              *rbacAllow=\"isBlogAdmin\"\n              [routerLink]=\"[\n                                '/' + routers.resourcesList + item.id + '/insight'\n                            ]\"\n              [queryParams]=\"{ insight_name: item?.title }\">\n              <i class=\"fa fa-fw fa-list fa-lg\" aria-hidden=\"true\"></i>\n            </li>\n          </ul>\n        </td>\n      </tr>\n    </ng-template>\n  </p-table>\n  <span *ngIf=\"data.object_count !== 0\" class=\"total-records-count\">{{ 'Label.Total' | transloco }}: {{  data.object_count }}</span>\n  <div *ngIf=\"data.object_count === 0 && isLoaded\">\n    <pw-no-data [withImage]=\"true\" [message]=\"'Search.NoDataMessage'| transloco\" [description]=\"'Search.NoDataDescription' | transloco\"  >\n    </pw-no-data>\n  </div>\n</div>\n<div class=\"col-12 text-center\">\n  <pw-no-data [withImage]=\"true\" [message]=\"'Resource.Posts.NoDataMessage' | transloco\"\n    *ngIf=\"data.unfiltered_count === 0 && isLoaded\">\n  </pw-no-data>\n</div>\n" }]
+            args: [{ selector: 'pw-resources-index', template: "\n<div class=\"row\">\n  <div class=\"col-12 d-flex flex-wrap justify-content-between align-items-center\">\n    <h2 class=\"card-title p-0 float-start\">{{'Resource.Posts.Title' | transloco}}</h2>\n    <button *rbacAllow=\"blogPermission\"\n      class=\"btn btn-sm btn-outline-primary float-end\"\n      [routerLink]=\"['/' + routers.createResource]\">\n      <i class=\"fa fa-plus-circle\" aria-hidden=\"true\"></i> {{'Resource.Add' | transloco}}\n    </button>\n  </div>\n  </div>\n  <div class=\"col-12 mb-3\">\n    <p [innerHTML]=\"'Resource.Description' | transloco\"></p>\n  </div>\n\n<div class=\"w-100 text-center mt-3\"\n  *ngIf=\"!isLoaded\">\n  <p-progressSpinner strokeWidth=\"2\"> </p-progressSpinner>\n</div>\n<div class=\"primeng-datatable-container table-responsive\"\n  [class.hideTable]=\"data.unfiltered_count === 0\">\n  <p-table #dt\n    [value]=\"data.posts\"\n    [paginator]=\"data.object_count !== 0\"\n    [lazy]=\"true\"\n    [rows]=\"PAGE_SIZE\"\n    [totalRecords]=\"data.object_count\"\n    [loading]=\"loading\"\n    [filterDelay]=\"1000\"\n    (onLazyLoad)=\"onLazyLoad($event)\">\n    <ng-template pTemplate=\"caption\">\n      <div class=\"search-filter\">\n        <div class=\"col-sm-4\">\n          <p-multiSelect\n            [showToggleAll]=\"true\"\n            [options]=\"tagOptions\"\n            [(ngModel)]=\"selectedTags\"\n            (onChange)=\"onTagChange($event)\"\n            placeholder=\"Search by Tags\"\n            [showHeader]=\"true\"\n            maxSelectedLabels=\"2\"\n            appendTo=\"body\">\n          </p-multiSelect>\n        </div>\n        <div class=\"text-end\">\n          <i class=\"fa fa-search mt-2 me-2\" aria-hidden=\"true\"></i>\n          <input type=\"text\"\n            [(ngModel)]=\"searchTextItems\"\n            pInputText\n            size=\"50\"\n            placeholder=\"Search Resources...\"\n            (input)=\"dt.filterGlobal($event.target.value, 'contains')\"\n            style=\"max-width: 90%\" />\n        </div>\n      </div>\n    </ng-template>\n    <ng-template pTemplate=\"header\">\n      <tr>\n        <th scope=\"true\">{{ 'Resource.Posts.Author' | transloco }}</th>\n        <th scope=\"true\"\n          pSortableColumn=\"title\">\n          {{ 'Label.Title' | transloco }}\n          <p-sortIcon field=\"title\"></p-sortIcon>\n        </th>\n        <th scope=\"true\">\n          {{ 'Resource.Posts.Tags' | transloco }}\n        </th>\n        <th scope=\"true\"\n          pSortableColumn=\"showcase\">\n          {{ 'Resource.Posts.Showcase' | transloco }}\n          <p-sortIcon field=\"showcase\"></p-sortIcon>\n        </th>\n        <th scope=\"true\"\n          pSortableColumn=\"when\">\n          {{ 'Resource.Posts.When' | transloco }}\n          <p-sortIcon field=\"when\"></p-sortIcon>\n        </th>\n        <th scope=\"true\"\n          pSortableColumn=\"published_at\">\n          {{ 'Resource.Posts.PublishedAt' | transloco }}\n          <p-sortIcon field=\"published_at\"></p-sortIcon>\n        </th>\n        <th scope=\"true\"\n          pSortableColumn=\"accepted_at\">\n          {{ 'Resource.Posts.AcceptedAt' | transloco }}\n          <p-sortIcon field=\"accepted_at\"></p-sortIcon>\n        </th>\n        <th scope=\"true\"\n          pSortableColumn=\"view\">\n          {{ 'Resource.Posts.View' | transloco }}\n          <p-sortIcon field=\"view\"></p-sortIcon>\n        </th>\n        <th 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=\"Title\">\n          <a [routerLink]=\"['/members', item.author?.slug]\"\n            class=\"d-flex align-items-center\">\n            <img *ngIf=\"item.author?.avatar\"\n              [src]=\"item.author?.avatar[0].url\"\n              alt=\"author\"\n              width=\"25\"\n              class=\"img-fluid\" />\n            <img *ngIf=\"!item.author?.avatar\"\n              src=\"assets/img/icons/male.png\"\n              alt=\"author\"\n              width=\"25\"\n              class=\"img-fluid\" />\n            <span class=\"ms-2\">{{ item.author | ifNameNullShowEmail }}</span>\n          </a>\n        </td>\n        <td data-head=\"Title\">\n          <a [routerLink]=\"['/resources/view', item?.slug]\"\n            target=\"_blank\">{{ item.title }}</a>\n        </td>\n        <td data-head=\"tags\">\n          <span *ngFor=\"let tag of item?.tags?.slice(0, 3)\"\n                class=\"badge m-1\"\n                [appDynamicBadge]=\"{ itemsArray: item?.tags, item: tag }\"\n                [colorByName]=\"true\"\n                [dataName]=\"tag.name\"\n                color=\"cyan\">{{ tag.name }}</span>\n\n          <span *ngIf=\"item.expandedTags\">\n            <span *ngFor=\"let tag of item?.tags?.slice(3)\"\n                  class=\"badge m-1\"\n                  [appDynamicBadge]=\"{ itemsArray: item?.tags, item: tag }\"\n                  [colorByName]=\"true\"\n                  [dataName]=\"tag.name\"\n                  color=\"cyan\" >{{ tag.name }}</span>\n          </span>\n\n          <span *ngIf=\"item?.tags?.length > 3\" class=\"fw-bold\">\n            <a (click)=\"item.expandedTags = !item.expandedTags\">\n              <span>...</span>\n            </a>\n          </span>\n        </td>\n\n        <td data-head=\"showcase\">\n          <span [appDynamicBadge]=\"{ itemsArray: [true, false], item: item?.showcase }\"\n          [ngClass]=\"item?.showcase ? 'bg-success' : 'bg-secondary'\"\n            class=\"badge\">{{ !!item?.showcase }}</span>\n        </td>\n        <td data-head=\"when\">{{ item.when | dateFormat }}</td>\n        <td data-head=\"Published At\">{{ item.published_at | dateFormat }}</td>\n        <td data-head=\"Accepted At\">{{ item.accepted_at | dateFormat }}</td>\n        <td data-head=\"View\">{{ item.view }}</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              *rbacAllow=\"blogPermission\"\n              (click)=\"navigateToEdit(item)\">\n              <i class=\"fa fa-edit edit-icon\" aria-hidden=\"true\"></i>\n            </li>\n            <li ngbTooltip=\"Delete\"\n              class=\"me-2 me-sm-3\"\n              *rbacAllow=\"blogPermission\"\n              (keydown.enter)=\"onDeletePost(item)\"\n              (click)=\"onDeletePost(item)\">\n              <i class=\"fa fa-trash delete-icon\" aria-hidden=\"true\"></i>\n            </li>\n            <li ngbTooltip=\"Insight\"\n              class=\"me-2 me-sm-3\"\n              *rbacAllow=\"isBlogAdmin\"\n              [routerLink]=\"[\n                                '/' + routers.resourcesList + item.id + '/insight'\n                            ]\"\n              [queryParams]=\"{ insight_name: item?.title }\">\n              <i class=\"fa fa-fw fa-list fa-lg\" aria-hidden=\"true\"></i>\n            </li>\n          </ul>\n        </td>\n      </tr>\n    </ng-template>\n  </p-table>\n  <span *ngIf=\"data.object_count !== 0\" class=\"total-records-count\">{{ 'Label.Total' | transloco }}: {{  data.object_count }}</span>\n  <div *ngIf=\"data.object_count === 0 && isLoaded\">\n    <pw-no-data [withImage]=\"true\" [message]=\"'Search.NoDataMessage'| transloco\" [description]=\"'Search.NoDataDescription' | transloco\"  >\n    </pw-no-data>\n  </div>\n</div>\n<div class=\"col-12 text-center\">\n  <pw-no-data [withImage]=\"true\" [message]=\"'Resource.Posts.NoDataMessage' | transloco\"\n    *ngIf=\"data.unfiltered_count === 0 && isLoaded\">\n  </pw-no-data>\n</div>\n" }]
         }], ctorParameters: () => [{ type: i1.AdminService }, { type: i1$2.TagService }, { type: i0.Injector }, { type: i0.ChangeDetectorRef }] });
 
 class ResourcesInsightComponent extends AppBaseComponent {
@@ -5815,6 +5967,153 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.11", ngImpo
             args: [{ selector: 'pw-subscription-products', template: "<div class=\"w-100 text-center mt-3\">\n  <ng-template [ngIf]=\"!isLoaded\">\n    <p-progressSpinner> </p-progressSpinner>\n  </ng-template>\n</div>\n<div class=\"primeng-datatable-container table-responsive mt-0\"\n  [class.hideTable]=\"totalRecordsUnFiltered === 0\">\n  <p-table #dt\n    [value]=\"subscriptionProducts\"\n    [paginator]=\"totalRecords !== 0\"\n    [rows]=\"PAGE_SIZE\"\n    [lazy]=\"true\"\n    [totalRecords]=\"totalRecords\"\n    [loading]=\"loading\"\n    [filterDelay]=\"1000\"\n    [customSort]=\"true\">\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\"\n          [(ngModel)]=\"searchText\"\n          pInputText\n          size=\"50\"\n          placeholder=\"Search subscription products...\"\n          (input)=\"dt.filterGlobal($event.target.value, 'contains')\"\n          class=\"mw-90\" />\n      </div>\n    </ng-template>\n    <ng-template pTemplate=\"header\">\n      <tr>\n        <th scope=\"true\">{{ 'Label.Name' | transloco }}</th>\n        <th scope=\"true\">{{ 'Admin.Subscriptions.PricePerUnit' | transloco }}</th>\n        <th scope=\"true\">{{ 'Admin.Subscriptions.Currency' | transloco }}</th>\n        <th scope=\"true\">{{ 'Admin.Subscriptions.BillingFrequency' | transloco }}</th>\n        <th scope=\"true\">{{ 'Admin.Subscriptions.MinUnits' | transloco }}</th>\n        <th scope=\"true\">{{ 'Admin.Subscriptions.MaxUnits' | transloco }}</th>\n        <th scope=\"true\">{{ 'Admin.Subscriptions.PurchasedUnits' | transloco }}</th>\n        <th scope=\"true\">{{ 'Admin.Subscriptions.CalculatedPrice' | transloco }}</th>\n        <th scope=\"true\">{{ 'Admin.Subscriptions.IsDeleted' | transloco }}</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=\"Name\">{{ item.name }}</td>\n        <td data-head=\"Price Per Unit\">\n          <span>{{ (item.price_per_unit / 100).toFixed(2) }}\n            <i\n                            class=\"fa fa-info-circle\"\n                            *ngIf=\"item?.discount && objectKeys(item?.discount)?.length\"\n                            aria-hidden=\"true\"\n                            tooltipPosition=\"top\"\n                            [pTooltip]=\"item?.discount | json\"\n                        ></i>\n          </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=\"Billing Frequency\">\n          {{ item.billing_frequency }}\n          <span *ngIf=\"item?.pause_collection && objectKeys(item?.pause_collection)?.length\"\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        </td>\n        <td data-head=\"Min Units\">{{ item.min_units }}</td>\n        <td data-head=\"Max Units\">{{ item.max_units }}</td>\n        <td data-head=\"Purchased Units\">{{ item.purchased_units }}</td>\n        <td data-head=\"Calculated Price\">{{ (item.calculated_price / 100).toFixed(2) }}</td>\n        <td data-head=\"Deleted\">\n          <span [appDynamicBadge]=\"{ itemsArray: [true, false], item: item?.is_deleted }\"\n            color=\"success-danger\"\n            class=\"badge\">{{ item?.is_deleted ? 'Yes' : 'No' }}</span>\n        </td>\n        <td data-head=\"Action\">\n          <ul class=\"list-unstyled list-inline list-action\">\n            <li ngbTooltip=\"Edit\"\n              *rbacAllow=\"'SubscriptionSuperAdmin'\"\n              [routerLink]=\"[\n                                routers.subscriptionProductDetails + item.subscription_product_id\n                            ]\"\n              [queryParams]=\"{ subscription_id: id }\">\n              <i class=\"fa fa-edit edit-icon\" aria-hidden=\"true\"></i>\n            </li>\n          </ul>\n        </td>\n      </tr>\n    </ng-template>\n  </p-table>\n  <span class=\"total-records-count\" *ngIf=\"totalRecords !== 0\">{{ 'Label.Total' | transloco }}: {{ totalRecords }}</span>\n</div>\n<div *ngIf=\"totalRecordsUnFiltered === 0 && isLoaded\">\n  <pw-no-data [withImage]=\"true\" [message]=\"'Admin.Subscriptions.NoSubscriptionProductsMessage' | transloco\">\n  </pw-no-data>\n</div>\n" }]
         }], ctorParameters: () => [{ type: i1$2.SubscriptionService }, { type: i0.Injector }, { type: i1$2.ProductService }] });
 
+class AddMembersComponent extends AppBaseComponent {
+    constructor(injector, formBuilder, subscriptionService, authService) {
+        super(injector);
+        this.formBuilder = formBuilder;
+        this.subscriptionService = subscriptionService;
+        this.authService = authService;
+        this.membersAdded = new EventEmitter();
+        this.availableUnits = 0;
+        this.buttonBusy = false;
+        this.files = [];
+        this.uploadInput = new EventEmitter();
+        this.dragOver = false;
+        this.options = { concurrency: 1, maxUploads: 3 };
+        this.humanizeBytes = humanizeBytes;
+        this.page = 1;
+        this.token = btoa(this.authService.getToken());
+        this.form = this.formBuilder.group({
+            email: ['', ValidationService.email],
+            emailsFormArray: this.formBuilder.array([this.createItem()])
+        });
+    }
+    ngOnInit() {
+        this.route.params.subscribe(data => {
+            this.id = Number(data['id']);
+            this.getSubscriptionDetails();
+        });
+    }
+    createItem() {
+        return this.formBuilder.group({
+            email: ['', [Validators.email, Validators.required]]
+        });
+    }
+    addItem() {
+        this.emailsFormArray = this.form.get('emailsFormArray');
+        if (this.emailsFormArray.valid &&
+            this.emailsFormArray.controls.length < this.availableUnits) {
+            this.emailsFormArray.push(this.createItem());
+        }
+    }
+    getSubscriptionDetails() {
+        this.subscriptionService.getById(this.id).subscribe(resp => {
+            this.availableUnits = resp.products[0].purchased_units - resp.units_in_use;
+        });
+    }
+    removeItem(index) {
+        this.emailsFormArray = this.form.get('emailsFormArray');
+        this.emailsFormArray.removeAt(index);
+    }
+    onUploadOutput(output) {
+        switch (output.type) {
+            case 'allAddedToQueue':
+                if (this.files.length > 0) {
+                    const event = {
+                        type: 'uploadAll',
+                        url: this.subscriptionService.signUpMemberUrl(this.id),
+                        method: 'POST',
+                        data: {
+                            send_marketing_emails: 'true',
+                            confirmation_path: 'confirm'
+                        },
+                        headers: {
+                            [TOKEN_HEADER_KEY]: this.token
+                        }
+                    };
+                    this.uploadInput.emit(event);
+                }
+                break;
+            case 'addedToQueue':
+                if (output.file) {
+                    const ext = output.file.name.split('.').pop();
+                    if (['csv', 'xlsx'].includes(ext)) {
+                        this.files.push(output.file);
+                    }
+                    else {
+                        this.toast.error('Only csv and xlsx formats are supported.');
+                    }
+                }
+                break;
+            case 'uploading':
+                if (output.file) {
+                    const index = this.files.findIndex(file => file.id === output.file.id);
+                    this.files[index] = output.file;
+                }
+                break;
+            case 'removed':
+                this.files = this.files.filter(file => file !== output.file);
+                break;
+            case 'dragOver':
+                this.dragOver = true;
+                break;
+            case 'dragOut':
+            case 'drop':
+                this.dragOver = false;
+                break;
+        }
+        this.files = this.files.filter(file => file.progress.status !== UploadStatus.Done);
+    }
+    onSignUpMember() {
+        swal.fire({
+            title: this.translation.translate('Label.Confirm'),
+            text: this.translation.translate('Admin.Subscriptions.confirmEnterpriseMembersSubscriptionMessage'),
+            showCancelButton: true,
+            reverseButtons: true,
+            icon: 'warning',
+            confirmButtonText: 'Yes'
+        }).then(rep => {
+            if (rep.value) {
+                const emails = this.form
+                    .get('emailsFormArray')
+                    ?.value?.map(item => item.email)
+                    .join(',');
+                if (emails) {
+                    this.buttonBusy = true;
+                    const data = {
+                        confirmation_path: 'confirm',
+                        emails,
+                        send_marketing_emails: true
+                    };
+                    this.subscriptionService
+                        .addMembersToSubscription(this.id, data)
+                        .subscribe(response => {
+                        if (response?.status === StatusCodes.OK) {
+                            this.membersAdded.emit();
+                            this.toast.success(response.message);
+                            this.form.reset();
+                        }
+                        else {
+                            this.toast.error(response.error.message);
+                        }
+                    })
+                        .add(() => {
+                        this.buttonBusy = false;
+                    });
+                }
+            }
+        });
+    }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.11", ngImport: i0, type: AddMembersComponent, deps: [{ token: i0.Injector }, { token: i3$2.UntypedFormBuilder }, { token: i1$2.SubscriptionService }, { token: i1$2.AuthService }], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.3.11", type: AddMembersComponent, selector: "pw-add-members", outputs: { membersAdded: "membersAdded" }, usesInheritance: true, ngImport: i0, template: "<section>\n  <div class=\"row\">\n    <div class=\"col-12 mb-3\">\n      <div class=\"title d-flex\">\n        <a\n          aria-label=\"Navigate to Target\"\n          (click)=\"membersAdded.emit()\"\n          class=\"previous\"><i class=\"fa fa-arrow-alt-circle-left\" aria-hidden=\"true\"></i></a>\n        <h2 class=\"mt-3\">Enterprise Members for this subscription</h2>\n      </div>\n      <p>Here you can add members to your subscription</p>\n    </div>\n  </div>\n</section>\n\n<section>\n  <h5 class=\"ms-2 pt-3\">Upload File (CSV)</h5>\n  <div class=\"row p-2\">\n    <div class=\"col-12\">\n      <div class=\"upload-box\">\n        <div class=\"upload-box-content\">\n          <div class=\"drop-container\"\n            ngFileDrop\n            [options]=\"options\"\n            (uploadOutput)=\"onUploadOutput($event)\"\n            [uploadInput]=\"uploadInput\">\n            <p>\n              Drag files here or\n              <label class=\"upload-button\">\n                <input type=\"file\"\n                  ngFileSelect\n                  [options]=\"options\"\n                  (uploadOutput)=\"onUploadOutput($event)\"\n                  [uploadInput]=\"uploadInput\"\n                  multiple />\n                browse\n              </label>\n              to upload.\n            </p>\n          </div>\n          <div class=\"upload-item\"\n            *ngFor=\"let f of files; let i = index\">\n            <div class=\"upload-item-content\">\n              <div class=\"filename\">\n                <div class=\"filename-left\">\n                  <i class=\"ionicon ion-ios-copy\" aria-hidden=\"true\"></i>\n                  <span>{{ f.name }}</span>\n                </div>\n              </div>\n              <div class=\"progress-content\">\n                <div class=\"progress\">\n                  <span class=\"bar\"\n                    [style.width]=\"f?.progress?.data?.percentage + '%'\"\n                    [class.is-done]=\"f?.progress?.data?.percentage === 100\"></span>\n                </div>\n              </div>\n              <div class=\"progress-text-content\">\n                <span class=\"progress-text\"\n                  [class.is-done]=\"f?.progress?.data?.percentage === 100\">\n                  <span>{{ f.progress?.data?.percentage }}% </span>\n                  <span *ngIf=\"f.progress?.data?.percentage !== 100\">Uploading...</span>\n                  <span *ngIf=\"f.progress?.data?.percentage === 100\">Done</span>\n                </span>\n                <span class=\"speed-and-eta-text\"\n                  *ngIf=\"\n                                        f.progress?.data?.percentage !== 0 &&\n                                        f.progress?.data?.percentage !== 100\n                                    \">\n                  <span>{{ f.progress?.data?.speedHuman }} </span>\n                  <span>ETA {{ f.progress?.data?.etaHuman }}</span>\n                </span>\n              </div>\n            </div>\n          </div>\n          <div class=\"help-text\">\n            <span>Note: You can upload a .csv file containing the comma separated emails\n              of the members to add.</span>\n          </div>\n        </div>\n      </div>\n    </div>\n  </div>\n  <h5 class=\"ms-2 pt-3 d-inline-block me-2\">Add Member's Email</h5>\n  <small><strong> (Available {{ availableUnits }} Seats) </strong></small>\n  <div class=\"p-2\">\n    <form [formGroup]=\"form\"\n      (ngSubmit)=\"onSignUpMember()\">\n      <div formArrayName=\"emailsFormArray\"\n        *ngFor=\"\n                    let item of form.get('emailsFormArray')['controls'];\n                    let i = index;\n                    let last = last\n                \">\n        <div [formGroupName]=\"i\">\n          <div class=\"row mb-2\">\n            <label class=\"col-12 col-md-4 text-md-end col-form-label col-form-label-sm\" for=\"Email\">\n              #{{ i + 1 }}</label>\n            <div class=\"col-10 col-md-4\">\n              <input formControlName=\"email\"\n                class=\"form-control form-control-sm\"\n                placeholder=\"Email\" />\n            </div>\n            <div class=\"col-2\">\n              <button class=\"btn btn-sm btn-danger\"\n                type=\"button\">\n                <i\n                                class=\"fa fa-times\"\n                                title=\"Delete\"\n                                (click)=\"removeItem(i)\"\n                                (keydown.enter)=\"removeItem(i)\"\n                                aria-hidden=\"true\"\n                            ></i>\n              </button>\n              <i\n                                class=\"btn btn-sm btn-primary fal fa-plus ms-2\"\n                                *ngIf=\"last && emailsFormArray?.controls?.length < availableUnits\"\n                                title=\"Add More\"\n                                (click)=\"addItem()\"\n                                (keydown.enter)=\"addItem()\"\n                                aria-hidden=\"true\"\n                            ></i>\n            </div>\n          </div>\n        </div>\n      </div>\n      <div class=\"text-center mt-2\">\n        <button class=\"btn btn-sm btn-outline-default me-2\"\n        (click)=\"membersAdded.emit()\">\n          <i class=\"fa fa-plus-times\" aria-hidden=\"true\"></i>\n          {{ 'Button.Back' | transloco }}\n        </button>\n        <button type=\"submit\"\n          class=\"btn btn-sm btn-outline-primary me-2\"\n          [buttonBusy]=\"buttonBusy\"\n          [disabled]=\"form.invalid || buttonBusy\">\n          Add Members\n        </button>\n      </div>\n    </form>\n  </div>\n</section>\n", dependencies: [{ kind: "directive", type: i3$5.NgFileDropDirective, selector: "[ngFileDrop]", inputs: ["options", "uploadInput"], outputs: ["uploadOutput"] }, { kind: "directive", type: i3$5.NgFileSelectDirective, selector: "[ngFileSelect]", inputs: ["options", "uploadInput"], outputs: ["uploadOutput"] }, { kind: "directive", type: i3$1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i3$1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i3$2.ɵNgNoValidate, selector: "form:not([ngNoForm]):not([ngNativeValidate])" }, { kind: "directive", type: i3$2.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: i3$2.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i3$2.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { kind: "directive", type: i10.ButtonBusyDirective, selector: "[buttonBusy]", inputs: ["buttonBusy", "busyText"] }, { kind: "directive", type: i3$2.FormGroupDirective, selector: "[formGroup]", inputs: ["formGroup"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { kind: "directive", type: i3$2.FormControlName, selector: "[formControlName]", inputs: ["formControlName", "disabled", "ngModel"], outputs: ["ngModelChange"] }, { kind: "directive", type: i3$2.FormGroupName, selector: "[formGroupName]", inputs: ["formGroupName"] }, { kind: "directive", type: i3$2.FormArrayName, selector: "[formArrayName]", inputs: ["formArrayName"] }, { kind: "pipe", type: i12.TranslocoPipe, name: "transloco" }] }); }
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.11", ngImport: i0, type: AddMembersComponent, decorators: [{
+            type: Component,
+            args: [{ selector: 'pw-add-members', template: "<section>\n  <div class=\"row\">\n    <div class=\"col-12 mb-3\">\n      <div class=\"title d-flex\">\n        <a\n          aria-label=\"Navigate to Target\"\n          (click)=\"membersAdded.emit()\"\n          class=\"previous\"><i class=\"fa fa-arrow-alt-circle-left\" aria-hidden=\"true\"></i></a>\n        <h2 class=\"mt-3\">Enterprise Members for this subscription</h2>\n      </div>\n      <p>Here you can add members to your subscription</p>\n    </div>\n  </div>\n</section>\n\n<section>\n  <h5 class=\"ms-2 pt-3\">Upload File (CSV)</h5>\n  <div class=\"row p-2\">\n    <div class=\"col-12\">\n      <div class=\"upload-box\">\n        <div class=\"upload-box-content\">\n          <div class=\"drop-container\"\n            ngFileDrop\n            [options]=\"options\"\n            (uploadOutput)=\"onUploadOutput($event)\"\n            [uploadInput]=\"uploadInput\">\n            <p>\n              Drag files here or\n              <label class=\"upload-button\">\n                <input type=\"file\"\n                  ngFileSelect\n                  [options]=\"options\"\n                  (uploadOutput)=\"onUploadOutput($event)\"\n                  [uploadInput]=\"uploadInput\"\n                  multiple />\n                browse\n              </label>\n              to upload.\n            </p>\n          </div>\n          <div class=\"upload-item\"\n            *ngFor=\"let f of files; let i = index\">\n            <div class=\"upload-item-content\">\n              <div class=\"filename\">\n                <div class=\"filename-left\">\n                  <i class=\"ionicon ion-ios-copy\" aria-hidden=\"true\"></i>\n                  <span>{{ f.name }}</span>\n                </div>\n              </div>\n              <div class=\"progress-content\">\n                <div class=\"progress\">\n                  <span class=\"bar\"\n                    [style.width]=\"f?.progress?.data?.percentage + '%'\"\n                    [class.is-done]=\"f?.progress?.data?.percentage === 100\"></span>\n                </div>\n              </div>\n              <div class=\"progress-text-content\">\n                <span class=\"progress-text\"\n                  [class.is-done]=\"f?.progress?.data?.percentage === 100\">\n                  <span>{{ f.progress?.data?.percentage }}% </span>\n                  <span *ngIf=\"f.progress?.data?.percentage !== 100\">Uploading...</span>\n                  <span *ngIf=\"f.progress?.data?.percentage === 100\">Done</span>\n                </span>\n                <span class=\"speed-and-eta-text\"\n                  *ngIf=\"\n                                        f.progress?.data?.percentage !== 0 &&\n                                        f.progress?.data?.percentage !== 100\n                                    \">\n                  <span>{{ f.progress?.data?.speedHuman }} </span>\n                  <span>ETA {{ f.progress?.data?.etaHuman }}</span>\n                </span>\n              </div>\n            </div>\n          </div>\n          <div class=\"help-text\">\n            <span>Note: You can upload a .csv file containing the comma separated emails\n              of the members to add.</span>\n          </div>\n        </div>\n      </div>\n    </div>\n  </div>\n  <h5 class=\"ms-2 pt-3 d-inline-block me-2\">Add Member's Email</h5>\n  <small><strong> (Available {{ availableUnits }} Seats) </strong></small>\n  <div class=\"p-2\">\n    <form [formGroup]=\"form\"\n      (ngSubmit)=\"onSignUpMember()\">\n      <div formArrayName=\"emailsFormArray\"\n        *ngFor=\"\n                    let item of form.get('emailsFormArray')['controls'];\n                    let i = index;\n                    let last = last\n                \">\n        <div [formGroupName]=\"i\">\n          <div class=\"row mb-2\">\n            <label class=\"col-12 col-md-4 text-md-end col-form-label col-form-label-sm\" for=\"Email\">\n              #{{ i + 1 }}</label>\n            <div class=\"col-10 col-md-4\">\n              <input formControlName=\"email\"\n                class=\"form-control form-control-sm\"\n                placeholder=\"Email\" />\n            </div>\n            <div class=\"col-2\">\n              <button class=\"btn btn-sm btn-danger\"\n                type=\"button\">\n                <i\n                                class=\"fa fa-times\"\n                                title=\"Delete\"\n                                (click)=\"removeItem(i)\"\n                                (keydown.enter)=\"removeItem(i)\"\n                                aria-hidden=\"true\"\n                            ></i>\n              </button>\n              <i\n                                class=\"btn btn-sm btn-primary fal fa-plus ms-2\"\n                                *ngIf=\"last && emailsFormArray?.controls?.length < availableUnits\"\n                                title=\"Add More\"\n                                (click)=\"addItem()\"\n                                (keydown.enter)=\"addItem()\"\n                                aria-hidden=\"true\"\n                            ></i>\n            </div>\n          </div>\n        </div>\n      </div>\n      <div class=\"text-center mt-2\">\n        <button class=\"btn btn-sm btn-outline-default me-2\"\n        (click)=\"membersAdded.emit()\">\n          <i class=\"fa fa-plus-times\" aria-hidden=\"true\"></i>\n          {{ 'Button.Back' | transloco }}\n        </button>\n        <button type=\"submit\"\n          class=\"btn btn-sm btn-outline-primary me-2\"\n          [buttonBusy]=\"buttonBusy\"\n          [disabled]=\"form.invalid || buttonBusy\">\n          Add Members\n        </button>\n      </div>\n    </form>\n  </div>\n</section>\n" }]
+        }], ctorParameters: () => [{ type: i0.Injector }, { type: i3$2.UntypedFormBuilder }, { type: i1$2.SubscriptionService }, { type: i1$2.AuthService }], propDecorators: { membersAdded: [{
+                type: Output
+            }] } });
+
 class SubscriptionUsersComponent extends AppBaseComponent {
     constructor(subscriptionService, injector, cdr, authService, windowService, adminService, toaster) {
         super(injector);
@@ -5824,19 +6123,25 @@ class SubscriptionUsersComponent extends AppBaseComponent {
         this.windowService = windowService;
         this.adminService = adminService;
         this.toaster = toaster;
-        this.subscriptionMembers = [];
         this.isLoaded = false;
         this.loading = true;
         this.searchText = '';
         this.page = 1;
         this.routers = ROUTERS;
         this.totalUnfilteredCount = 0;
+        this.hasAccess = false;
+        this.isAddEnabled = false;
     }
     ngOnInit() {
         this.subscriptionId = PermissionService.selectedSubscription?.id;
         this.route.params.subscribe(data => {
             this.id = Number(data['id']);
         });
+        this.userStore().subscribe(user => {
+            if (user) {
+                this.user = user;
+            }
+        });
     }
     ngAfterViewChecked() {
         this.cdr.detectChanges();
@@ -5919,6 +6224,13 @@ class SubscriptionUsersComponent extends AppBaseComponent {
             this.userToDelete = null;
         });
     }
+    onMembersAdded() {
+        this.isAddEnabled = false;
+        this.getSubscriptionDetails({
+            page: this.page,
+            page_size: PAGE_SIZE
+        });
+    }
     getSubscriptionDetails(paging) {
         this.isLoaded = false;
         this.subscriptionService
@@ -5928,6 +6240,10 @@ class SubscriptionUsersComponent extends AppBaseComponent {
             this.subscriptionOwnerUserId = response?.owner_id;
             this.totalRecords = response?.members.length;
             this.totalUnfilteredCount = response.unfiltered_count;
+            this.hasAccess =
+                response?.admins?.includes(this.user?.id) ||
+                    this.user?.id === this.subscriptionOwnerUserId ||
+                    this.permissionService.isSuperAdmin();
         })
             .add(() => {
             this.isLoaded = true;
@@ -5935,11 +6251,11 @@ class SubscriptionUsersComponent extends AppBaseComponent {
         });
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.11", ngImport: i0, type: SubscriptionUsersComponent, deps: [{ token: i1$2.SubscriptionService }, { token: i0.Injector }, { token: i0.ChangeDetectorRef }, { token: i1$2.AuthService }, { token: i1$2.WindowService }, { token: i1.AdminService }, { token: i1$2.CustomToastService }], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.3.11", type: SubscriptionUsersComponent, selector: "pw-subscription-users", viewQueries: [{ propertyName: "passwordValidationModalForImpersonate", first: true, predicate: ["passwordValidationModalForImpersonate"], descendants: true }, { propertyName: "passwordValidationModalForUserDelete", first: true, predicate: ["passwordValidationModalForUserDelete"], descendants: true }, { propertyName: "passwordValidationModalForRemove2fa", first: true, predicate: ["passwordValidationModalForRemove2fa"], descendants: true }], usesInheritance: true, ngImport: i0, template: "<div class=\"w-100 text-center mt-3\">\n\t<ng-template [ngIf]=\"!isLoaded\">\n\t\t<p-progressSpinner></p-progressSpinner>\n\t</ng-template>\n</div>\n<div [class.hideTable]=\"totalUnfilteredCount === 0\"\n\tclass=\"primeng-datatable-container table-responsive mt-0\">\n\t<p-table #dt\n\t\t[value]=\"subscriptionMembers\"\n\t\t[paginator]=\"totalRecords !== 0\"\n\t\t[rows]=\"PAGE_SIZE\"\n\t\t[lazy]=\"true\"\n\t\t[totalRecords]=\"totalRecords\"\n\t\t[loading]=\"loading\"\n\t\t[filterDelay]=\"1000\"\n\t\t[customSort]=\"true\"\n\t\t(onLazyLoad)=\"onLazyLoad($event)\">\n\t\t<ng-template pTemplate=\"caption\">\n\t\t\t<div class=\"text-end\">\n\t\t\t\t<i class=\"fa fa-search mt-2 me-2\"\n\t\t\t\t\taria-hidden=\"true\"></i>\n\t\t\t\t<input [(ngModel)]=\"searchText\"\n\t\t\t\t\t(input)=\"dt.filterGlobal($event.target.value, 'contains')\"\n\t\t\t\t\ttype=\"text\"\n\t\t\t\t\tpInputText\n\t\t\t\t\tsize=\"50\"\n\t\t\t\t\tplaceholder=\"Search subscription users...\"\n\t\t\t\t\tclass=\"mw-90\">\n\t\t\t</div>\n\t\t</ng-template>\n\t\t<ng-template pTemplate=\"header\">\n\t\t\t<tr>\n\t\t\t\t<th scope=\"true\"\n\t\t\t\t\tpSortableColumn=\"id\">\n\t\t\t\t\t{{ 'Admin.Users.Id' | transloco }}\n\t\t\t\t\t<p-sortIcon field=\"id\"></p-sortIcon>\n\t\t\t\t</th>\n\t\t\t\t<th scope=\"true\"\n\t\t\t\t\tpSortableColumn=\"first_name\">\n\t\t\t\t\t{{ 'Label.FirstName' | transloco }}\n\t\t\t\t</th>\n\t\t\t\t<th scope=\"true\"\n\t\t\t\t\tpSortableColumn=\"last_name\">\n\t\t\t\t\t{{ 'Label.LastName' | transloco }}\n\t\t\t\t\t<p-sortIcon field=\"last_name\"></p-sortIcon>\n\t\t\t\t</th>\n\t\t\t\t<th scope=\"true\"\n\t\t\t\t\tpSortableColumn=\"email\">\n\t\t\t\t\t{{ 'Label.Email' | transloco }}\n\t\t\t\t\t<p-sortIcon field=\"email\"></p-sortIcon>\n\t\t\t\t</th>\n\t\t\t\t<th scope=\"true\"\n\t\t\t\t\tpSortableColumn=\"slug\">\n\t\t\t\t\t{{ 'Admin.Subscriptions.NickName' | transloco }}\n\t\t\t\t\t<p-sortIcon field=\"slug\"></p-sortIcon>\n\t\t\t\t</th>\n\t\t\t\t<th scope=\"true\"\n\t\t\t\t\tpSortableColumn=\"has_password\">\n\t\t\t\t\t{{ 'Admin.Subscriptions.EmailConfirmed' | transloco }}\n\t\t\t\t\t<p-sortIcon field=\"has_password\"></p-sortIcon>\n\t\t\t\t</th>\n\t\t\t\t<th scope=\"true\"\n\t\t\t\t\tpSortableColumn=\"last_sign_in_at\">\n\t\t\t\t\t{{ 'Admin.Subscriptions.LastLogin' | transloco }}\n\t\t\t\t\t<p-sortIcon field=\"last_sign_in_at\"></p-sortIcon>\n\t\t\t\t</th>\n\t\t\t\t<th scope=\"true\">\n\t\t\t\t\t{{ 'Label.Actions' | transloco }}\n\t\t\t\t</th>\n\t\t\t</tr>\n\t\t</ng-template>\n\t\t<ng-template pTemplate=\"body\"\n\t\t\tlet-user>\n\t\t\t<tr>\n\t\t\t\t<td data-head=\"Id\">{{ user.id }}</td>\n\t\t\t\t<td data-head=\"First Name\">\n\t\t\t\t\t<span class=\"first-name\">{{ user.first_name }}</span>\n\t\t\t\t\t<ng-template [ngIf]=\"subscriptionOwnerUserId === user.id\">\n\t\t\t\t\t\t<span *rbacAllow=\"'Pages.Alpha'\" ngbTooltip=\"Subscription Owner\">\n\t\t\t\t\t\t\t<i class=\"info-icon fas fa-user-tie success\" aria-hidden=\"true\"></i>\n\t\t\t\t\t\t</span>\n\t\t\t\t\t</ng-template>\n\t\t\t\t</td>\n\t\t\t\t<td data-head=\"Last Name\">\n\t\t\t\t\t{{ user.last_name }}\n\t\t\t\t\t<span *ngIf=\"user?.alpha\"\n\t\t\t\t\t\t[pTooltip]=\"'Admin.Users.Tooltip.AlphaIcon'|transloco\"\n\t\t\t\t\t\ttooltipPosition=\"top\">\n\t\t\t\t\t\t<i class=\"fa-regular fa-square-a alpha-beta text-warning\"></i>\n\t\t\t\t\t</span>\n\t\t\t\t\t<span *ngIf=\"user?.beta\"\n\t\t\t\t\t\t[pTooltip]=\"'Admin.Users.Tooltip.BetaIcon'|transloco\"\n\t\t\t\t\t\tclass=\"ms-2\"\n\t\t\t\t\t\ttooltipPosition=\"top\">\n\t\t\t\t\t\t<i class=\"fa-regular fa-square-b alpha-beta text-primary\"></i>\n\t\t\t\t\t</span>\n\t\t\t\t\t<span *ngIf=\"user?.cognito_sso_activated\"\n\t\t\t\t\t\tclass=\"ms-2\"\n\t\t\t\t\t\t[pTooltip]=\"'Admin.Users.Tooltip.Cognito' | transloco\"\n\t\t\t\t\t\ttooltipPosition=\"top\">\n\t\t\t\t\t\t<i class=\"fa fa-cloud success\" ></i>\n\t\t\t\t\t</span>\n\t\t\t\t</td>\n\t\t\t\t<td data-head=\"Email\">{{ user.email }}</td>\n\t\t\t\t<td data-head=\"Nick Name\">\n\t\t\t\t\t<a [routerLink]=\"['/members', user.slug]\">{{ user.slug }}</a>\n\t\t\t\t</td>\n\t\t\t\t<td data-head=\"Email Confirm\">\n\t\t\t\t\t<span [appDynamicBadge]=\"{ itemsArray: [true, false], item: user?.has_password }\"\n\t\t\t\t\t\tcolor=\"success-danger\"\n\t\t\t\t\t\tclass=\"badge\">\n\t\t\t\t\t\t{{ user?.has_password ? 'Yes' : 'No' }}\n\t\t\t\t\t</span>\n\t\t\t\t\t<span *ngIf=\"user?.blocked\"\n\t\t\t\t\t\t[pTooltip]=\"'This user has been blocked'\"\n\t\t\t\t\t\tclass=\"ms-2\"\n\t\t\t\t\t\ttooltipPosition=\"top\">\n\t\t\t\t\t\t<i class=\"fa-solid fa-hexagon-exclamation text-danger hexa-warning\"></i>\n\t\t\t\t\t</span>\n\t\t\t\t</td>\n\t\t\t\t<td data-head=\"Last Login\">\n\t\t\t\t\t<span *ngIf=\"user?.current_sign_in_at; else lastSignin\">\n\t\t\t\t\t\t<span>\n\t\t\t\t\t\t\t{{ user.current_sign_in_at | dateFormat }}\n\t\t\t\t\t\t</span>\n\t\t\t\t\t\t<span *ngIf=\"user.current_sign_in_at\">\n\t\t\t\t\t\t\t&nbsp;({{ user.current_sign_in_at | sinceAgo }})\n\t\t\t\t\t\t</span>\n\t\t\t\t\t</span>\n\t\t\t\t\t<ng-template #lastSignin>\n\t\t\t\t\t\t<span>\n\t\t\t\t\t\t\t<span>\n\t\t\t\t\t\t\t\t{{ user.last_sign_in_at | dateFormat }}\n\t\t\t\t\t\t\t</span>\n\t\t\t\t\t\t\t<span *ngIf=\"user.last_sign_in_at\">\n\t\t\t\t\t\t\t\t&nbsp;({{ user.last_sign_in_at | sinceAgo }})\n\t\t\t\t\t\t\t</span>\n\t\t\t\t\t\t</span>\n\t\t\t\t\t</ng-template>\n\t\t\t\t</td>\n\t\t\t\t<td data-head=\"Action\">\n\t\t\t\t\t<ul class=\"list-unstyled list-inline list-action\">\n\t\t\t\t\t\t<li *rbacAllow=\"'Pages.Alpha'\" ngbTooltip=\"Impersonate this user\" class=\"me-2 me-sm-3\">\n\t\t\t\t\t\t<i (click)=\"onImpersonate(user)\" (keydown.enter)=\"onImpersonate(user)\"  class=\"fas fa-people-arrows fa-lg\" aria-hidden=\"true\"></i>\n\t\t\t\t\t\t</li>\n\t\t\t\t\t\t<ng-template [ngIf]=\"subscriptionOwnerUserId !== user.id\">\n\t\t\t\t\t\t\t<li *rbacAllow=\"'Pages.Alpha'\" ngbTooltip=\"Set this user as new owner\" class=\"me-2 me-sm-3\">\n\t\t\t\t\t\t\t\t<i (click)=\"onChangeOwner(user)\" (keydown.enter)=\"onChangeOwner(user)\"  class=\"fa fa-user-crown warning fa-lg\" aria-hidden=\"true\"></i>\n\t\t\t\t\t\t\t</li>\n\t\t\t\t\t\t</ng-template>\n\t\t\t\t\t\t<ng-template [ngIf]=\"user?.enable_two_factor_authenticator\">\n\t\t\t\t\t\t\t<li *rbacAllow=\"'Pages.Alpha'\"\n\t\t\t\t\t\t\t\t(click)=\"disable2fa(user?.id)\"\n\t\t\t\t\t\t\t\t(keydown.enter)=\"disable2fa(user?.id)\"\n\t\t\t\t\t\t\t\tngbTooltip=\"Disable 2FA\"\n\t\t\t\t\t\t\t\tclass=\"me-2 me-sm-3 success\">\n\t\t\t\t\t\t\t\t<i class=\"fa fa-lock\"\n\t\t\t\t\t\t\t\t\taria-hidden=\"true\"></i>\n\t\t\t\t\t\t\t</li>\n\t\t\t\t\t\t</ng-template>\n\t\t\t\t\t\t<li [routerLink]=\"[routers.usersDetails + user.id]\"\n\t\t\t\t\t\t\tngbTooltip=\"Edit\"\n\t\t\t\t\t\t\tclass=\"me-2 me-sm-3\">\n\t\t\t\t\t\t\t<i class=\"fa fa-edit edit-icon\"\n\t\t\t\t\t\t\t\taria-hidden=\"true\"></i>\n\t\t\t\t\t\t</li>\n\t\t\t\t\t\t<li *rbacAllow=\"'Pages.Admin.Users.Delete'\"\n\t\t\t\t\t\t\tngbTooltip=\"Delete\"\n\t\t\t\t\t\t\tclass=\"me-2 me-sm-3\">\n\t\t\t\t\t\t\t<i (click)=\"onDelete(user)\"\n\t\t\t\t\t\t\t\t(keydown.enter)=\"onDelete(user)\"\n\t\t\t\t\t\t\t\tclass=\"fa fa-trash delete-icon\"\n\t\t\t\t\t\t\t\taria-hidden=\"true\"></i>\n\t\t\t\t\t\t</li>\n\t\t\t\t\t</ul>\n\t\t\t\t</td>\n\t\t\t</tr>\n\t\t</ng-template>\n\t</p-table>\n\t<div *ngIf=\"totalRecords === 0 && totalUnfilteredCount !== 0\">\n\t\t<pw-no-data [withImage]=\"true\" [message]=\"'Search.NoDataMessage' | transloco\" [description]=\"'Search.NoDataDescription' | transloco\" >\n\t\t</pw-no-data>\n\t</div>\n\t<span class=\"total-records-count\" *ngIf=\"totalRecords !== 0\">\n\t\t{{ 'Label.Total' | transloco }}: {{ totalRecords }}\n\t</span>\n</div>\n<div *ngIf=\"totalUnfilteredCount === 0 && isLoaded\">\n  <pw-no-data [withImage]=\"true\" [message]=\"'Admin.Subscriptions.NoSubscriptionUsersMessage' | transloco\">\n  </pw-no-data>\n</div>\n<!-- password validation modal for impersonate -->\n<pw-password-validation #passwordValidationModalForImpersonate\n\t(successEvent)=\"onUserImpersonation($event)\">\n</pw-password-validation>\n<!-- password validation modal for delete user -->\n<pw-password-validation #passwordValidationModalForUserDelete\n\t(successEvent)=\"deleteUser($event)\">\n\t<div class=\"row\">\n\t\t<div class=\"col-12\">\n\t\t\t<p>\n\t\t\t\t{{ 'User.Account.Message.ActionCanNotUndone' | transloco }}\n\t\t\t</p>\n\t\t\t<p>\n\t\t\t\t{{ 'User.Account.Message.ConfirmPassword' | transloco }}\n\t\t\t</p>\n\t\t</div>\n\t</div>\n</pw-password-validation>\n<!-- password validation modal for remove2fa -->\n<pw-password-validation #passwordValidationModalForRemove2fa\n\t(successEvent)=\"remove2fa($event)\">\n</pw-password-validation>\n", styles: [".hexa-warning{font-size:18px;vertical-align:middle}.alpha-beta{font-size:14px}.info-icon{vertical-align:middle;margin-left:5px}.first-name{margin-right:5px}\n"], dependencies: [{ kind: "component", type: i2.Table, selector: "p-table", inputs: ["frozenColumns", "frozenValue", "style", "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", "scrollDirection", "rowGroupMode", "scrollHeight", "virtualScroll", "virtualScrollItemSize", "virtualScrollOptions", "virtualScrollDelay", "frozenWidth", "responsive", "contextMenu", "resizableColumns", "columnResizeMode", "reorderableColumns", "loading", "loadingIcon", "showLoader", "rowHover", "customSort", "showInitialSortBadge", "autoLayout", "exportFunction", "exportHeader", "stateKey", "stateStorage", "editMode", "groupRowsBy", "groupRowsByOrder", "responsiveLayout", "breakpoint", "paginatorLocale", "value", "columns", "first", "rows", "totalRecords", "sortField", "sortOrder", "multiSortMeta", "selection", "selectAll", "virtualRowHeight"], 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$3.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", "appendTo", "positionStyle", "tooltipStyleClass", "tooltipZIndex", "escape", "showDelay", "hideDelay", "life", "positionTop", "positionLeft", "autoHide", "fitContent", "hideOnEscape", "pTooltip", "tooltipDisabled", "tooltipOptions"] }, { kind: "directive", type: i4$1.InputText, selector: "[pInputText]", inputs: ["variant"] }, { kind: "directive", type: i3$1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i3$2.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: i3$2.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i3$2.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "component", type: i9.PasswordValidationComponent, selector: "pw-password-validation", inputs: ["confirmMessage"], outputs: ["successEvent"] }, { kind: "directive", type: i7.RouterLink, selector: "[routerLink]", inputs: ["target", "queryParams", "fragment", "queryParamsHandling", "state", "info", "relativeTo", "preserveFragment", "skipLocationChange", "replaceUrl", "routerLink"] }, { kind: "component", type: i5.ProgressSpinner, selector: "p-progressSpinner", inputs: ["styleClass", "style", "strokeWidth", "fill", "animationDuration", "ariaLabel"] }, { kind: "component", type: i9.NoDataComponent, selector: "pw-no-data", inputs: ["message", "description", "withImage"] }, { kind: "directive", type: i10.DynamicBadgeDirective, selector: "[appDynamicBadge]", inputs: ["appDynamicBadge", "color", "colorByName", "dataName"] }, { kind: "directive", type: i10.RbacAllowDirective, selector: "[rbacAllow]", inputs: ["rbacAllow"] }, { kind: "directive", type: i1$1.NgbTooltip, selector: "[ngbTooltip]", inputs: ["animation", "autoClose", "placement", "popperOptions", "triggers", "positionTarget", "container", "disableTooltip", "tooltipClass", "tooltipContext", "openDelay", "closeDelay", "ngbTooltip"], outputs: ["shown", "hidden"], exportAs: ["ngbTooltip"] }, { kind: "pipe", type: i12.TranslocoPipe, name: "transloco" }, { kind: "pipe", type: i13.DateFormatPipe, name: "dateFormat" }, { kind: "pipe", type: i13.SinceAgoPipe, name: "sinceAgo" }] }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.3.11", type: SubscriptionUsersComponent, selector: "pw-subscription-users", viewQueries: [{ propertyName: "passwordValidationModalForImpersonate", first: true, predicate: ["passwordValidationModalForImpersonate"], descendants: true }, { propertyName: "passwordValidationModalForUserDelete", first: true, predicate: ["passwordValidationModalForUserDelete"], descendants: true }, { propertyName: "passwordValidationModalForRemove2fa", first: true, predicate: ["passwordValidationModalForRemove2fa"], descendants: true }], usesInheritance: true, ngImport: i0, template: "<div class=\"w-100 text-center mt-3\">\n\t<ng-template [ngIf]=\"!isLoaded\">\n\t\t<p-progressSpinner></p-progressSpinner>\n\t</ng-template>\n</div>\n<div class=\"text-end mb-2\" *ngIf=\"hasAccess && !isAddEnabled\">\n\t<button class=\"btn btn-sm btn-outline-primary\" (click)=\"isAddEnabled = true\">\n\t  <i class=\"fa fa-plus-circle\" aria-hidden=\"true\"></i> Add Members\n\t</button>\n  </div>\n  <section id=\"members\"\n  *ngIf=\"!isAddEnabled\">\n<div [class.hideTable]=\"totalUnfilteredCount === 0\"\n\tclass=\"primeng-datatable-container table-responsive mt-0\">\n\t<p-table #dt\n\t\t[value]=\"subscriptionMembers\"\n\t\t[paginator]=\"totalRecords !== 0\"\n\t\t[rows]=\"PAGE_SIZE\"\n\t\t[lazy]=\"true\"\n\t\t[totalRecords]=\"totalRecords\"\n\t\t[loading]=\"loading\"\n\t\t[filterDelay]=\"1000\"\n\t\t[customSort]=\"true\"\n\t\t(onLazyLoad)=\"onLazyLoad($event)\">\n\t\t<ng-template pTemplate=\"caption\">\n\t\t\t<div class=\"text-end\">\n\t\t\t\t<i class=\"fa fa-search mt-2 me-2\"\n\t\t\t\t\taria-hidden=\"true\"></i>\n\t\t\t\t<input [(ngModel)]=\"searchText\"\n\t\t\t\t\t(input)=\"dt.filterGlobal($event.target.value, 'contains')\"\n\t\t\t\t\ttype=\"text\"\n\t\t\t\t\tpInputText\n\t\t\t\t\tsize=\"50\"\n\t\t\t\t\tplaceholder=\"Search subscription users...\"\n\t\t\t\t\tclass=\"mw-90\">\n\t\t\t</div>\n\t\t</ng-template>\n\t\t<ng-template pTemplate=\"header\">\n\t\t\t<tr>\n\t\t\t\t<th scope=\"true\"\n\t\t\t\t\tpSortableColumn=\"id\">\n\t\t\t\t\t{{ 'Admin.Users.Id' | transloco }}\n\t\t\t\t\t<p-sortIcon field=\"id\"></p-sortIcon>\n\t\t\t\t</th>\n\t\t\t\t<th scope=\"true\"\n\t\t\t\t\tpSortableColumn=\"first_name\">\n\t\t\t\t\t{{ 'Label.FirstName' | transloco }}\n\t\t\t\t</th>\n\t\t\t\t<th scope=\"true\"\n\t\t\t\t\tpSortableColumn=\"last_name\">\n\t\t\t\t\t{{ 'Label.LastName' | transloco }}\n\t\t\t\t\t<p-sortIcon field=\"last_name\"></p-sortIcon>\n\t\t\t\t</th>\n\t\t\t\t<th scope=\"true\"\n\t\t\t\t\tpSortableColumn=\"email\">\n\t\t\t\t\t{{ 'Label.Email' | transloco }}\n\t\t\t\t\t<p-sortIcon field=\"email\"></p-sortIcon>\n\t\t\t\t</th>\n\t\t\t\t<th scope=\"true\"\n\t\t\t\t\tpSortableColumn=\"slug\">\n\t\t\t\t\t{{ 'Admin.Subscriptions.NickName' | transloco }}\n\t\t\t\t\t<p-sortIcon field=\"slug\"></p-sortIcon>\n\t\t\t\t</th>\n\t\t\t\t<th scope=\"true\"\n\t\t\t\t\tpSortableColumn=\"has_password\">\n\t\t\t\t\t{{ 'Admin.Subscriptions.EmailConfirmed' | transloco }}\n\t\t\t\t\t<p-sortIcon field=\"has_password\"></p-sortIcon>\n\t\t\t\t</th>\n\t\t\t\t<th scope=\"true\"\n\t\t\t\t\tpSortableColumn=\"last_sign_in_at\">\n\t\t\t\t\t{{ 'Admin.Subscriptions.LastLogin' | transloco }}\n\t\t\t\t\t<p-sortIcon field=\"last_sign_in_at\"></p-sortIcon>\n\t\t\t\t</th>\n\t\t\t\t<th scope=\"true\">\n\t\t\t\t\t{{ 'Label.Actions' | transloco }}\n\t\t\t\t</th>\n\t\t\t</tr>\n\t\t</ng-template>\n\t\t<ng-template pTemplate=\"body\"\n\t\t\tlet-user>\n\t\t\t<tr>\n\t\t\t\t<td data-head=\"Id\">{{ user.id }}</td>\n\t\t\t\t<td data-head=\"First Name\">\n\t\t\t\t\t<span class=\"first-name\">{{ user.first_name }}</span>\n\t\t\t\t\t<ng-template [ngIf]=\"subscriptionOwnerUserId === user.id\">\n\t\t\t\t\t\t<span *rbacAllow=\"'Pages.Alpha'\" ngbTooltip=\"Subscription Owner\">\n\t\t\t\t\t\t\t<i class=\"info-icon fas fa-user-tie success\" aria-hidden=\"true\"></i>\n\t\t\t\t\t\t</span>\n\t\t\t\t\t</ng-template>\n\t\t\t\t</td>\n\t\t\t\t<td data-head=\"Last Name\">\n\t\t\t\t\t{{ user.last_name }}\n\t\t\t\t\t<span *ngIf=\"user?.alpha\"\n\t\t\t\t\t\t[pTooltip]=\"'Admin.Users.Tooltip.AlphaIcon'|transloco\"\n\t\t\t\t\t\ttooltipPosition=\"top\">\n\t\t\t\t\t\t<i class=\"fa-regular fa-square-a alpha-beta text-warning\"></i>\n\t\t\t\t\t</span>\n\t\t\t\t\t<span *ngIf=\"user?.beta\"\n\t\t\t\t\t\t[pTooltip]=\"'Admin.Users.Tooltip.BetaIcon'|transloco\"\n\t\t\t\t\t\tclass=\"ms-2\"\n\t\t\t\t\t\ttooltipPosition=\"top\">\n\t\t\t\t\t\t<i class=\"fa-regular fa-square-b alpha-beta text-primary\"></i>\n\t\t\t\t\t</span>\n\t\t\t\t\t<span *ngIf=\"user?.cognito_sso_activated\"\n\t\t\t\t\t\tclass=\"ms-2\"\n\t\t\t\t\t\t[pTooltip]=\"'Admin.Users.Tooltip.Cognito' | transloco\"\n\t\t\t\t\t\ttooltipPosition=\"top\">\n\t\t\t\t\t\t<i class=\"fa fa-cloud success\" ></i>\n\t\t\t\t\t</span>\n\t\t\t\t</td>\n\t\t\t\t<td data-head=\"Email\">{{ user.email }}</td>\n\t\t\t\t<td data-head=\"Nick Name\">\n\t\t\t\t\t<a [routerLink]=\"['/members', user.slug]\">{{ user.slug }}</a>\n\t\t\t\t</td>\n\t\t\t\t<td data-head=\"Email Confirm\">\n\t\t\t\t\t<span [appDynamicBadge]=\"{ itemsArray: [true, false], item: user?.has_password }\"\n\t\t\t\t\t\tcolor=\"success-danger\"\n\t\t\t\t\t\tclass=\"badge\">\n\t\t\t\t\t\t{{ user?.has_password ? 'Yes' : 'No' }}\n\t\t\t\t\t</span>\n\t\t\t\t\t<span *ngIf=\"user?.blocked\"\n\t\t\t\t\t\t[pTooltip]=\"'This user has been blocked'\"\n\t\t\t\t\t\tclass=\"ms-2\"\n\t\t\t\t\t\ttooltipPosition=\"top\">\n\t\t\t\t\t\t<i class=\"fa-solid fa-hexagon-exclamation text-danger hexa-warning\"></i>\n\t\t\t\t\t</span>\n\t\t\t\t</td>\n\t\t\t\t<td data-head=\"Last Login\">\n\t\t\t\t\t<span *ngIf=\"user?.current_sign_in_at; else lastSignin\">\n\t\t\t\t\t\t<span>\n\t\t\t\t\t\t\t{{ user.current_sign_in_at | dateFormat }}\n\t\t\t\t\t\t</span>\n\t\t\t\t\t\t<span *ngIf=\"user.current_sign_in_at\">\n\t\t\t\t\t\t\t&nbsp;({{ user.current_sign_in_at | sinceAgo }})\n\t\t\t\t\t\t</span>\n\t\t\t\t\t</span>\n\t\t\t\t\t<ng-template #lastSignin>\n\t\t\t\t\t\t<span>\n\t\t\t\t\t\t\t<span>\n\t\t\t\t\t\t\t\t{{ user.last_sign_in_at | dateFormat }}\n\t\t\t\t\t\t\t</span>\n\t\t\t\t\t\t\t<span *ngIf=\"user.last_sign_in_at\">\n\t\t\t\t\t\t\t\t&nbsp;({{ user.last_sign_in_at | sinceAgo }})\n\t\t\t\t\t\t\t</span>\n\t\t\t\t\t\t</span>\n\t\t\t\t\t</ng-template>\n\t\t\t\t</td>\n\t\t\t\t<td data-head=\"Action\">\n\t\t\t\t\t<ul class=\"list-unstyled list-inline list-action\">\n\t\t\t\t\t\t<li *rbacAllow=\"'Pages.Alpha'\" ngbTooltip=\"Impersonate this user\" class=\"me-2 me-sm-3\">\n\t\t\t\t\t\t<i (click)=\"onImpersonate(user)\" (keydown.enter)=\"onImpersonate(user)\"  class=\"fas fa-people-arrows fa-lg\" aria-hidden=\"true\"></i>\n\t\t\t\t\t\t</li>\n\t\t\t\t\t\t<ng-template [ngIf]=\"subscriptionOwnerUserId !== user.id\">\n\t\t\t\t\t\t\t<li *rbacAllow=\"'Pages.Alpha'\" ngbTooltip=\"Set this user as new owner\" class=\"me-2 me-sm-3\">\n\t\t\t\t\t\t\t\t<i (click)=\"onChangeOwner(user)\" (keydown.enter)=\"onChangeOwner(user)\"  class=\"fa fa-user-crown warning fa-lg\" aria-hidden=\"true\"></i>\n\t\t\t\t\t\t\t</li>\n\t\t\t\t\t\t</ng-template>\n\t\t\t\t\t\t<ng-template [ngIf]=\"user?.enable_two_factor_authenticator\">\n\t\t\t\t\t\t\t<li *rbacAllow=\"'Pages.Alpha'\"\n\t\t\t\t\t\t\t\t(click)=\"disable2fa(user?.id)\"\n\t\t\t\t\t\t\t\t(keydown.enter)=\"disable2fa(user?.id)\"\n\t\t\t\t\t\t\t\tngbTooltip=\"Disable 2FA\"\n\t\t\t\t\t\t\t\tclass=\"me-2 me-sm-3 success\">\n\t\t\t\t\t\t\t\t<i class=\"fa fa-lock\"\n\t\t\t\t\t\t\t\t\taria-hidden=\"true\"></i>\n\t\t\t\t\t\t\t</li>\n\t\t\t\t\t\t</ng-template>\n\t\t\t\t\t\t<li [routerLink]=\"[routers.usersDetails + user.id]\"\n\t\t\t\t\t\t\tngbTooltip=\"Edit\"\n\t\t\t\t\t\t\tclass=\"me-2 me-sm-3\">\n\t\t\t\t\t\t\t<i class=\"fa fa-edit edit-icon\"\n\t\t\t\t\t\t\t\taria-hidden=\"true\"></i>\n\t\t\t\t\t\t</li>\n\t\t\t\t\t\t<li *rbacAllow=\"'Pages.Admin.Users.Delete'\"\n\t\t\t\t\t\t\tngbTooltip=\"Delete\"\n\t\t\t\t\t\t\tclass=\"me-2 me-sm-3\">\n\t\t\t\t\t\t\t<i (click)=\"onDelete(user)\"\n\t\t\t\t\t\t\t\t(keydown.enter)=\"onDelete(user)\"\n\t\t\t\t\t\t\t\tclass=\"fa fa-trash delete-icon\"\n\t\t\t\t\t\t\t\taria-hidden=\"true\"></i>\n\t\t\t\t\t\t</li>\n\t\t\t\t\t</ul>\n\t\t\t\t</td>\n\t\t\t</tr>\n\t\t</ng-template>\n\t</p-table>\n\t<div *ngIf=\"totalRecords === 0 && totalUnfilteredCount !== 0\">\n\t\t<pw-no-data [withImage]=\"true\" [message]=\"'Search.NoDataMessage' | transloco\" [description]=\"'Search.NoDataDescription' | transloco\" >\n\t\t</pw-no-data>\n\t</div>\n\t<span class=\"total-records-count\" *ngIf=\"totalRecords !== 0\">\n\t\t{{ 'Label.Total' | transloco }}: {{ totalRecords }}\n\t</span>\n</div>\n<div *ngIf=\"totalUnfilteredCount === 0 && isLoaded\">\n  <pw-no-data [withImage]=\"true\" [message]=\"'Admin.Subscriptions.NoSubscriptionUsersMessage' | transloco\">\n  </pw-no-data>\n</div>\n\n</section>\n\n\n<section id=\"manage-members\"\n  *ngIf=\"isAddEnabled\">\n  <pw-add-members (membersAdded)=\"onMembersAdded()\"\n  ></pw-add-members>\n</section>\n\n<!-- password validation modal for impersonate -->\n<pw-password-validation #passwordValidationModalForImpersonate\n\t(successEvent)=\"onUserImpersonation($event)\">\n</pw-password-validation>\n<!-- password validation modal for delete user -->\n<pw-password-validation #passwordValidationModalForUserDelete\n\t(successEvent)=\"deleteUser($event)\">\n\t<div class=\"row\">\n\t\t<div class=\"col-12\">\n\t\t\t<p>\n\t\t\t\t{{ 'User.Account.Message.ActionCanNotUndone' | transloco }}\n\t\t\t</p>\n\t\t\t<p>\n\t\t\t\t{{ 'User.Account.Message.ConfirmPassword' | transloco }}\n\t\t\t</p>\n\t\t</div>\n\t</div>\n</pw-password-validation>\n<!-- password validation modal for remove2fa -->\n<pw-password-validation #passwordValidationModalForRemove2fa\n\t(successEvent)=\"remove2fa($event)\">\n</pw-password-validation>\n", styles: [".hexa-warning{font-size:18px;vertical-align:middle}.alpha-beta{font-size:14px}.info-icon{vertical-align:middle;margin-left:5px}.first-name{margin-right:5px}\n"], dependencies: [{ kind: "component", type: i2.Table, selector: "p-table", inputs: ["frozenColumns", "frozenValue", "style", "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", "scrollDirection", "rowGroupMode", "scrollHeight", "virtualScroll", "virtualScrollItemSize", "virtualScrollOptions", "virtualScrollDelay", "frozenWidth", "responsive", "contextMenu", "resizableColumns", "columnResizeMode", "reorderableColumns", "loading", "loadingIcon", "showLoader", "rowHover", "customSort", "showInitialSortBadge", "autoLayout", "exportFunction", "exportHeader", "stateKey", "stateStorage", "editMode", "groupRowsBy", "groupRowsByOrder", "responsiveLayout", "breakpoint", "paginatorLocale", "value", "columns", "first", "rows", "totalRecords", "sortField", "sortOrder", "multiSortMeta", "selection", "selectAll", "virtualRowHeight"], 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$3.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", "appendTo", "positionStyle", "tooltipStyleClass", "tooltipZIndex", "escape", "showDelay", "hideDelay", "life", "positionTop", "positionLeft", "autoHide", "fitContent", "hideOnEscape", "pTooltip", "tooltipDisabled", "tooltipOptions"] }, { kind: "directive", type: i4$1.InputText, selector: "[pInputText]", inputs: ["variant"] }, { kind: "directive", type: i3$1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i3$2.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: i3$2.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i3$2.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "component", type: i9.PasswordValidationComponent, selector: "pw-password-validation", inputs: ["confirmMessage"], outputs: ["successEvent"] }, { kind: "directive", type: i7.RouterLink, selector: "[routerLink]", inputs: ["target", "queryParams", "fragment", "queryParamsHandling", "state", "info", "relativeTo", "preserveFragment", "skipLocationChange", "replaceUrl", "routerLink"] }, { kind: "component", type: i5.ProgressSpinner, selector: "p-progressSpinner", inputs: ["styleClass", "style", "strokeWidth", "fill", "animationDuration", "ariaLabel"] }, { kind: "component", type: i9.NoDataComponent, selector: "pw-no-data", inputs: ["message", "description", "withImage"] }, { kind: "directive", type: i10.DynamicBadgeDirective, selector: "[appDynamicBadge]", inputs: ["appDynamicBadge", "color", "colorByName", "dataName"] }, { kind: "directive", type: i10.RbacAllowDirective, selector: "[rbacAllow]", inputs: ["rbacAllow"] }, { kind: "directive", type: i1$1.NgbTooltip, selector: "[ngbTooltip]", inputs: ["animation", "autoClose", "placement", "popperOptions", "triggers", "positionTarget", "container", "disableTooltip", "tooltipClass", "tooltipContext", "openDelay", "closeDelay", "ngbTooltip"], outputs: ["shown", "hidden"], exportAs: ["ngbTooltip"] }, { kind: "component", type: AddMembersComponent, selector: "pw-add-members", outputs: ["membersAdded"] }, { kind: "pipe", type: i12.TranslocoPipe, name: "transloco" }, { kind: "pipe", type: i13.DateFormatPipe, name: "dateFormat" }, { kind: "pipe", type: i13.SinceAgoPipe, name: "sinceAgo" }] }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.11", ngImport: i0, type: SubscriptionUsersComponent, decorators: [{
             type: Component,
-            args: [{ selector: 'pw-subscription-users', template: "<div class=\"w-100 text-center mt-3\">\n\t<ng-template [ngIf]=\"!isLoaded\">\n\t\t<p-progressSpinner></p-progressSpinner>\n\t</ng-template>\n</div>\n<div [class.hideTable]=\"totalUnfilteredCount === 0\"\n\tclass=\"primeng-datatable-container table-responsive mt-0\">\n\t<p-table #dt\n\t\t[value]=\"subscriptionMembers\"\n\t\t[paginator]=\"totalRecords !== 0\"\n\t\t[rows]=\"PAGE_SIZE\"\n\t\t[lazy]=\"true\"\n\t\t[totalRecords]=\"totalRecords\"\n\t\t[loading]=\"loading\"\n\t\t[filterDelay]=\"1000\"\n\t\t[customSort]=\"true\"\n\t\t(onLazyLoad)=\"onLazyLoad($event)\">\n\t\t<ng-template pTemplate=\"caption\">\n\t\t\t<div class=\"text-end\">\n\t\t\t\t<i class=\"fa fa-search mt-2 me-2\"\n\t\t\t\t\taria-hidden=\"true\"></i>\n\t\t\t\t<input [(ngModel)]=\"searchText\"\n\t\t\t\t\t(input)=\"dt.filterGlobal($event.target.value, 'contains')\"\n\t\t\t\t\ttype=\"text\"\n\t\t\t\t\tpInputText\n\t\t\t\t\tsize=\"50\"\n\t\t\t\t\tplaceholder=\"Search subscription users...\"\n\t\t\t\t\tclass=\"mw-90\">\n\t\t\t</div>\n\t\t</ng-template>\n\t\t<ng-template pTemplate=\"header\">\n\t\t\t<tr>\n\t\t\t\t<th scope=\"true\"\n\t\t\t\t\tpSortableColumn=\"id\">\n\t\t\t\t\t{{ 'Admin.Users.Id' | transloco }}\n\t\t\t\t\t<p-sortIcon field=\"id\"></p-sortIcon>\n\t\t\t\t</th>\n\t\t\t\t<th scope=\"true\"\n\t\t\t\t\tpSortableColumn=\"first_name\">\n\t\t\t\t\t{{ 'Label.FirstName' | transloco }}\n\t\t\t\t</th>\n\t\t\t\t<th scope=\"true\"\n\t\t\t\t\tpSortableColumn=\"last_name\">\n\t\t\t\t\t{{ 'Label.LastName' | transloco }}\n\t\t\t\t\t<p-sortIcon field=\"last_name\"></p-sortIcon>\n\t\t\t\t</th>\n\t\t\t\t<th scope=\"true\"\n\t\t\t\t\tpSortableColumn=\"email\">\n\t\t\t\t\t{{ 'Label.Email' | transloco }}\n\t\t\t\t\t<p-sortIcon field=\"email\"></p-sortIcon>\n\t\t\t\t</th>\n\t\t\t\t<th scope=\"true\"\n\t\t\t\t\tpSortableColumn=\"slug\">\n\t\t\t\t\t{{ 'Admin.Subscriptions.NickName' | transloco }}\n\t\t\t\t\t<p-sortIcon field=\"slug\"></p-sortIcon>\n\t\t\t\t</th>\n\t\t\t\t<th scope=\"true\"\n\t\t\t\t\tpSortableColumn=\"has_password\">\n\t\t\t\t\t{{ 'Admin.Subscriptions.EmailConfirmed' | transloco }}\n\t\t\t\t\t<p-sortIcon field=\"has_password\"></p-sortIcon>\n\t\t\t\t</th>\n\t\t\t\t<th scope=\"true\"\n\t\t\t\t\tpSortableColumn=\"last_sign_in_at\">\n\t\t\t\t\t{{ 'Admin.Subscriptions.LastLogin' | transloco }}\n\t\t\t\t\t<p-sortIcon field=\"last_sign_in_at\"></p-sortIcon>\n\t\t\t\t</th>\n\t\t\t\t<th scope=\"true\">\n\t\t\t\t\t{{ 'Label.Actions' | transloco }}\n\t\t\t\t</th>\n\t\t\t</tr>\n\t\t</ng-template>\n\t\t<ng-template pTemplate=\"body\"\n\t\t\tlet-user>\n\t\t\t<tr>\n\t\t\t\t<td data-head=\"Id\">{{ user.id }}</td>\n\t\t\t\t<td data-head=\"First Name\">\n\t\t\t\t\t<span class=\"first-name\">{{ user.first_name }}</span>\n\t\t\t\t\t<ng-template [ngIf]=\"subscriptionOwnerUserId === user.id\">\n\t\t\t\t\t\t<span *rbacAllow=\"'Pages.Alpha'\" ngbTooltip=\"Subscription Owner\">\n\t\t\t\t\t\t\t<i class=\"info-icon fas fa-user-tie success\" aria-hidden=\"true\"></i>\n\t\t\t\t\t\t</span>\n\t\t\t\t\t</ng-template>\n\t\t\t\t</td>\n\t\t\t\t<td data-head=\"Last Name\">\n\t\t\t\t\t{{ user.last_name }}\n\t\t\t\t\t<span *ngIf=\"user?.alpha\"\n\t\t\t\t\t\t[pTooltip]=\"'Admin.Users.Tooltip.AlphaIcon'|transloco\"\n\t\t\t\t\t\ttooltipPosition=\"top\">\n\t\t\t\t\t\t<i class=\"fa-regular fa-square-a alpha-beta text-warning\"></i>\n\t\t\t\t\t</span>\n\t\t\t\t\t<span *ngIf=\"user?.beta\"\n\t\t\t\t\t\t[pTooltip]=\"'Admin.Users.Tooltip.BetaIcon'|transloco\"\n\t\t\t\t\t\tclass=\"ms-2\"\n\t\t\t\t\t\ttooltipPosition=\"top\">\n\t\t\t\t\t\t<i class=\"fa-regular fa-square-b alpha-beta text-primary\"></i>\n\t\t\t\t\t</span>\n\t\t\t\t\t<span *ngIf=\"user?.cognito_sso_activated\"\n\t\t\t\t\t\tclass=\"ms-2\"\n\t\t\t\t\t\t[pTooltip]=\"'Admin.Users.Tooltip.Cognito' | transloco\"\n\t\t\t\t\t\ttooltipPosition=\"top\">\n\t\t\t\t\t\t<i class=\"fa fa-cloud success\" ></i>\n\t\t\t\t\t</span>\n\t\t\t\t</td>\n\t\t\t\t<td data-head=\"Email\">{{ user.email }}</td>\n\t\t\t\t<td data-head=\"Nick Name\">\n\t\t\t\t\t<a [routerLink]=\"['/members', user.slug]\">{{ user.slug }}</a>\n\t\t\t\t</td>\n\t\t\t\t<td data-head=\"Email Confirm\">\n\t\t\t\t\t<span [appDynamicBadge]=\"{ itemsArray: [true, false], item: user?.has_password }\"\n\t\t\t\t\t\tcolor=\"success-danger\"\n\t\t\t\t\t\tclass=\"badge\">\n\t\t\t\t\t\t{{ user?.has_password ? 'Yes' : 'No' }}\n\t\t\t\t\t</span>\n\t\t\t\t\t<span *ngIf=\"user?.blocked\"\n\t\t\t\t\t\t[pTooltip]=\"'This user has been blocked'\"\n\t\t\t\t\t\tclass=\"ms-2\"\n\t\t\t\t\t\ttooltipPosition=\"top\">\n\t\t\t\t\t\t<i class=\"fa-solid fa-hexagon-exclamation text-danger hexa-warning\"></i>\n\t\t\t\t\t</span>\n\t\t\t\t</td>\n\t\t\t\t<td data-head=\"Last Login\">\n\t\t\t\t\t<span *ngIf=\"user?.current_sign_in_at; else lastSignin\">\n\t\t\t\t\t\t<span>\n\t\t\t\t\t\t\t{{ user.current_sign_in_at | dateFormat }}\n\t\t\t\t\t\t</span>\n\t\t\t\t\t\t<span *ngIf=\"user.current_sign_in_at\">\n\t\t\t\t\t\t\t&nbsp;({{ user.current_sign_in_at | sinceAgo }})\n\t\t\t\t\t\t</span>\n\t\t\t\t\t</span>\n\t\t\t\t\t<ng-template #lastSignin>\n\t\t\t\t\t\t<span>\n\t\t\t\t\t\t\t<span>\n\t\t\t\t\t\t\t\t{{ user.last_sign_in_at | dateFormat }}\n\t\t\t\t\t\t\t</span>\n\t\t\t\t\t\t\t<span *ngIf=\"user.last_sign_in_at\">\n\t\t\t\t\t\t\t\t&nbsp;({{ user.last_sign_in_at | sinceAgo }})\n\t\t\t\t\t\t\t</span>\n\t\t\t\t\t\t</span>\n\t\t\t\t\t</ng-template>\n\t\t\t\t</td>\n\t\t\t\t<td data-head=\"Action\">\n\t\t\t\t\t<ul class=\"list-unstyled list-inline list-action\">\n\t\t\t\t\t\t<li *rbacAllow=\"'Pages.Alpha'\" ngbTooltip=\"Impersonate this user\" class=\"me-2 me-sm-3\">\n\t\t\t\t\t\t<i (click)=\"onImpersonate(user)\" (keydown.enter)=\"onImpersonate(user)\"  class=\"fas fa-people-arrows fa-lg\" aria-hidden=\"true\"></i>\n\t\t\t\t\t\t</li>\n\t\t\t\t\t\t<ng-template [ngIf]=\"subscriptionOwnerUserId !== user.id\">\n\t\t\t\t\t\t\t<li *rbacAllow=\"'Pages.Alpha'\" ngbTooltip=\"Set this user as new owner\" class=\"me-2 me-sm-3\">\n\t\t\t\t\t\t\t\t<i (click)=\"onChangeOwner(user)\" (keydown.enter)=\"onChangeOwner(user)\"  class=\"fa fa-user-crown warning fa-lg\" aria-hidden=\"true\"></i>\n\t\t\t\t\t\t\t</li>\n\t\t\t\t\t\t</ng-template>\n\t\t\t\t\t\t<ng-template [ngIf]=\"user?.enable_two_factor_authenticator\">\n\t\t\t\t\t\t\t<li *rbacAllow=\"'Pages.Alpha'\"\n\t\t\t\t\t\t\t\t(click)=\"disable2fa(user?.id)\"\n\t\t\t\t\t\t\t\t(keydown.enter)=\"disable2fa(user?.id)\"\n\t\t\t\t\t\t\t\tngbTooltip=\"Disable 2FA\"\n\t\t\t\t\t\t\t\tclass=\"me-2 me-sm-3 success\">\n\t\t\t\t\t\t\t\t<i class=\"fa fa-lock\"\n\t\t\t\t\t\t\t\t\taria-hidden=\"true\"></i>\n\t\t\t\t\t\t\t</li>\n\t\t\t\t\t\t</ng-template>\n\t\t\t\t\t\t<li [routerLink]=\"[routers.usersDetails + user.id]\"\n\t\t\t\t\t\t\tngbTooltip=\"Edit\"\n\t\t\t\t\t\t\tclass=\"me-2 me-sm-3\">\n\t\t\t\t\t\t\t<i class=\"fa fa-edit edit-icon\"\n\t\t\t\t\t\t\t\taria-hidden=\"true\"></i>\n\t\t\t\t\t\t</li>\n\t\t\t\t\t\t<li *rbacAllow=\"'Pages.Admin.Users.Delete'\"\n\t\t\t\t\t\t\tngbTooltip=\"Delete\"\n\t\t\t\t\t\t\tclass=\"me-2 me-sm-3\">\n\t\t\t\t\t\t\t<i (click)=\"onDelete(user)\"\n\t\t\t\t\t\t\t\t(keydown.enter)=\"onDelete(user)\"\n\t\t\t\t\t\t\t\tclass=\"fa fa-trash delete-icon\"\n\t\t\t\t\t\t\t\taria-hidden=\"true\"></i>\n\t\t\t\t\t\t</li>\n\t\t\t\t\t</ul>\n\t\t\t\t</td>\n\t\t\t</tr>\n\t\t</ng-template>\n\t</p-table>\n\t<div *ngIf=\"totalRecords === 0 && totalUnfilteredCount !== 0\">\n\t\t<pw-no-data [withImage]=\"true\" [message]=\"'Search.NoDataMessage' | transloco\" [description]=\"'Search.NoDataDescription' | transloco\" >\n\t\t</pw-no-data>\n\t</div>\n\t<span class=\"total-records-count\" *ngIf=\"totalRecords !== 0\">\n\t\t{{ 'Label.Total' | transloco }}: {{ totalRecords }}\n\t</span>\n</div>\n<div *ngIf=\"totalUnfilteredCount === 0 && isLoaded\">\n  <pw-no-data [withImage]=\"true\" [message]=\"'Admin.Subscriptions.NoSubscriptionUsersMessage' | transloco\">\n  </pw-no-data>\n</div>\n<!-- password validation modal for impersonate -->\n<pw-password-validation #passwordValidationModalForImpersonate\n\t(successEvent)=\"onUserImpersonation($event)\">\n</pw-password-validation>\n<!-- password validation modal for delete user -->\n<pw-password-validation #passwordValidationModalForUserDelete\n\t(successEvent)=\"deleteUser($event)\">\n\t<div class=\"row\">\n\t\t<div class=\"col-12\">\n\t\t\t<p>\n\t\t\t\t{{ 'User.Account.Message.ActionCanNotUndone' | transloco }}\n\t\t\t</p>\n\t\t\t<p>\n\t\t\t\t{{ 'User.Account.Message.ConfirmPassword' | transloco }}\n\t\t\t</p>\n\t\t</div>\n\t</div>\n</pw-password-validation>\n<!-- password validation modal for remove2fa -->\n<pw-password-validation #passwordValidationModalForRemove2fa\n\t(successEvent)=\"remove2fa($event)\">\n</pw-password-validation>\n", styles: [".hexa-warning{font-size:18px;vertical-align:middle}.alpha-beta{font-size:14px}.info-icon{vertical-align:middle;margin-left:5px}.first-name{margin-right:5px}\n"] }]
+            args: [{ selector: 'pw-subscription-users', template: "<div class=\"w-100 text-center mt-3\">\n\t<ng-template [ngIf]=\"!isLoaded\">\n\t\t<p-progressSpinner></p-progressSpinner>\n\t</ng-template>\n</div>\n<div class=\"text-end mb-2\" *ngIf=\"hasAccess && !isAddEnabled\">\n\t<button class=\"btn btn-sm btn-outline-primary\" (click)=\"isAddEnabled = true\">\n\t  <i class=\"fa fa-plus-circle\" aria-hidden=\"true\"></i> Add Members\n\t</button>\n  </div>\n  <section id=\"members\"\n  *ngIf=\"!isAddEnabled\">\n<div [class.hideTable]=\"totalUnfilteredCount === 0\"\n\tclass=\"primeng-datatable-container table-responsive mt-0\">\n\t<p-table #dt\n\t\t[value]=\"subscriptionMembers\"\n\t\t[paginator]=\"totalRecords !== 0\"\n\t\t[rows]=\"PAGE_SIZE\"\n\t\t[lazy]=\"true\"\n\t\t[totalRecords]=\"totalRecords\"\n\t\t[loading]=\"loading\"\n\t\t[filterDelay]=\"1000\"\n\t\t[customSort]=\"true\"\n\t\t(onLazyLoad)=\"onLazyLoad($event)\">\n\t\t<ng-template pTemplate=\"caption\">\n\t\t\t<div class=\"text-end\">\n\t\t\t\t<i class=\"fa fa-search mt-2 me-2\"\n\t\t\t\t\taria-hidden=\"true\"></i>\n\t\t\t\t<input [(ngModel)]=\"searchText\"\n\t\t\t\t\t(input)=\"dt.filterGlobal($event.target.value, 'contains')\"\n\t\t\t\t\ttype=\"text\"\n\t\t\t\t\tpInputText\n\t\t\t\t\tsize=\"50\"\n\t\t\t\t\tplaceholder=\"Search subscription users...\"\n\t\t\t\t\tclass=\"mw-90\">\n\t\t\t</div>\n\t\t</ng-template>\n\t\t<ng-template pTemplate=\"header\">\n\t\t\t<tr>\n\t\t\t\t<th scope=\"true\"\n\t\t\t\t\tpSortableColumn=\"id\">\n\t\t\t\t\t{{ 'Admin.Users.Id' | transloco }}\n\t\t\t\t\t<p-sortIcon field=\"id\"></p-sortIcon>\n\t\t\t\t</th>\n\t\t\t\t<th scope=\"true\"\n\t\t\t\t\tpSortableColumn=\"first_name\">\n\t\t\t\t\t{{ 'Label.FirstName' | transloco }}\n\t\t\t\t</th>\n\t\t\t\t<th scope=\"true\"\n\t\t\t\t\tpSortableColumn=\"last_name\">\n\t\t\t\t\t{{ 'Label.LastName' | transloco }}\n\t\t\t\t\t<p-sortIcon field=\"last_name\"></p-sortIcon>\n\t\t\t\t</th>\n\t\t\t\t<th scope=\"true\"\n\t\t\t\t\tpSortableColumn=\"email\">\n\t\t\t\t\t{{ 'Label.Email' | transloco }}\n\t\t\t\t\t<p-sortIcon field=\"email\"></p-sortIcon>\n\t\t\t\t</th>\n\t\t\t\t<th scope=\"true\"\n\t\t\t\t\tpSortableColumn=\"slug\">\n\t\t\t\t\t{{ 'Admin.Subscriptions.NickName' | transloco }}\n\t\t\t\t\t<p-sortIcon field=\"slug\"></p-sortIcon>\n\t\t\t\t</th>\n\t\t\t\t<th scope=\"true\"\n\t\t\t\t\tpSortableColumn=\"has_password\">\n\t\t\t\t\t{{ 'Admin.Subscriptions.EmailConfirmed' | transloco }}\n\t\t\t\t\t<p-sortIcon field=\"has_password\"></p-sortIcon>\n\t\t\t\t</th>\n\t\t\t\t<th scope=\"true\"\n\t\t\t\t\tpSortableColumn=\"last_sign_in_at\">\n\t\t\t\t\t{{ 'Admin.Subscriptions.LastLogin' | transloco }}\n\t\t\t\t\t<p-sortIcon field=\"last_sign_in_at\"></p-sortIcon>\n\t\t\t\t</th>\n\t\t\t\t<th scope=\"true\">\n\t\t\t\t\t{{ 'Label.Actions' | transloco }}\n\t\t\t\t</th>\n\t\t\t</tr>\n\t\t</ng-template>\n\t\t<ng-template pTemplate=\"body\"\n\t\t\tlet-user>\n\t\t\t<tr>\n\t\t\t\t<td data-head=\"Id\">{{ user.id }}</td>\n\t\t\t\t<td data-head=\"First Name\">\n\t\t\t\t\t<span class=\"first-name\">{{ user.first_name }}</span>\n\t\t\t\t\t<ng-template [ngIf]=\"subscriptionOwnerUserId === user.id\">\n\t\t\t\t\t\t<span *rbacAllow=\"'Pages.Alpha'\" ngbTooltip=\"Subscription Owner\">\n\t\t\t\t\t\t\t<i class=\"info-icon fas fa-user-tie success\" aria-hidden=\"true\"></i>\n\t\t\t\t\t\t</span>\n\t\t\t\t\t</ng-template>\n\t\t\t\t</td>\n\t\t\t\t<td data-head=\"Last Name\">\n\t\t\t\t\t{{ user.last_name }}\n\t\t\t\t\t<span *ngIf=\"user?.alpha\"\n\t\t\t\t\t\t[pTooltip]=\"'Admin.Users.Tooltip.AlphaIcon'|transloco\"\n\t\t\t\t\t\ttooltipPosition=\"top\">\n\t\t\t\t\t\t<i class=\"fa-regular fa-square-a alpha-beta text-warning\"></i>\n\t\t\t\t\t</span>\n\t\t\t\t\t<span *ngIf=\"user?.beta\"\n\t\t\t\t\t\t[pTooltip]=\"'Admin.Users.Tooltip.BetaIcon'|transloco\"\n\t\t\t\t\t\tclass=\"ms-2\"\n\t\t\t\t\t\ttooltipPosition=\"top\">\n\t\t\t\t\t\t<i class=\"fa-regular fa-square-b alpha-beta text-primary\"></i>\n\t\t\t\t\t</span>\n\t\t\t\t\t<span *ngIf=\"user?.cognito_sso_activated\"\n\t\t\t\t\t\tclass=\"ms-2\"\n\t\t\t\t\t\t[pTooltip]=\"'Admin.Users.Tooltip.Cognito' | transloco\"\n\t\t\t\t\t\ttooltipPosition=\"top\">\n\t\t\t\t\t\t<i class=\"fa fa-cloud success\" ></i>\n\t\t\t\t\t</span>\n\t\t\t\t</td>\n\t\t\t\t<td data-head=\"Email\">{{ user.email }}</td>\n\t\t\t\t<td data-head=\"Nick Name\">\n\t\t\t\t\t<a [routerLink]=\"['/members', user.slug]\">{{ user.slug }}</a>\n\t\t\t\t</td>\n\t\t\t\t<td data-head=\"Email Confirm\">\n\t\t\t\t\t<span [appDynamicBadge]=\"{ itemsArray: [true, false], item: user?.has_password }\"\n\t\t\t\t\t\tcolor=\"success-danger\"\n\t\t\t\t\t\tclass=\"badge\">\n\t\t\t\t\t\t{{ user?.has_password ? 'Yes' : 'No' }}\n\t\t\t\t\t</span>\n\t\t\t\t\t<span *ngIf=\"user?.blocked\"\n\t\t\t\t\t\t[pTooltip]=\"'This user has been blocked'\"\n\t\t\t\t\t\tclass=\"ms-2\"\n\t\t\t\t\t\ttooltipPosition=\"top\">\n\t\t\t\t\t\t<i class=\"fa-solid fa-hexagon-exclamation text-danger hexa-warning\"></i>\n\t\t\t\t\t</span>\n\t\t\t\t</td>\n\t\t\t\t<td data-head=\"Last Login\">\n\t\t\t\t\t<span *ngIf=\"user?.current_sign_in_at; else lastSignin\">\n\t\t\t\t\t\t<span>\n\t\t\t\t\t\t\t{{ user.current_sign_in_at | dateFormat }}\n\t\t\t\t\t\t</span>\n\t\t\t\t\t\t<span *ngIf=\"user.current_sign_in_at\">\n\t\t\t\t\t\t\t&nbsp;({{ user.current_sign_in_at | sinceAgo }})\n\t\t\t\t\t\t</span>\n\t\t\t\t\t</span>\n\t\t\t\t\t<ng-template #lastSignin>\n\t\t\t\t\t\t<span>\n\t\t\t\t\t\t\t<span>\n\t\t\t\t\t\t\t\t{{ user.last_sign_in_at | dateFormat }}\n\t\t\t\t\t\t\t</span>\n\t\t\t\t\t\t\t<span *ngIf=\"user.last_sign_in_at\">\n\t\t\t\t\t\t\t\t&nbsp;({{ user.last_sign_in_at | sinceAgo }})\n\t\t\t\t\t\t\t</span>\n\t\t\t\t\t\t</span>\n\t\t\t\t\t</ng-template>\n\t\t\t\t</td>\n\t\t\t\t<td data-head=\"Action\">\n\t\t\t\t\t<ul class=\"list-unstyled list-inline list-action\">\n\t\t\t\t\t\t<li *rbacAllow=\"'Pages.Alpha'\" ngbTooltip=\"Impersonate this user\" class=\"me-2 me-sm-3\">\n\t\t\t\t\t\t<i (click)=\"onImpersonate(user)\" (keydown.enter)=\"onImpersonate(user)\"  class=\"fas fa-people-arrows fa-lg\" aria-hidden=\"true\"></i>\n\t\t\t\t\t\t</li>\n\t\t\t\t\t\t<ng-template [ngIf]=\"subscriptionOwnerUserId !== user.id\">\n\t\t\t\t\t\t\t<li *rbacAllow=\"'Pages.Alpha'\" ngbTooltip=\"Set this user as new owner\" class=\"me-2 me-sm-3\">\n\t\t\t\t\t\t\t\t<i (click)=\"onChangeOwner(user)\" (keydown.enter)=\"onChangeOwner(user)\"  class=\"fa fa-user-crown warning fa-lg\" aria-hidden=\"true\"></i>\n\t\t\t\t\t\t\t</li>\n\t\t\t\t\t\t</ng-template>\n\t\t\t\t\t\t<ng-template [ngIf]=\"user?.enable_two_factor_authenticator\">\n\t\t\t\t\t\t\t<li *rbacAllow=\"'Pages.Alpha'\"\n\t\t\t\t\t\t\t\t(click)=\"disable2fa(user?.id)\"\n\t\t\t\t\t\t\t\t(keydown.enter)=\"disable2fa(user?.id)\"\n\t\t\t\t\t\t\t\tngbTooltip=\"Disable 2FA\"\n\t\t\t\t\t\t\t\tclass=\"me-2 me-sm-3 success\">\n\t\t\t\t\t\t\t\t<i class=\"fa fa-lock\"\n\t\t\t\t\t\t\t\t\taria-hidden=\"true\"></i>\n\t\t\t\t\t\t\t</li>\n\t\t\t\t\t\t</ng-template>\n\t\t\t\t\t\t<li [routerLink]=\"[routers.usersDetails + user.id]\"\n\t\t\t\t\t\t\tngbTooltip=\"Edit\"\n\t\t\t\t\t\t\tclass=\"me-2 me-sm-3\">\n\t\t\t\t\t\t\t<i class=\"fa fa-edit edit-icon\"\n\t\t\t\t\t\t\t\taria-hidden=\"true\"></i>\n\t\t\t\t\t\t</li>\n\t\t\t\t\t\t<li *rbacAllow=\"'Pages.Admin.Users.Delete'\"\n\t\t\t\t\t\t\tngbTooltip=\"Delete\"\n\t\t\t\t\t\t\tclass=\"me-2 me-sm-3\">\n\t\t\t\t\t\t\t<i (click)=\"onDelete(user)\"\n\t\t\t\t\t\t\t\t(keydown.enter)=\"onDelete(user)\"\n\t\t\t\t\t\t\t\tclass=\"fa fa-trash delete-icon\"\n\t\t\t\t\t\t\t\taria-hidden=\"true\"></i>\n\t\t\t\t\t\t</li>\n\t\t\t\t\t</ul>\n\t\t\t\t</td>\n\t\t\t</tr>\n\t\t</ng-template>\n\t</p-table>\n\t<div *ngIf=\"totalRecords === 0 && totalUnfilteredCount !== 0\">\n\t\t<pw-no-data [withImage]=\"true\" [message]=\"'Search.NoDataMessage' | transloco\" [description]=\"'Search.NoDataDescription' | transloco\" >\n\t\t</pw-no-data>\n\t</div>\n\t<span class=\"total-records-count\" *ngIf=\"totalRecords !== 0\">\n\t\t{{ 'Label.Total' | transloco }}: {{ totalRecords }}\n\t</span>\n</div>\n<div *ngIf=\"totalUnfilteredCount === 0 && isLoaded\">\n  <pw-no-data [withImage]=\"true\" [message]=\"'Admin.Subscriptions.NoSubscriptionUsersMessage' | transloco\">\n  </pw-no-data>\n</div>\n\n</section>\n\n\n<section id=\"manage-members\"\n  *ngIf=\"isAddEnabled\">\n  <pw-add-members (membersAdded)=\"onMembersAdded()\"\n  ></pw-add-members>\n</section>\n\n<!-- password validation modal for impersonate -->\n<pw-password-validation #passwordValidationModalForImpersonate\n\t(successEvent)=\"onUserImpersonation($event)\">\n</pw-password-validation>\n<!-- password validation modal for delete user -->\n<pw-password-validation #passwordValidationModalForUserDelete\n\t(successEvent)=\"deleteUser($event)\">\n\t<div class=\"row\">\n\t\t<div class=\"col-12\">\n\t\t\t<p>\n\t\t\t\t{{ 'User.Account.Message.ActionCanNotUndone' | transloco }}\n\t\t\t</p>\n\t\t\t<p>\n\t\t\t\t{{ 'User.Account.Message.ConfirmPassword' | transloco }}\n\t\t\t</p>\n\t\t</div>\n\t</div>\n</pw-password-validation>\n<!-- password validation modal for remove2fa -->\n<pw-password-validation #passwordValidationModalForRemove2fa\n\t(successEvent)=\"remove2fa($event)\">\n</pw-password-validation>\n", styles: [".hexa-warning{font-size:18px;vertical-align:middle}.alpha-beta{font-size:14px}.info-icon{vertical-align:middle;margin-left:5px}.first-name{margin-right:5px}\n"] }]
         }], ctorParameters: () => [{ type: i1$2.SubscriptionService }, { type: i0.Injector }, { type: i0.ChangeDetectorRef }, { type: i1$2.AuthService }, { type: i1$2.WindowService }, { type: i1.AdminService }, { type: i1$2.CustomToastService }], propDecorators: { passwordValidationModalForImpersonate: [{
                 type: ViewChild,
                 args: ['passwordValidationModalForImpersonate', { static: false }]
@@ -10530,6 +10846,7 @@ class AdminModule {
             GlobalConfigTabsComponent,
             SubscriptionProductsComponent,
             SubscriptionUsersComponent,
+            AddMembersComponent,
             SubscriptionAgentsListComponent,
             SubscriptionInsightTabsComponent,
             ContactUsListComponent,
@@ -10546,6 +10863,8 @@ class AdminModule {
             InputTextModule, i1$3.NgxDaterangepickerMd, NgxJsonViewerModule,
             CalendarModule,
             PlotlyViaCDNModule,
+            FileUploadModule,
+            NgxUploaderModule,
             CommonModule,
             UiSwitchModule,
             SharedComponentsModule,
@@ -10578,6 +10897,8 @@ class AdminModule {
             NgxJsonViewerModule,
             CalendarModule,
             PlotlyViaCDNModule,
+            FileUploadModule,
+            NgxUploaderModule,
             CommonModule,
             UiSwitchModule,
             SharedComponentsModule,
@@ -10696,6 +11017,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.11", ngImpo
                         GlobalConfigTabsComponent,
                         SubscriptionProductsComponent,
                         SubscriptionUsersComponent,
+                        AddMembersComponent,
                         SubscriptionAgentsListComponent,
                         SubscriptionInsightTabsComponent,
                         ContactUsListComponent,
@@ -10711,6 +11033,8 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.11", ngImpo
                         NgxJsonViewerModule,
                         CalendarModule,
                         PlotlyViaCDNModule,
+                        FileUploadModule,
+                        NgxUploaderModule,
                         CommonModule,
                         UiSwitchModule,
                         SharedComponentsModule,