@posiwise/enterprise-module 0.0.100 → 0.0.102

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (17) hide show
  1. package/fesm2022/posiwise-enterprise-module.mjs +158 -86
  2. package/fesm2022/posiwise-enterprise-module.mjs.map +1 -1
  3. package/package.json +6 -6
  4. package/types/posiwise-enterprise-module.d.ts +492 -0
  5. package/index.d.ts +0 -11
  6. package/lib/components/enterprise-communication-details/enterprise-communication-details.component.d.ts +0 -24
  7. package/lib/components/enterprise-communications/enterprise-communications.component.d.ts +0 -90
  8. package/lib/components/enterprise-insights/enterprise-insights.component.d.ts +0 -26
  9. package/lib/components/enterprise-members/enterprise-members.component.d.ts +0 -69
  10. package/lib/components/enterprise-partners/enterprise-partners.component.d.ts +0 -81
  11. package/lib/components/enterprise-subscriptions/enterprise-subscriptions.component.d.ts +0 -20
  12. package/lib/components/enterprise-tabs/enterprise-tabs.component.d.ts +0 -11
  13. package/lib/components/enterprise-wiki/enterprise-wiki.component.d.ts +0 -93
  14. package/lib/components/enterprise-wiki-details/enterprise-wiki-details.component.d.ts +0 -24
  15. package/lib/enterprise.module.d.ts +0 -31
  16. package/lib/interfaces/enterprise.interface.d.ts +0 -64
  17. package/lib/models/enterprise.model.d.ts +0 -4
package/fesm2022/posiwise-enterprise-module.mjs CHANGED
@@ -1,35 +1,39 @@
1
- import * as i2$1 from '@angular/common';
1
+ import * as i3 from '@angular/common';
2
2
  import { CommonModule } from '@angular/common';
3
3
  import * as i0 from '@angular/core';
4
4
  import { Component, EventEmitter, ViewChild, NgModule } from '@angular/core';
5
5
  import * as i1$1 from '@angular/forms';
6
6
  import { UntypedFormBuilder, Validators, FormsModule, ReactiveFormsModule } from '@angular/forms';
7
- import * as i14 from '@angular/router';
7
+ import * as i16 from '@angular/router';
8
8
  import { RouterModule } from '@angular/router';
9
9
  import { CoreTranslocoModule } from '@posiwise/core-transloco';
10
- import * as i8 from '@posiwise/directives';
10
+ import * as i9 from '@posiwise/directives';
11
11
  import { DirectivesModule } from '@posiwise/directives';
12
- import * as i17 from '@posiwise/pipes';
12
+ import * as i19 from '@posiwise/pipes';
13
13
  import { PipesModule } from '@posiwise/pipes';
14
- import * as i13 from '@posiwise/shared-components';
14
+ import * as i15 from '@posiwise/shared-components';
15
15
  import { GroupsComponent, GroupDefinitionComponent, EntityGroupComponent, SharedComponentsModule } from '@posiwise/shared-components';
16
- import * as i3 from 'angular-plotly.js';
16
+ import * as i2$1 from 'angular-plotly.js';
17
17
  import { PlotlyViaCDNModule } from 'angular-plotly.js';
18
- import * as i15 from 'ngx-quill';
18
+ import * as i17 from 'ngx-quill';
19
19
  import { QuillModule } from 'ngx-quill';
20
- import * as i6 from 'ngx-ui-switch';
20
+ import * as i9$1 from 'ngx-ui-switch';
21
21
  import { UiSwitchModule } from 'ngx-ui-switch';
22
- import * as i14$1 from 'ngx-uploader';
22
+ import * as i16$1 from 'ngx-uploader';
23
23
  import { humanizeBytes, UploadStatus, NgxUploaderModule } from 'ngx-uploader';
24
- import * as i9 from 'primeng/fileupload';
24
+ import * as i11 from 'primeng/fileupload';
25
25
  import { FileUploadModule } from 'primeng/fileupload';
26
- import * as i5 from 'primeng/inputtext';
26
+ import * as i4 from 'primeng/iconfield';
27
+ import { IconFieldModule } from 'primeng/iconfield';
28
+ import * as i5 from 'primeng/inputicon';
29
+ import { InputIconModule } from 'primeng/inputicon';
30
+ import * as i3$1 from 'primeng/inputtext';
27
31
  import { InputTextModule } from 'primeng/inputtext';
28
- import * as i10 from 'primeng/multiselect';
32
+ import * as i11$1 from 'primeng/multiselect';
29
33
  import { MultiSelectModule } from 'primeng/multiselect';
30
- import * as i7 from 'primeng/select';
34
+ import * as i10 from 'primeng/select';
31
35
  import { SelectModule } from 'primeng/select';
32
- import * as i4 from '@ng-bootstrap/ng-bootstrap';
36
+ import * as i7 from '@ng-bootstrap/ng-bootstrap';
33
37
  import { NgbTooltipModule } from '@ng-bootstrap/ng-bootstrap';
34
38
  import * as i2 from '@angular/platform-browser';
35
39
  import { AppBaseComponent } from '@posiwise/app-base-component';
@@ -40,43 +44,52 @@ import * as i12 from 'primeng/progressspinner';
40
44
  import { __decorate, __metadata } from 'tslib';
41
45
  import { PAGE_SIZE, DOCUMENT_TYPE_EXT, TOKEN_HEADER_KEY } from '@posiwise/common-utilities';
42
46
  import { QuillHelper, ValidateForm, handleDateRangeSelection } from '@posiwise/utils';
43
- import * as i7$1 from 'primeng/api';
44
- import * as i9$1 from 'primeng/table';
45
- import * as i16 from '@jsverse/transloco';
46
- import * as i3$1 from '@posiwise/admin-module-utils';
47
+ import * as i6 from 'primeng/api';
48
+ import * as i13 from 'primeng/table';
49
+ import * as i18 from '@jsverse/transloco';
50
+ import * as i3$2 from '@posiwise/admin-module-utils';
47
51
  import { StatusCodes } from 'http-status-codes';
48
52
  import swal from 'sweetalert2';
49
- import * as i12$1 from 'primeng/tooltip';
53
+ import * as i14 from 'primeng/tooltip';
50
54
  import groupBy from 'lodash/groupBy';
51
- import * as i11 from 'primeng/autocomplete';
55
+ import * as i13$1 from 'primeng/autocomplete';
52
56
  import { switchMap } from 'rxjs/operators';
53
57
 
54
58
  class EnterpriseViewParticularCommunicationComponent extends AppBaseComponent {
55
- constructor(injector, groupService, sanitizer) {
59
+ constructor(injector, groupService, sanitizer, cdr) {
56
60
  super(injector);
57
61
  this.groupService = groupService;
58
62
  this.sanitizer = sanitizer;
63
+ this.cdr = cdr;
59
64
  this.isLoaded = false;
60
65
  }
61
66
  ngOnInit() {
62
67
  this.getUserSubscriptionId().subscribe(id => {
63
68
  this.id = id;
69
+ this.cdr.markForCheck();
64
70
  });
65
71
  this.route.params.subscribe(param => {
66
72
  this.communicationId = Number(param['communicationId']);
73
+ this.cdr.markForCheck();
67
74
  });
68
75
  this.getCommunication();
69
76
  this.chatPermission = `${PermissionService.selectedProduct?.permission}.${PermissionService.selectedProduct?.feature_key}`;
70
77
  }
71
78
  /** Function to call communication */
72
79
  getCommunication() {
73
- this.groupService.getCommunicationDetails(this.communicationId).subscribe(response => {
80
+ this.groupService
81
+ .getCommunicationDetails(this.communicationId)
82
+ .subscribe(response => {
74
83
  let blogBody;
75
84
  if (response?.body) {
76
85
  blogBody = HelperService.sanitizeQuillBody(response.body, this.sanitizer);
77
86
  }
78
87
  this.communicationDetails = { ...response, body: blogBody };
79
88
  this.isLoaded = true;
89
+ this.cdr.markForCheck();
90
+ })
91
+ .add(() => {
92
+ this.cdr.markForCheck();
80
93
  });
81
94
  }
82
95
  onCancel() {
@@ -88,13 +101,13 @@ class EnterpriseViewParticularCommunicationComponent extends AppBaseComponent {
88
101
  ngOnDestroy() {
89
102
  super.ngOnDestroy();
90
103
  }
91
- static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.19", ngImport: i0, type: EnterpriseViewParticularCommunicationComponent, deps: [{ token: i0.Injector }, { token: i1.GroupService }, { token: i2.DomSanitizer }], target: i0.ɵɵFactoryTarget.Component }); }
92
- static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.2.19", type: EnterpriseViewParticularCommunicationComponent, isStandalone: false, selector: "pw-enterprise-communication-details", usesInheritance: true, ngImport: i0, template: "<div class=\"row\">\n <div class=\"col-12 d-flex\">\n <a aria-label=\"Navigate to Target\"\n (keydown.enter)=\"onCancel()\"\n (click)=\"onCancel()\"\n class=\"previous\"><i class=\"fa fa-arrow-alt-circle-left\" aria-hidden=\"true\"></i></a>\n <h2 class=\"mt-0 mb-0\">Communication</h2>\n </div>\n</div>\n<div class=\"w-100 text-center mt-3\"\n *ngIf=\"!isLoaded\">\n <p-progressSpinner strokeWidth=\"2\"> </p-progressSpinner>\n</div>\n<div *ngIf=\"isLoaded\">\n <div class=\"content-quill-wrapper container-fluid pw-tab overflow-hidden mt-3\" *ngIf=\"communicationDetails\">\n <div class=\"pb-0\">\n <div class=\"card-body p-4\">\n <div class=\"row mb-3\">\n <div class=\"col-12 d-flex flex-wrap justify-content-between align-items-center mb-md-2\">\n <div class=\"d-flex flex-wrap mb-3 mb-md-0\">\n <span [ngClass]=\"communicationDetails?.pushed ? 'badge bg-success' : 'badge bg-danger'\" class=\"me-2 mb-2 mb-md-0\">\n {{ communicationDetails?.pushed ? 'Pushed' : 'Not Pushed' }}\n </span>\n <span [ngClass]=\"communicationDetails?.published? 'badge bg-success' : 'badge bg-danger'\" class=\"me-2 mb-2 mb-md-0\">\n {{ communicationDetails?.published ? 'Published' : 'Not Published' }}\n </span>\n <span [ngClass]=\"communicationDetails?.published ? 'badge bg-success' : 'badge bg-danger'\" class=\"me-2 mb-2 mb-md-0\">\n {{ communicationDetails?.visible_globally ? 'Visible Globally' : 'Not Visible Globally' }}\n </span>\n </div>\n <div class=\"d-flex flex-wrap mb-3 mb-md-0\">\n <span class=\"badge bg-cyan mb-2 me-2 mb-md-0\">{{communicationDetails?.group?.name}}</span>\n <span class=\"badge bg-blue-grey mb-2 me-2 mb-md-0\">{{ 'Created At (' + (communicationDetails?.created_at | date: 'dd-MMM-YYYY') + ')' }}</span>\n <span *ngIf=\"communicationDetails?.pushed_at\" class=\"badge bg-grey mb-2 mb-md-0\">{{ 'Pushed At (' + (communicationDetails?.pushed_at | date: 'dd-MMM-YYYY') + ')' }}</span>\n </div>\n </div>\n </div>\n <div class=\"row\">\n <div class=\"col-12 mb-3 ms-2\">\n <h5>{{ communicationDetails?.title }}</h5>\n </div>\n <div class=\"col-12 mb-3 ms-2 message-icon\">\n <a [routerLink]=\"['/members', communicationDetails?.author?.slug]\">{{\n communicationDetails?.author | ifNameNullShowEmail\n }}</a>\n <div class=\"ms-2\"\n ngbTooltip=\"Message\"\n *rbacAllow=\"chatPermission\">\n <i\n [routerLink]=\"['/message']\"\n [fragment]=\"communicationDetails?.author?.slug\"\n class=\"fa fa-comments cta1-icon\"\n aria-hidden=\"true\"\n ></i>\n </div>\n </div>\n\n <div class=\"col-12 ms-2\">\n <div class=\"ql-container ql-snow body-quill\">\n <div class=\"ql-editor\"\n [innerHTML]=\"communicationDetails?.body\">\n </div>\n </div>\n </div>\n <div class=\"col-12 col-sm-10\">\n <p *ngFor=\"\n let files of communicationDetails?.group_communication_files;\n trackBy: trackByFileId\n \">\n <a [href]=\"files?.name?.url\"\n target=\"blank\">{{\n files?.name?.url?.split('?')[0]?.split('/')[\n files?.name?.url.split('?')[0]?.split('/')?.length - 1\n ]\n }}</a>\n </p>\n </div>\n </div>\n </div>\n </div>\n </div>\n\n</div>\n\n", styles: [".badge-success,.badge-danger{padding:.5rem 1rem;border:1px solid black;font-size:1rem;display:inline-block;text-align:center}.badge-success{background-color:green;color:#fff}.badge-danger{background-color:red;color:#fff}.message-icon{display:flex}.date-span{padding:.5rem 1rem;font-size:1rem;border:1px solid black;display:inline-block;text-align:center}.ql-container{resize:none!important}.light-gray{background-color:#d3d3d3;color:#fff}.gray{background-color:gray;color:#fff}.card-body{padding:1.5rem}h4,h5{font-weight:700;margin-bottom:.5rem}p{margin-bottom:1rem}.d-flex{display:flex;align-items:center}.me-3{margin-right:1rem}.container-fluid{padding:0}.mb-3{margin-bottom:1rem}.mb-2{margin-bottom:.5rem}.justify-content-between{justify-content:space-between}.align-items-center{align-items:center}.button-width{width:100px}\n"], dependencies: [{ kind: "directive", type: i2$1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i2$1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i2$1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i4.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: i8.RbacAllowDirective, selector: "[rbacAllow]", inputs: ["rbacAllow"] }, { kind: "component", type: i12.ProgressSpinner, selector: "p-progressSpinner, p-progress-spinner, p-progressspinner", inputs: ["styleClass", "style", "strokeWidth", "fill", "animationDuration", "ariaLabel"] }, { kind: "directive", type: i14.RouterLink, selector: "[routerLink]", inputs: ["target", "queryParams", "fragment", "queryParamsHandling", "state", "info", "relativeTo", "preserveFragment", "skipLocationChange", "replaceUrl", "routerLink"] }, { kind: "pipe", type: i2$1.DatePipe, name: "date" }, { kind: "pipe", type: i17.IfNameNullShowEmailPipe, name: "ifNameNullShowEmail" }] }); }
104
+ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.6", ngImport: i0, type: EnterpriseViewParticularCommunicationComponent, deps: [{ token: i0.Injector }, { token: i1.GroupService }, { token: i2.DomSanitizer }, { token: i0.ChangeDetectorRef }], target: i0.ɵɵFactoryTarget.Component }); }
105
+ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.6", type: EnterpriseViewParticularCommunicationComponent, isStandalone: false, selector: "pw-enterprise-communication-details", usesInheritance: true, ngImport: i0, template: "<div class=\"row\">\n <div class=\"col-12 d-flex\">\n <a aria-label=\"Navigate to Target\"\n (keydown.enter)=\"onCancel()\"\n (click)=\"onCancel()\"\n class=\"previous\"><i class=\"fa fa-arrow-alt-circle-left\" aria-hidden=\"true\"></i></a>\n <h2 class=\"mt-0 mb-0\">Communication</h2>\n </div>\n </div>\n @if (!isLoaded) {\n <div class=\"w-100 text-center mt-3\"\n >\n <p-progressSpinner strokeWidth=\"2\"> </p-progressSpinner>\n </div>\n }\n @if (isLoaded) {\n <div>\n @if (communicationDetails) {\n <div class=\"content-quill-wrapper container-fluid pw-tab overflow-hidden mt-3\">\n <div class=\"pb-0\">\n <div class=\"card-body p-4\">\n <div class=\"row mb-3\">\n <div class=\"col-12 d-flex flex-wrap justify-content-between align-items-center mb-md-2\">\n <div class=\"d-flex flex-wrap mb-3 mb-md-0\">\n <span [ngClass]=\"communicationDetails?.pushed ? 'badge bg-success' : 'badge bg-danger'\" class=\"me-2 mb-2 mb-md-0\">\n {{ communicationDetails?.pushed ? 'Pushed' : 'Not Pushed' }}\n </span>\n <span [ngClass]=\"communicationDetails?.published? 'badge bg-success' : 'badge bg-danger'\" class=\"me-2 mb-2 mb-md-0\">\n {{ communicationDetails?.published ? 'Published' : 'Not Published' }}\n </span>\n <span [ngClass]=\"communicationDetails?.published ? 'badge bg-success' : 'badge bg-danger'\" class=\"me-2 mb-2 mb-md-0\">\n {{ communicationDetails?.visible_globally ? 'Visible Globally' : 'Not Visible Globally' }}\n </span>\n </div>\n <div class=\"d-flex flex-wrap mb-3 mb-md-0\">\n <span class=\"badge bg-cyan mb-2 me-2 mb-md-0\">{{communicationDetails?.group?.name}}</span>\n <span class=\"badge bg-blue-grey mb-2 me-2 mb-md-0\">{{ 'Created At (' + (communicationDetails?.created_at | date: 'dd-MMM-yyyy') + ')' }}</span>\n @if (communicationDetails?.pushed_at) {\n <span class=\"badge bg-grey mb-2 mb-md-0\">{{ 'Pushed At (' + (communicationDetails?.pushed_at | date: 'dd-MMM-yyyy') + ')' }}</span>\n }\n </div>\n </div>\n </div>\n <div class=\"row\">\n <div class=\"col-12 mb-3 ms-2\">\n <h5>{{ communicationDetails?.title }}</h5>\n </div>\n <div class=\"col-12 mb-3 ms-2 message-icon\">\n <a [routerLink]=\"['/members', communicationDetails?.author?.slug]\">{{\n communicationDetails?.author | ifNameNullShowEmail\n }}</a>\n <div class=\"ms-2\"\n ngbTooltip=\"Message\"\n *rbacAllow=\"chatPermission\">\n <i\n [routerLink]=\"['/message']\"\n [fragment]=\"communicationDetails?.author?.slug\"\n class=\"fa fa-comments cta1-icon\"\n aria-hidden=\"true\"\n ></i>\n </div>\n </div>\n <div class=\"col-12 ms-2\">\n <div class=\"ql-container ql-snow body-quill\">\n <div class=\"ql-editor\"\n [innerHTML]=\"communicationDetails?.body\">\n </div>\n </div>\n </div>\n <div class=\"col-12 col-sm-10\">\n @for (\n files of communicationDetails?.group_communication_files; track trackByFileId($index,\n files)) {\n <p>\n <a [href]=\"files?.name?.url\"\n target=\"blank\">{{\n files?.name?.url?.split('?')[0]?.split('/')[\n files?.name?.url.split('?')[0]?.split('/')?.length - 1\n ]\n }}</a>\n </p>\n }\n </div>\n </div>\n </div>\n </div>\n </div>\n }\n </div>\n }\n\n", styles: [".badge-success,.badge-danger{padding:.5rem 1rem;border:1px solid black;font-size:1rem;display:inline-block;text-align:center}.badge-success{background-color:green;color:#fff}.badge-danger{background-color:red;color:#fff}.message-icon{display:flex}.date-span{padding:.5rem 1rem;font-size:1rem;border:1px solid black;display:inline-block;text-align:center}.ql-container{resize:none!important}.light-gray{background-color:#d3d3d3;color:#fff}.gray{background-color:gray;color:#fff}.card-body{padding:1.5rem}h4,h5{font-weight:700;margin-bottom:.5rem}p{margin-bottom:1rem}.d-flex{display:flex;align-items:center}.me-3{margin-right:1rem}.container-fluid{padding:0}.mb-3{margin-bottom:1rem}.mb-2{margin-bottom:.5rem}.justify-content-between{justify-content:space-between}.align-items-center{align-items:center}.button-width{width:100px}\n"], dependencies: [{ kind: "directive", type: i3.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i7.NgbTooltip, selector: "[ngbTooltip]", inputs: ["animation", "autoClose", "placement", "popperOptions", "triggers", "positionTarget", "container", "disableTooltip", "tooltipClass", "tooltipContext", "openDelay", "closeDelay", "ngbTooltip"], outputs: ["shown", "hidden"], exportAs: ["ngbTooltip"] }, { kind: "directive", type: i9.RbacAllowDirective, selector: "[rbacAllow]", inputs: ["rbacAllow"] }, { kind: "component", type: i12.ProgressSpinner, selector: "p-progressSpinner, p-progress-spinner, p-progressspinner", inputs: ["styleClass", "strokeWidth", "fill", "animationDuration", "ariaLabel"] }, { kind: "directive", type: i16.RouterLink, selector: "[routerLink]", inputs: ["target", "queryParams", "fragment", "queryParamsHandling", "state", "info", "relativeTo", "preserveFragment", "skipLocationChange", "replaceUrl", "routerLink"] }, { kind: "pipe", type: i3.DatePipe, name: "date" }, { kind: "pipe", type: i19.IfNameNullShowEmailPipe, name: "ifNameNullShowEmail" }] }); }
93
106
  }
94
- i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.19", ngImport: i0, type: EnterpriseViewParticularCommunicationComponent, decorators: [{
107
+ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.6", ngImport: i0, type: EnterpriseViewParticularCommunicationComponent, decorators: [{
95
108
  type: Component,
96
- args: [{ selector: 'pw-enterprise-communication-details', standalone: false, template: "<div class=\"row\">\n <div class=\"col-12 d-flex\">\n <a aria-label=\"Navigate to Target\"\n (keydown.enter)=\"onCancel()\"\n (click)=\"onCancel()\"\n class=\"previous\"><i class=\"fa fa-arrow-alt-circle-left\" aria-hidden=\"true\"></i></a>\n <h2 class=\"mt-0 mb-0\">Communication</h2>\n </div>\n</div>\n<div class=\"w-100 text-center mt-3\"\n *ngIf=\"!isLoaded\">\n <p-progressSpinner strokeWidth=\"2\"> </p-progressSpinner>\n</div>\n<div *ngIf=\"isLoaded\">\n <div class=\"content-quill-wrapper container-fluid pw-tab overflow-hidden mt-3\" *ngIf=\"communicationDetails\">\n <div class=\"pb-0\">\n <div class=\"card-body p-4\">\n <div class=\"row mb-3\">\n <div class=\"col-12 d-flex flex-wrap justify-content-between align-items-center mb-md-2\">\n <div class=\"d-flex flex-wrap mb-3 mb-md-0\">\n <span [ngClass]=\"communicationDetails?.pushed ? 'badge bg-success' : 'badge bg-danger'\" class=\"me-2 mb-2 mb-md-0\">\n {{ communicationDetails?.pushed ? 'Pushed' : 'Not Pushed' }}\n </span>\n <span [ngClass]=\"communicationDetails?.published? 'badge bg-success' : 'badge bg-danger'\" class=\"me-2 mb-2 mb-md-0\">\n {{ communicationDetails?.published ? 'Published' : 'Not Published' }}\n </span>\n <span [ngClass]=\"communicationDetails?.published ? 'badge bg-success' : 'badge bg-danger'\" class=\"me-2 mb-2 mb-md-0\">\n {{ communicationDetails?.visible_globally ? 'Visible Globally' : 'Not Visible Globally' }}\n </span>\n </div>\n <div class=\"d-flex flex-wrap mb-3 mb-md-0\">\n <span class=\"badge bg-cyan mb-2 me-2 mb-md-0\">{{communicationDetails?.group?.name}}</span>\n <span class=\"badge bg-blue-grey mb-2 me-2 mb-md-0\">{{ 'Created At (' + (communicationDetails?.created_at | date: 'dd-MMM-YYYY') + ')' }}</span>\n <span *ngIf=\"communicationDetails?.pushed_at\" class=\"badge bg-grey mb-2 mb-md-0\">{{ 'Pushed At (' + (communicationDetails?.pushed_at | date: 'dd-MMM-YYYY') + ')' }}</span>\n </div>\n </div>\n </div>\n <div class=\"row\">\n <div class=\"col-12 mb-3 ms-2\">\n <h5>{{ communicationDetails?.title }}</h5>\n </div>\n <div class=\"col-12 mb-3 ms-2 message-icon\">\n <a [routerLink]=\"['/members', communicationDetails?.author?.slug]\">{{\n communicationDetails?.author | ifNameNullShowEmail\n }}</a>\n <div class=\"ms-2\"\n ngbTooltip=\"Message\"\n *rbacAllow=\"chatPermission\">\n <i\n [routerLink]=\"['/message']\"\n [fragment]=\"communicationDetails?.author?.slug\"\n class=\"fa fa-comments cta1-icon\"\n aria-hidden=\"true\"\n ></i>\n </div>\n </div>\n\n <div class=\"col-12 ms-2\">\n <div class=\"ql-container ql-snow body-quill\">\n <div class=\"ql-editor\"\n [innerHTML]=\"communicationDetails?.body\">\n </div>\n </div>\n </div>\n <div class=\"col-12 col-sm-10\">\n <p *ngFor=\"\n let files of communicationDetails?.group_communication_files;\n trackBy: trackByFileId\n \">\n <a [href]=\"files?.name?.url\"\n target=\"blank\">{{\n files?.name?.url?.split('?')[0]?.split('/')[\n files?.name?.url.split('?')[0]?.split('/')?.length - 1\n ]\n }}</a>\n </p>\n </div>\n </div>\n </div>\n </div>\n </div>\n\n</div>\n\n", styles: [".badge-success,.badge-danger{padding:.5rem 1rem;border:1px solid black;font-size:1rem;display:inline-block;text-align:center}.badge-success{background-color:green;color:#fff}.badge-danger{background-color:red;color:#fff}.message-icon{display:flex}.date-span{padding:.5rem 1rem;font-size:1rem;border:1px solid black;display:inline-block;text-align:center}.ql-container{resize:none!important}.light-gray{background-color:#d3d3d3;color:#fff}.gray{background-color:gray;color:#fff}.card-body{padding:1.5rem}h4,h5{font-weight:700;margin-bottom:.5rem}p{margin-bottom:1rem}.d-flex{display:flex;align-items:center}.me-3{margin-right:1rem}.container-fluid{padding:0}.mb-3{margin-bottom:1rem}.mb-2{margin-bottom:.5rem}.justify-content-between{justify-content:space-between}.align-items-center{align-items:center}.button-width{width:100px}\n"] }]
97
- }], ctorParameters: () => [{ type: i0.Injector }, { type: i1.GroupService }, { type: i2.DomSanitizer }] });
109
+ args: [{ selector: 'pw-enterprise-communication-details', standalone: false, template: "<div class=\"row\">\n <div class=\"col-12 d-flex\">\n <a aria-label=\"Navigate to Target\"\n (keydown.enter)=\"onCancel()\"\n (click)=\"onCancel()\"\n class=\"previous\"><i class=\"fa fa-arrow-alt-circle-left\" aria-hidden=\"true\"></i></a>\n <h2 class=\"mt-0 mb-0\">Communication</h2>\n </div>\n </div>\n @if (!isLoaded) {\n <div class=\"w-100 text-center mt-3\"\n >\n <p-progressSpinner strokeWidth=\"2\"> </p-progressSpinner>\n </div>\n }\n @if (isLoaded) {\n <div>\n @if (communicationDetails) {\n <div class=\"content-quill-wrapper container-fluid pw-tab overflow-hidden mt-3\">\n <div class=\"pb-0\">\n <div class=\"card-body p-4\">\n <div class=\"row mb-3\">\n <div class=\"col-12 d-flex flex-wrap justify-content-between align-items-center mb-md-2\">\n <div class=\"d-flex flex-wrap mb-3 mb-md-0\">\n <span [ngClass]=\"communicationDetails?.pushed ? 'badge bg-success' : 'badge bg-danger'\" class=\"me-2 mb-2 mb-md-0\">\n {{ communicationDetails?.pushed ? 'Pushed' : 'Not Pushed' }}\n </span>\n <span [ngClass]=\"communicationDetails?.published? 'badge bg-success' : 'badge bg-danger'\" class=\"me-2 mb-2 mb-md-0\">\n {{ communicationDetails?.published ? 'Published' : 'Not Published' }}\n </span>\n <span [ngClass]=\"communicationDetails?.published ? 'badge bg-success' : 'badge bg-danger'\" class=\"me-2 mb-2 mb-md-0\">\n {{ communicationDetails?.visible_globally ? 'Visible Globally' : 'Not Visible Globally' }}\n </span>\n </div>\n <div class=\"d-flex flex-wrap mb-3 mb-md-0\">\n <span class=\"badge bg-cyan mb-2 me-2 mb-md-0\">{{communicationDetails?.group?.name}}</span>\n <span class=\"badge bg-blue-grey mb-2 me-2 mb-md-0\">{{ 'Created At (' + (communicationDetails?.created_at | date: 'dd-MMM-yyyy') + ')' }}</span>\n @if (communicationDetails?.pushed_at) {\n <span class=\"badge bg-grey mb-2 mb-md-0\">{{ 'Pushed At (' + (communicationDetails?.pushed_at | date: 'dd-MMM-yyyy') + ')' }}</span>\n }\n </div>\n </div>\n </div>\n <div class=\"row\">\n <div class=\"col-12 mb-3 ms-2\">\n <h5>{{ communicationDetails?.title }}</h5>\n </div>\n <div class=\"col-12 mb-3 ms-2 message-icon\">\n <a [routerLink]=\"['/members', communicationDetails?.author?.slug]\">{{\n communicationDetails?.author | ifNameNullShowEmail\n }}</a>\n <div class=\"ms-2\"\n ngbTooltip=\"Message\"\n *rbacAllow=\"chatPermission\">\n <i\n [routerLink]=\"['/message']\"\n [fragment]=\"communicationDetails?.author?.slug\"\n class=\"fa fa-comments cta1-icon\"\n aria-hidden=\"true\"\n ></i>\n </div>\n </div>\n <div class=\"col-12 ms-2\">\n <div class=\"ql-container ql-snow body-quill\">\n <div class=\"ql-editor\"\n [innerHTML]=\"communicationDetails?.body\">\n </div>\n </div>\n </div>\n <div class=\"col-12 col-sm-10\">\n @for (\n files of communicationDetails?.group_communication_files; track trackByFileId($index,\n files)) {\n <p>\n <a [href]=\"files?.name?.url\"\n target=\"blank\">{{\n files?.name?.url?.split('?')[0]?.split('/')[\n files?.name?.url.split('?')[0]?.split('/')?.length - 1\n ]\n }}</a>\n </p>\n }\n </div>\n </div>\n </div>\n </div>\n </div>\n }\n </div>\n }\n\n", styles: [".badge-success,.badge-danger{padding:.5rem 1rem;border:1px solid black;font-size:1rem;display:inline-block;text-align:center}.badge-success{background-color:green;color:#fff}.badge-danger{background-color:red;color:#fff}.message-icon{display:flex}.date-span{padding:.5rem 1rem;font-size:1rem;border:1px solid black;display:inline-block;text-align:center}.ql-container{resize:none!important}.light-gray{background-color:#d3d3d3;color:#fff}.gray{background-color:gray;color:#fff}.card-body{padding:1.5rem}h4,h5{font-weight:700;margin-bottom:.5rem}p{margin-bottom:1rem}.d-flex{display:flex;align-items:center}.me-3{margin-right:1rem}.container-fluid{padding:0}.mb-3{margin-bottom:1rem}.mb-2{margin-bottom:.5rem}.justify-content-between{justify-content:space-between}.align-items-center{align-items:center}.button-width{width:100px}\n"] }]
110
+ }], ctorParameters: () => [{ type: i0.Injector }, { type: i1.GroupService }, { type: i2.DomSanitizer }, { type: i0.ChangeDetectorRef }] });
98
111
 
99
112
  class AppEnterprise {
100
113
  static getWikiForm() {
@@ -160,6 +173,7 @@ class EnterpriseCommunicationsComponent extends AppBaseComponent {
160
173
  this.id = this.subscription?.id;
161
174
  this.hasAccess = this.hasAdminAccess(this.subscription?.id);
162
175
  }
176
+ this.cdr.markForCheck();
163
177
  });
164
178
  this.groupId = Number(this.route.snapshot.queryParams['entity_id']);
165
179
  // eslint-disable-next-line no-restricted-globals
@@ -168,12 +182,10 @@ class EnterpriseCommunicationsComponent extends AppBaseComponent {
168
182
  if (user) {
169
183
  this.user = user;
170
184
  }
185
+ this.cdr.markForCheck();
171
186
  });
172
187
  this.getAllGroupDefinition();
173
188
  }
174
- ngAfterViewChecked() {
175
- this.cdr.detectChanges();
176
- }
177
189
  onLazyLoad(event) {
178
190
  const pageDetails = HelperService.onTableLazyLoad(event);
179
191
  this.page = pageDetails.page;
@@ -212,6 +224,7 @@ class EnterpriseCommunicationsComponent extends AppBaseComponent {
212
224
  ...this.allGroups
213
225
  ];
214
226
  }
227
+ this.cdr.markForCheck();
215
228
  });
216
229
  }
217
230
  /** Function to get group name and to setValue to group field if we have group_id */
@@ -234,6 +247,7 @@ class EnterpriseCommunicationsComponent extends AppBaseComponent {
234
247
  this.allCommunication = response.group_communications;
235
248
  this.totalRecords = response.object_count;
236
249
  this.totalRecordsUnFiltered = response.unfiltered_count;
250
+ this.cdr.markForCheck();
237
251
  });
238
252
  }
239
253
  else {
@@ -243,10 +257,12 @@ class EnterpriseCommunicationsComponent extends AppBaseComponent {
243
257
  this.allCommunication = response.group_communications;
244
258
  this.totalRecords = response.object_count;
245
259
  this.totalRecordsUnFiltered = response.unfiltered_count;
260
+ this.cdr.markForCheck();
246
261
  })
247
262
  .add(() => {
248
263
  this.loading = false;
249
264
  this.isLoaded = true;
265
+ this.cdr.markForCheck();
250
266
  });
251
267
  }
252
268
  }
@@ -300,9 +316,11 @@ class EnterpriseCommunicationsComponent extends AppBaseComponent {
300
316
  : 'Communication Added Successfully';
301
317
  this.toast.success(this.translation.translate(message));
302
318
  this.onCancel();
319
+ this.cdr.markForCheck();
303
320
  })
304
321
  .add(() => {
305
322
  this.buttonBusy = false;
323
+ this.cdr.markForCheck();
306
324
  });
307
325
  this.submitted = false;
308
326
  }
@@ -317,9 +335,11 @@ class EnterpriseCommunicationsComponent extends AppBaseComponent {
317
335
  this.data = response;
318
336
  this.form.patchValue(response);
319
337
  this.filesData = response.group_communication_files;
338
+ this.cdr.markForCheck();
320
339
  })
321
340
  .add(() => {
322
341
  this.isLoaded = true;
342
+ this.cdr.markForCheck();
323
343
  });
324
344
  }
325
345
  /** Function to delete communications */
@@ -329,6 +349,7 @@ class EnterpriseCommunicationsComponent extends AppBaseComponent {
329
349
  this.groupService.deleteCommunications(id).subscribe(() => {
330
350
  this.toast.success(this.translation.translate('Communication Deleted Successfully'));
331
351
  this.onCancel();
352
+ this.cdr.markForCheck();
332
353
  });
333
354
  }
334
355
  });
@@ -340,6 +361,7 @@ class EnterpriseCommunicationsComponent extends AppBaseComponent {
340
361
  this.groupService.deleteCommunicationFiles(id).subscribe(() => {
341
362
  this.toast.success(this.translation.translate('Communication File Deleted Successfully'));
342
363
  this.filesData.splice(index, 1);
364
+ this.cdr.markForCheck();
343
365
  });
344
366
  }
345
367
  });
@@ -413,6 +435,7 @@ class EnterpriseCommunicationsComponent extends AppBaseComponent {
413
435
  fileData.append('group_communication_id', `${id}`);
414
436
  this.groupService.postCommunicationFiles(fileData).subscribe(() => {
415
437
  this.translation.translate('Communication File Added Successfully');
438
+ this.cdr.markForCheck();
416
439
  });
417
440
  });
418
441
  }
@@ -420,8 +443,8 @@ class EnterpriseCommunicationsComponent extends AppBaseComponent {
420
443
  ngOnDestroy() {
421
444
  super.ngOnDestroy();
422
445
  }
423
- static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.19", ngImport: i0, type: EnterpriseCommunicationsComponent, deps: [{ token: i1.GroupService }, { token: i0.Injector }, { token: i0.ChangeDetectorRef }, { token: i0.Renderer2 }, { token: i0.ElementRef }], target: i0.ɵɵFactoryTarget.Component }); }
424
- static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.2.19", type: EnterpriseCommunicationsComponent, isStandalone: false, selector: "pw-enterprise-communications", usesInheritance: true, ngImport: i0, template: "<section>\n <div class=\"row\">\n <div class=\"col-12\" [ngClass]=\"{'mb-3': !isEdit}\">\n <div class=\"title\">\n <a *ngIf=\"isEdit\"\n aria-label=\"Navigate to Target\"\n (click)=\"onCancel()\"\n (keydown.enter)=\"onCancel()\"\n class=\"previous\"><i class=\"fa fa-arrow-alt-circle-left\" aria-hidden=\"true\"></i></a>\n <h3 *ngIf=\"isEdit\" class=\"m-subheader__title m-subheader__title--separator mt-1\">\n <span>{{ !isAdd ? 'Edit' : 'Create new' }} Communication</span>\n </h3>\n <h2 *ngIf=\"!isEdit\" [ngClass]=\"{ 'mt-2': isEdit }\">Communications <span *ngIf=\"groupId\">for {{ groupName }}</span></h2>\n </div>\n <p *ngIf=\"!isEdit\">\n Here you can send communications to your organization, based on the teams they are\n part of.\n </p>\n </div>\n </div>\n</section>\n<div class=\"w-100 text-center mt-3\"\n *ngIf=\"!isLoaded && isEdit\">\n <p-progressSpinner strokeWidth=\"2\"> </p-progressSpinner>\n</div>\n<ng-container *ngIf=\"isEdit && isLoaded\">\n <div class=\"container-fluid pw-tab overflow-hidden\">\n <div class=\"p-2 mt-1\">\n <form [formGroup]=\"form\"\n (ngSubmit)=\"onSave()\">\n <div class=\"row mb-3\">\n <div class=\"col-12 col-md-12\">\n <pw-input-container [label]=\"'Enterprise.Documentation.Title' | transloco\"\n [errorMsg]=\"'Enterprise.Documentation.Validation.Title' | transloco\"\n name=\"title\" controlId=\"enterprise-communications-title\">\n <input type=\"text\"\n id=\"enterprise-communications-title\"\n class=\"form-control\"\n formControlName=\"title\"\n [ngClass]=\"{ 'is-invalid': submitted && f['title'].errors }\" />\n </pw-input-container>\n </div>\n\n <pw-input-container [label]=\"'Enterprise.Documentation.Body' | transloco\"\n class=\"col-12\"\n name=\"body\" controlId=\"enterprise-communications-body\" [useAriaLabelledbyOnly]=\"true\"\n [errorMsg]=\"'Enterprise.Documentation.Validation.Body' | transloco\">\n <quill-editor [styles]=\"{ height: '220px' }\"\n [attr.aria-labelledby]=\"'enterprise-communications-body-label'\"\n class=\"quillEditor quill-container\" [modules]=\"editorConfig\"\n formControlName=\"body\"\n [ngClass]=\"{ 'is-invalid': submitted && f['body'].errors }\">\n </quill-editor>\n </pw-input-container>\n\n <div class=\"col-12 col-md-6\">\n <pw-input-container [showTooltip]=\"true\"\n [tooltipText]=\"'Enterprise.Tooltip.Group' | transloco\"\n [label]=\"'Enterprise.Documentation.Team' | transloco\"\n [isLeftTooltip]=\"true\"\n name=\"group_id\" controlId=\"enterprise-communications-group_id\" [useAriaLabelledbyOnly]=\"true\"\n [errorMsg]=\"'Enterprise.Documentation.Validation.Team' | transloco\">\n <p-select\n [attr.aria-labelledby]=\"'enterprise-communications-group_id-label'\"\n [options]=\"allGroups\"\n formControlName=\"group_id\"\n [ngClass]=\"{ 'is-invalid': submitted && f['group_id'].errors }\"\n optionValue=\"id\"\n optionLabel=\"name\">\n </p-select>\n </pw-input-container>\n </div>\n\n <div class=\"col-12 col-md-2\">\n <pw-input-container [showTooltip]=\"true\"\n [tooltipText]=\"'Enterprise.Tooltip.VisibleGlobally' | transloco\"\n [label]=\"'Enterprise.Documentation.VisibleGlobally' | transloco\"\n name=\"visible_globally\" controlId=\"enterprise-communications-visible_globally\" [useAriaLabelledbyOnly]=\"true\">\n <ui-switch class=\"d-block\"\n [attr.aria-labelledby]=\"'enterprise-communications-visible_globally-label'\"\n formControlName=\"visible_globally\"\n (change)=\"onChange($event, 'visible_globally')\"\n name=\"visible_globally\">\n </ui-switch>\n </pw-input-container>\n </div>\n\n <div class=\"col-12 col-md-2\">\n <pw-input-container [showTooltip]=\"true\"\n [tooltipText]=\"'Enterprise.Tooltip.Published' | transloco\"\n [label]=\"'Enterprise.Documentation.Published' | transloco\"\n name=\"published\" controlId=\"enterprise-communications-published\" [useAriaLabelledbyOnly]=\"true\">\n <ui-switch class=\"d-block\"\n [attr.aria-labelledby]=\"'enterprise-communications-published-label'\"\n formControlName=\"published\"\n (change)=\"onChange($event, 'published')\"\n name=\"published\">\n </ui-switch>\n </pw-input-container>\n </div>\n\n <div class=\"col-12 col-md-2\">\n <pw-input-container [showTooltip]=\"true\"\n [tooltipText]=\"'Enterprise.Tooltip.Pushed' | transloco\"\n [label]=\"'Enterprise.Documentation.Pushed' | transloco\"\n name=\"pushed\" controlId=\"enterprise-communications-pushed\" [useAriaLabelledbyOnly]=\"true\">\n <ui-switch class=\"d-block\"\n [attr.aria-labelledby]=\"'enterprise-communications-pushed-label'\"\n formControlName=\"pushed\"\n (change)=\"onChange($event, 'pushed')\"\n name=\"pushed\">\n </ui-switch>\n </pw-input-container>\n </div>\n\n <div class=\"col-12 col-md-6\">\n <h4 class=\"mt-4\">You can add files to your communication here</h4>\n <div class=\"mb-3\">\n <span id=\"enterprise-communications-file-label\" class=\"pw-label-style\">Upload Communication File</span>\n <p-fileUpload #forms\n [attr.aria-labelledby]=\"'enterprise-communications-file-label'\"\n name=\"myfile[]\"\n [customUpload]=\"true\"\n [showUploadButton]=\"false\"\n accept=\"\"\n [disabled]=\"uploadedFiles && uploadedFiles.length > 0\"\n (onSelect)=\"onSelect($event)\"\n (onRemove)=\"onRemove($event)\"\n (onError)=\"onUploadError($event)\">\n <ng-template pTemplate=\"content\"\n [ngIf]=\"uploadedFiles?.length\">\n <div class=\"drag-drop-text\" *ngIf=\"!filesUploaded && (!uploadedFiles || uploadedFiles.length === 0)\">\n <p>You can drag and drop your file here</p>\n </div>\n </ng-template>\n </p-fileUpload>\n </div>\n </div>\n </div>\n <div class=\"row\">\n <div class=\"col-12 text-end mt-3\">\n <button type=\"button\"\n class=\"btn btn-outline-default me-2\"\n (click)=\"onCancel()\"\n (keydown.enter)=\"onCancel()\" >\n {{ 'Button.Cancel' | transloco }}\n </button>\n <button type=\"submit\"\n [buttonBusy]=\"buttonBusy\"\n class=\"btn btn-primary\" [disabled]=\"invalidFile\">\n {{ 'Button.Submit' | transloco }}\n </button>\n </div>\n </div>\n </form>\n <div *ngIf=\"filesData?.length\"\n class=\"mt-5\">\n <h2>Communications files attached to this communication</h2>\n <div class=\"communication-files\"\n *ngFor=\"let files of filesData; let i = index\">\n <p>\n <a target=\"blank\"\n href=\"{{ files.name.url }}\">{{\n files.name.url.split('?')[0].split('/')[\n files.name.url.split('?')[0].split('/').length - 1\n ]\n }}</a>\n </p>\n <p ngbTooltip=\"Delete\"\n class=\"ms-3\">\n <i\n class=\"fa fa-trash delete-icon\"\n (keydown.enter)=\"deleteCommunicationFiles(files.id, i)\"\n (keydown.space)=\"deleteCommunicationFiles(files.id, i)\"\n (click)=\"deleteCommunicationFiles(files.id, i)\"\n aria-hidden=\"true\"\n ></i>\n </p>\n </div>\n </div>\n </div>\n </div>\n</ng-container>\n<ng-container *ngIf=\"!isEdit\">\n <div class=\"row\">\n <div class=\"col-12 text-end mb-3\">\n <button class=\"btn btn-sm btn-outline-primary\"\n (click)=\"showEditForm()\">\n <i class=\"fa fa-plus-circle\" aria-hidden=\"true\"></i> {{ 'Add Communication' }}\n </button>\n </div>\n </div>\n <div class=\"w-100 text-center mt-3\"\n *ngIf=\"!isLoaded\">\n <p-progressSpinner strokeWidth=\"2\"> </p-progressSpinner>\n </div>\n\n <div class=\"primeng-datatable-container mt-0 table-responsive\"\n [class.hideTable]=\"totalRecordsUnFiltered === 0\">\n <p-table #dt\n [value]=\"allCommunication\"\n [paginator]=\"totalRecords !== 0\"\n [lazy]=\"true\"\n [rows]=\"PAGE_SIZE\"\n [totalRecords]=\"totalRecords\"\n [loading]=\"loading\"\n (onLazyLoad)=\"onLazyLoad($event)\">\n <ng-template pTemplate=\"caption\">\n <div class=\"search-contact\">\n <div class=\"col-12 col-md-3 mb-2 mb-md-0 filter-domain-list\">\n <p-select\n [options]=\"allCommunicationGroups\"\n optionLabel=\"name\"\n optionValue=\"id\"\n [(ngModel)]=\"groupId\"\n placeholder=\"Select Communication Team\"\n [appendTo]=\"'body'\"\n (onChange)=\"filterDomainsList()\">\n </p-select>\n </div>\n <div class=\"text-end\">\n <label for=\"enterprise-communications-search\" class=\"visually-hidden\">Search Communications</label>\n <i class=\"fa fa-search mt-2 me-2\" aria-hidden=\"true\"></i>\n <input type=\"text\"\n id=\"enterprise-communications-search\"\n name=\"enterprise-communications-search\"\n [(ngModel)]=\"searchText\"\n pInputText\n size=\"50\"\n placeholder=\"Search Communications...\"\n class=\"mw-90\"\n (input)=\"dt.filterGlobal($event.target.value, 'contains')\" />\n </div>\n </div>\n </ng-template>\n <ng-template pTemplate=\"header\">\n <tr>\n <th scope=\"true\">{{ 'Enterprise.Documentation.Title' | transloco }}</th>\n <th scope=\"true\">{{ 'Enterprise.Documentation.Sender' | transloco }}</th>\n <th scope=\"true\">{{ 'Enterprise.Documentation.Team' | transloco }}</th>\n <th scope=\"true\">{{ 'Enterprise.Documentation.Files' | transloco }}</th>\n <th scope=\"true\">{{ 'Enterprise.Documentation.Date' | transloco }}</th>\n <th scope=\"true\">{{ 'Enterprise.Documentation.Status' | transloco }}</th>\n <th scope=\"true\"\n class=\"actions-column\">{{ 'Label.Actions' | transloco }}</th>\n </tr>\n </ng-template>\n <ng-template pTemplate=\"body\"\n let-item>\n <tr class=\"table-row\">\n <td data-head=\"Title\">\n <a [routerLink]=\"[item.id]\">{{ item.title }}</a>\n </td>\n <td data-head=\"Sender\">{{ item.author | ifNameNullShowEmail }}</td>\n <td data-head=\"Team\">{{ item.group?.name }}</td>\n <td data-head=\"Files\">\n <span *ngFor=\"let files of item.group_communication_files\">\n <a target=\"blank\"\n [href]=\"files.name.url\">{{\n files.name.url.split('?')[0].split('/')[\n files.name.url.split('?')[0].split('/').length - 1\n ]\n }}</a>\n </span>\n </td>\n <td data-head=\"Date\">{{ item.created_at | dateFormat: 'datetime' }}</td>\n <td data-head=\"Status\">\n <span *ngIf=\"item.visible_globally\"\n class=\"badge bg-warning ms-2\">{{\n 'Enterprise.Documentation.Global' | transloco\n }}</span><span *ngIf=\"item.published\"\n class=\"badge bg-info ms-2\">{{\n 'Enterprise.Documentation.Published' | transloco\n }}</span><span *ngIf=\"item.pushed\"\n class=\"badge bg-success ms-2\">{{\n 'Enterprise.Documentation.Pushed' | transloco\n }}</span>\n </td>\n <td data-head=\"Action\">\n <ul class=\"list-unstyled list-inline list-action\">\n <li ngbTooltip=\"Edit\"\n class=\"me-2 me-sm-3\">\n <i\n class=\"fa fa-edit edit-icon\"\n (click)=\"getCommunicationDetails(item.id)\"\n (keydown.enter)=\"getCommunicationDetails(item.id)\"\n aria-hidden=\"true\"\n ></i>\n </li>\n <li ngbTooltip=\"Delete\"\n class=\"me-2 me-sm-3\">\n <i\n class=\"fa fa-trash delete-icon\"\n (keydown.enter)=\"onDelete(item.id)\"\n (click)=\"onDelete(item.id)\"\n aria-hidden=\"true\"\n ></i>\n </li>\n <li ngbTooltip=\"See Communication\"\n class=\"me-2 me-sm-3 see-icon\"\n [routerLink]=\"[item.id]\">\n <i class=\"fa fa-eye eye-icon\" aria-hidden=\"true\"></i>\n </li>\n </ul>\n </td>\n </tr>\n </ng-template>\n </p-table>\n <div *ngIf=\"totalRecords === 0 && totalRecordsUnFiltered !== 0 && !groupId\">\n <pw-no-data [withImage]=\"true\" [message]=\"'Search.NoDataMessage' | transloco\" [description]=\"'Search.NoDataDescription' | transloco\" >\n </pw-no-data>\n </div>\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]=\"'Enterprise.Communication.NoCommunication' | transloco\">\n </pw-no-data>\n </div>\n</ng-container>\n", styles: [":root{--first: rgb(23 105 225);--second: rgb(54 194 131);--third: rgb(255 171 0);--text: rgb(34 34 34);--tabs_bg: rgb(23 105 225);--tabs_sub_bg: rgb(70, 136, 236);--tabs_text: rgb(255 255 255);--titles: rgb(34 34 34);--sidebar_bg: rgb(0, 48, 63);--sidebar_text: rgb(255 255 255)}.table-row{vertical-align:top}.communication-files{display:flex!important}.search-contact{display:flex;justify-content:space-between}@media (min-width: 320px) and (max-width: 720px){.search-contact{display:block}}.eye-icon{color:var(--first);font-size:18px;padding-left:3px;padding-right:3px}.title{display:flex}a.previous i{top:0}.drag-drop-text{padding:20px;border:2px dashed #ccc;text-align:center;color:#aaa;margin-top:10px}::ng-deep .file-upload-support-details .p-fileupload .p-fileupload-content{padding:1rem}::ng-deep .file-upload-support-details .p-fileupload-content .p-fileupload-files .p-fileupload-row>:first-child{display:flex}\n"], dependencies: [{ kind: "directive", type: i2$1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i2$1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i2$1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i5.InputText, selector: "[pInputText]", inputs: ["variant", "fluid", "pSize"] }, { kind: "directive", type: i4.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: i1$1.ɵNgNoValidate, selector: "form:not([ngNoForm]):not([ngNativeValidate])" }, { kind: "directive", type: i1$1.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: i1$1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1$1.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { kind: "directive", type: i1$1.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "component", type: i6.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: i7.Select, selector: "p-select", 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", "size", "overlayOptions", "ariaFilterLabel", "ariaLabel", "ariaLabelledBy", "filterMatchMode", "maxlength", "tooltip", "tooltipPosition", "tooltipPositionStyle", "tooltipStyleClass", "focusOnHover", "selectOnFocus", "autoOptionFocus", "autofocusFilter", "fluid", "disabled", "itemSize", "autoZIndex", "baseZIndex", "showTransitionOptions", "hideTransitionOptions", "filterValue", "options"], outputs: ["onChange", "onFilter", "onFocus", "onBlur", "onClick", "onShow", "onHide", "onClear", "onLazyLoad"] }, { kind: "directive", type: i7$1.PrimeTemplate, selector: "[pTemplate]", inputs: ["type", "pTemplate"] }, { kind: "component", type: i9.FileUpload, selector: "p-fileupload, p-fileUpload", inputs: ["name", "url", "method", "multiple", "accept", "disabled", "auto", "withCredentials", "maxFileSize", "invalidFileSizeMessageSummary", "invalidFileSizeMessageDetail", "invalidFileTypeMessageSummary", "invalidFileTypeMessageDetail", "invalidFileLimitMessageDetail", "invalidFileLimitMessageSummary", "style", "styleClass", "previewWidth", "chooseLabel", "uploadLabel", "cancelLabel", "chooseIcon", "uploadIcon", "cancelIcon", "showUploadButton", "showCancelButton", "mode", "headers", "customUpload", "fileLimit", "uploadStyleClass", "cancelStyleClass", "removeStyleClass", "chooseStyleClass", "chooseButtonProps", "uploadButtonProps", "cancelButtonProps", "files"], outputs: ["onBeforeUpload", "onSend", "onUpload", "onError", "onClear", "onRemove", "onSelect", "onProgress", "uploadHandler", "onImageError", "onRemoveUploadedFile"] }, { kind: "directive", type: i1$1.FormGroupDirective, selector: "[formGroup]", inputs: ["formGroup"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { kind: "directive", type: i1$1.FormControlName, selector: "[formControlName]", inputs: ["formControlName", "disabled", "ngModel"], outputs: ["ngModelChange"] }, { kind: "directive", type: i8.ButtonBusyDirective, selector: "[buttonBusy]", inputs: ["buttonBusy", "busyText"] }, { kind: "component", type: i9$1.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", "size", "showGridlines", "stripedRows", "groupRowsByOrder", "responsiveLayout", "breakpoint", "paginatorLocale", "value", "columns", "first", "rows", "totalRecords", "sortField", "sortOrder", "multiSortMeta", "selection", "virtualRowHeight", "selectAll"], outputs: ["contextMenuSelectionChange", "selectAllChange", "selectionChange", "onRowSelect", "onRowUnselect", "onPage", "onSort", "onFilter", "onLazyLoad", "onRowExpand", "onRowCollapse", "onContextMenuSelect", "onColResize", "onColReorder", "onRowReorder", "onEditInit", "onEditComplete", "onEditCancel", "onHeaderCheckboxToggle", "sortFunction", "firstChange", "rowsChange", "onStateSave", "onStateRestore"] }, { kind: "component", type: i12.ProgressSpinner, selector: "p-progressSpinner, p-progress-spinner, p-progressspinner", inputs: ["styleClass", "style", "strokeWidth", "fill", "animationDuration", "ariaLabel"] }, { kind: "component", type: i13.InputContainerComponent, selector: "pw-input-container", inputs: ["name", "controlId", "useAriaLabelledbyOnly", "label", "labelClass", "tooltipPosition", "required", "errorMsg", "isReadOnly", "showTooltip", "tooltipText", "showTriangle", "afterLabel", "showAfterLabel", "showTriangleText", "isLeftTooltip"] }, { kind: "component", type: i13.NoDataComponent, selector: "pw-no-data", inputs: ["message", "description", "withImage"] }, { kind: "directive", type: i14.RouterLink, selector: "[routerLink]", inputs: ["target", "queryParams", "fragment", "queryParamsHandling", "state", "info", "relativeTo", "preserveFragment", "skipLocationChange", "replaceUrl", "routerLink"] }, { kind: "component", type: i15.QuillEditorComponent, selector: "quill-editor" }, { kind: "pipe", type: i16.TranslocoPipe, name: "transloco" }, { kind: "pipe", type: i17.DateFormatPipe, name: "dateFormat" }, { kind: "pipe", type: i17.IfNameNullShowEmailPipe, name: "ifNameNullShowEmail" }] }); }
446
+ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.6", ngImport: i0, type: EnterpriseCommunicationsComponent, deps: [{ token: i1.GroupService }, { token: i0.Injector }, { token: i0.ChangeDetectorRef }, { token: i0.Renderer2 }, { token: i0.ElementRef }], target: i0.ɵɵFactoryTarget.Component }); }
447
+ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.6", type: EnterpriseCommunicationsComponent, isStandalone: false, selector: "pw-enterprise-communications", usesInheritance: true, ngImport: i0, template: "<section>\n <div class=\"row\">\n <div class=\"col-12\" [ngClass]=\"{'mb-3': !isEdit}\">\n <div class=\"title\">\n @if (isEdit) {\n <a\n aria-label=\"Navigate to Target\"\n (click)=\"onCancel()\"\n (keydown.enter)=\"onCancel()\"\n class=\"previous\"><i class=\"fa fa-arrow-alt-circle-left\" aria-hidden=\"true\"></i></a>\n }\n @if (isEdit) {\n <h3 class=\"m-subheader__title m-subheader__title--separator mt-1\">\n <span>{{ !isAdd ? 'Edit' : 'Create new' }} Communication</span>\n </h3>\n }\n @if (!isEdit) {\n <h2 [ngClass]=\"{ 'mt-2': isEdit }\">Communications @if (groupId) {\n <span>for {{ groupName }}</span>\n }</h2>\n }\n </div>\n @if (!isEdit) {\n <p>\n Here you can send communications to your organization, based on the teams they are\n part of.\n </p>\n }\n </div>\n </div>\n </section>\n @if (!isLoaded && isEdit) {\n <div class=\"w-100 text-center mt-3\"\n >\n <p-progressSpinner strokeWidth=\"2\"> </p-progressSpinner>\n </div>\n }\n @if (isEdit && isLoaded) {\n <div class=\"container-fluid pw-tab overflow-hidden\">\n <div class=\"p-2 mt-1\">\n <form [formGroup]=\"form\"\n (ngSubmit)=\"onSave()\">\n <div class=\"row mb-3\">\n <div class=\"col-12 col-md-12\">\n <pw-input-container [label]=\"'Enterprise.Documentation.Title' | transloco\"\n [errorMsg]=\"'Enterprise.Documentation.Validation.Title' | transloco\"\n name=\"title\" controlId=\"enterprise-communications-title\">\n <input type=\"text\"\n id=\"enterprise-communications-title\"\n class=\"form-control\"\n formControlName=\"title\"\n [ngClass]=\"{ 'is-invalid': submitted && f['title'].errors }\" />\n </pw-input-container>\n </div>\n <pw-input-container [label]=\"'Enterprise.Documentation.Body' | transloco\"\n class=\"col-12\"\n name=\"body\" controlId=\"enterprise-communications-body\" [useAriaLabelledbyOnly]=\"true\"\n [errorMsg]=\"'Enterprise.Documentation.Validation.Body' | transloco\">\n <quill-editor [styles]=\"{ height: '220px' }\"\n [attr.aria-labelledby]=\"'enterprise-communications-body-label'\"\n class=\"quillEditor quill-container\" [modules]=\"editorConfig\"\n formControlName=\"body\"\n [ngClass]=\"{ 'is-invalid': submitted && f['body'].errors }\">\n </quill-editor>\n </pw-input-container>\n <div class=\"col-12 col-md-6\">\n <pw-input-container [showTooltip]=\"true\"\n [tooltipText]=\"'Enterprise.Tooltip.Group' | transloco\"\n [label]=\"'Enterprise.Documentation.Team' | transloco\"\n [isLeftTooltip]=\"true\"\n name=\"group_id\" controlId=\"enterprise-communications-group_id\" [useAriaLabelledbyOnly]=\"true\"\n [errorMsg]=\"'Enterprise.Documentation.Validation.Team' | transloco\">\n <p-select\n [attr.aria-labelledby]=\"'enterprise-communications-group_id-label'\"\n [options]=\"allGroups\"\n formControlName=\"group_id\"\n [ngClass]=\"{ 'is-invalid': submitted && f['group_id'].errors }\"\n optionValue=\"id\"\n optionLabel=\"name\">\n </p-select>\n </pw-input-container>\n </div>\n <div class=\"col-12 col-md-2\">\n <pw-input-container [showTooltip]=\"true\"\n [tooltipText]=\"'Enterprise.Tooltip.VisibleGlobally' | transloco\"\n [label]=\"'Enterprise.Documentation.VisibleGlobally' | transloco\"\n name=\"visible_globally\" controlId=\"enterprise-communications-visible_globally\" [useAriaLabelledbyOnly]=\"true\">\n <ui-switch class=\"d-block\"\n [attr.aria-labelledby]=\"'enterprise-communications-visible_globally-label'\"\n formControlName=\"visible_globally\"\n (change)=\"onChange($event, 'visible_globally')\"\n name=\"visible_globally\">\n </ui-switch>\n </pw-input-container>\n </div>\n <div class=\"col-12 col-md-2\">\n <pw-input-container [showTooltip]=\"true\"\n [tooltipText]=\"'Enterprise.Tooltip.Published' | transloco\"\n [label]=\"'Enterprise.Documentation.Published' | transloco\"\n name=\"published\" controlId=\"enterprise-communications-published\" [useAriaLabelledbyOnly]=\"true\">\n <ui-switch class=\"d-block\"\n [attr.aria-labelledby]=\"'enterprise-communications-published-label'\"\n formControlName=\"published\"\n (change)=\"onChange($event, 'published')\"\n name=\"published\">\n </ui-switch>\n </pw-input-container>\n </div>\n <div class=\"col-12 col-md-2\">\n <pw-input-container [showTooltip]=\"true\"\n [tooltipText]=\"'Enterprise.Tooltip.Pushed' | transloco\"\n [label]=\"'Enterprise.Documentation.Pushed' | transloco\"\n name=\"pushed\" controlId=\"enterprise-communications-pushed\" [useAriaLabelledbyOnly]=\"true\">\n <ui-switch class=\"d-block\"\n [attr.aria-labelledby]=\"'enterprise-communications-pushed-label'\"\n formControlName=\"pushed\"\n (change)=\"onChange($event, 'pushed')\"\n name=\"pushed\">\n </ui-switch>\n </pw-input-container>\n </div>\n <div class=\"col-12 col-md-6\">\n <h4 class=\"mt-4\">You can add files to your communication here</h4>\n <div class=\"mb-3\">\n <span id=\"enterprise-communications-file-label\" class=\"pw-label-style\">Upload Communication File</span>\n <p-fileUpload #forms\n [attr.aria-labelledby]=\"'enterprise-communications-file-label'\"\n name=\"myfile[]\"\n [customUpload]=\"true\"\n [showUploadButton]=\"false\"\n accept=\"\"\n [disabled]=\"uploadedFiles && uploadedFiles.length > 0\"\n (onSelect)=\"onSelect($event)\"\n (onRemove)=\"onRemove($event)\"\n (onError)=\"onUploadError($event)\">\n @if (uploadedFiles?.length) {\n <ng-template pTemplate=\"content\"\n >\n @if (!filesUploaded && (!uploadedFiles || uploadedFiles.length === 0)) {\n <div class=\"drag-drop-text\">\n <p>You can drag and drop your file here</p>\n </div>\n }\n </ng-template>\n }\n </p-fileUpload>\n </div>\n </div>\n </div>\n <div class=\"row\">\n <div class=\"col-12 text-end mt-3\">\n <button type=\"button\"\n class=\"btn btn-outline-default me-2\"\n (click)=\"onCancel()\"\n (keydown.enter)=\"onCancel()\" >\n {{ 'Button.Cancel' | transloco }}\n </button>\n <button type=\"submit\"\n [buttonBusy]=\"buttonBusy\"\n class=\"btn btn-primary\" [disabled]=\"invalidFile\">\n {{ 'Button.Submit' | transloco }}\n </button>\n </div>\n </div>\n </form>\n @if (filesData?.length) {\n <div\n class=\"mt-5\">\n <h2>Communications files attached to this communication</h2>\n @for (files of filesData; track files; let i = $index) {\n <div class=\"communication-files\"\n >\n <p>\n <a target=\"blank\"\n href=\"{{ files.name.url }}\">{{\n files.name.url.split('?')[0].split('/')[\n files.name.url.split('?')[0].split('/').length - 1\n ]\n }}</a>\n </p>\n <p ngbTooltip=\"Delete\"\n class=\"ms-3\">\n <i\n class=\"fa fa-trash delete-icon\"\n (keydown.enter)=\"deleteCommunicationFiles(files.id, i)\"\n (keydown.space)=\"deleteCommunicationFiles(files.id, i)\"\n (click)=\"deleteCommunicationFiles(files.id, i)\"\n aria-hidden=\"true\"\n ></i>\n </p>\n </div>\n }\n </div>\n }\n </div>\n </div>\n }\n @if (!isEdit) {\n <div class=\"row\">\n <div class=\"col-12 text-end mb-3\">\n <button class=\"btn btn-sm btn-outline-primary\"\n (click)=\"showEditForm()\">\n <i class=\"fa fa-plus-circle\" aria-hidden=\"true\"></i> {{ 'Add Communication' }}\n </button>\n </div>\n </div>\n @if (!isLoaded) {\n <div class=\"w-100 text-center mt-3\"\n >\n <p-progressSpinner strokeWidth=\"2\"> </p-progressSpinner>\n </div>\n }\n <div class=\"primeng-datatable-container actions-collapsed mt-0 table-responsive\"\n [class.hideTable]=\"totalRecordsUnFiltered === 0\">\n <p-table #dt\n [value]=\"allCommunication\"\n [paginator]=\"totalRecords !== 0\"\n [lazy]=\"true\"\n [rows]=\"PAGE_SIZE\"\n [totalRecords]=\"totalRecords\"\n [loading]=\"loading\"\n (onLazyLoad)=\"onLazyLoad($event)\">\n <ng-template pTemplate=\"caption\">\n <div class=\"search-contact\">\n <div class=\"col-12 col-md-3 mb-2 mb-md-0 filter-domain-list\">\n <p-select\n [options]=\"allCommunicationGroups\"\n optionLabel=\"name\"\n optionValue=\"id\"\n [(ngModel)]=\"groupId\"\n placeholder=\"Select Communication Team\"\n [appendTo]=\"'body'\"\n (onChange)=\"filterDomainsList()\">\n </p-select>\n </div>\n <div class=\"text-end\">\n <label for=\"enterprise-communications-search\" class=\"visually-hidden\">Search Communications</label>\n <p-iconfield iconPosition=\"left\">\n <p-inputicon><i class=\"fa fa-search\" aria-hidden=\"true\"></i></p-inputicon>\n <input type=\"text\"\n id=\"enterprise-communications-search\"\n name=\"enterprise-communications-search\"\n [(ngModel)]=\"searchText\"\n pInputText\n placeholder=\"Search Communications...\"\n (input)=\"dt.filterGlobal($event.target.value, 'contains')\" />\n </p-iconfield>\n </div>\n </div>\n </ng-template>\n <ng-template pTemplate=\"header\">\n <tr>\n <th scope=\"true\">{{ 'Enterprise.Documentation.Title' | transloco }}</th>\n <th scope=\"true\">{{ 'Enterprise.Documentation.Sender' | transloco }}</th>\n <th scope=\"true\">{{ 'Enterprise.Documentation.Team' | transloco }}</th>\n <th scope=\"true\">{{ 'Enterprise.Documentation.Files' | transloco }}</th>\n <th scope=\"true\">{{ 'Enterprise.Documentation.Date' | transloco }}</th>\n <th scope=\"true\">{{ 'Enterprise.Documentation.Status' | transloco }}</th>\n <th scope=\"true\"\n class=\"actions-column\">{{ 'Label.Actions' | transloco }}</th>\n </tr>\n </ng-template>\n <ng-template pTemplate=\"body\"\n let-item>\n <tr class=\"table-row\">\n <td data-head=\"Title\">\n <a [routerLink]=\"[item.id]\">{{ item.title }}</a>\n </td>\n <td data-head=\"Sender\">{{ item.author | ifNameNullShowEmail }}</td>\n <td data-head=\"Team\">{{ item.group?.name }}</td>\n <td data-head=\"Files\">\n @for (files of item.group_communication_files; track files) {\n <span>\n <a target=\"blank\"\n [href]=\"files.name.url\">{{\n files.name.url.split('?')[0].split('/')[\n files.name.url.split('?')[0].split('/').length - 1\n ]\n }}</a>\n </span>\n }\n </td>\n <td data-head=\"Date\">{{ item.created_at | dateFormat: 'datetime' }}</td>\n <td data-head=\"Status\">\n @if (item.visible_globally) {\n <span\n class=\"badge bg-warning ms-2\">{{\n 'Enterprise.Documentation.Global' | transloco\n }}</span>\n }@if (item.published) {\n <span\n class=\"badge bg-info ms-2\">{{\n 'Enterprise.Documentation.Published' | transloco\n }}</span>\n }@if (item.pushed) {\n <span\n class=\"badge bg-success ms-2\">{{\n 'Enterprise.Documentation.Pushed' | transloco\n }}</span>\n }\n </td>\n <td data-head=\"Action\">\n <ul class=\"list-unstyled list-inline list-action\">\n <li ngbTooltip=\"Edit\"\n class=\"me-2 me-sm-3\">\n <i\n class=\"fa fa-edit edit-icon\"\n (click)=\"getCommunicationDetails(item.id)\"\n (keydown.enter)=\"getCommunicationDetails(item.id)\"\n aria-hidden=\"true\"\n ></i>\n </li>\n <li ngbTooltip=\"Delete\"\n class=\"me-2 me-sm-3\">\n <i\n class=\"fa fa-trash delete-icon\"\n (keydown.enter)=\"onDelete(item.id)\"\n (click)=\"onDelete(item.id)\"\n aria-hidden=\"true\"\n ></i>\n </li>\n <li ngbTooltip=\"See Communication\"\n class=\"me-2 me-sm-3 see-icon\"\n [routerLink]=\"[item.id]\">\n <i class=\"fa fa-eye eye-icon\" aria-hidden=\"true\"></i>\n </li>\n </ul>\n </td>\n </tr>\n </ng-template>\n </p-table>\n @if (totalRecords === 0 && totalRecordsUnFiltered !== 0 && !groupId) {\n <div>\n <pw-no-data [withImage]=\"true\" [message]=\"'Search.NoDataMessage' | transloco\" [description]=\"'Search.NoDataDescription' | transloco\" >\n </pw-no-data>\n </div>\n }\n @if (totalRecords !== 0) {\n <pw-records-summary [showing]=\"dt?.value?.length ?? 0\" [total]=\"totalRecords\" />\n }\n </div>\n @if (totalRecordsUnFiltered === 0 && isLoaded) {\n <div>\n <pw-no-data [withImage]=\"true\" [message]=\"'Enterprise.Communication.NoCommunication' | transloco\">\n </pw-no-data>\n </div>\n }\n }\n", styles: ["@charset \"UTF-8\";:root{--first: rgb(23 105 225);--second: rgb(54 194 131);--third: rgb(255 171 0);--text: rgb(34 34 34);--tabs_bg: rgb(23 105 225);--tabs_sub_bg: rgb(70, 136, 236);--tabs_text: rgb(255 255 255);--titles: rgb(34 34 34);--sidebar_bg: rgb(0, 48, 63);--sidebar_text: rgb(255 255 255)}.table-row{vertical-align:top}.communication-files{display:flex!important}.search-contact{display:flex;justify-content:space-between}@media(min-width:320px)and (max-width:720px){.search-contact{display:block}}.eye-icon{color:var(--first);font-size:18px;padding-left:3px;padding-right:3px}.title{display:flex}a.previous i{top:0}.drag-drop-text{padding:20px;border:2px dashed #ccc;text-align:center;color:#aaa;margin-top:10px}::ng-deep .file-upload-support-details .p-fileupload .p-fileupload-content{padding:1rem}::ng-deep .file-upload-support-details .p-fileupload-content .p-fileupload-files .p-fileupload-row>:first-child{display:flex}\n"], dependencies: [{ kind: "directive", type: i3.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i3$1.InputText, selector: "[pInputText]", inputs: ["hostName", "ptInputText", "pInputTextPT", "pInputTextUnstyled", "pSize", "variant", "fluid", "invalid"] }, { kind: "component", type: i4.IconField, selector: "p-iconfield, p-iconField, p-icon-field", inputs: ["hostName", "iconPosition", "styleClass"] }, { kind: "component", type: i5.InputIcon, selector: "p-inputicon, p-inputIcon", inputs: ["hostName", "styleClass"] }, { kind: "directive", type: i6.PrimeTemplate, selector: "[pTemplate]", inputs: ["type", "pTemplate"] }, { kind: "directive", type: i7.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: i1$1.ɵNgNoValidate, selector: "form:not([ngNoForm]):not([ngNativeValidate])" }, { kind: "directive", type: i1$1.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: i1$1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1$1.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],[formArray],form:not([ngNoForm]),[ngForm]" }, { kind: "directive", type: i1$1.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "component", type: i9$1.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: i10.Select, selector: "p-select", inputs: ["id", "scrollHeight", "filter", "panelStyle", "styleClass", "panelStyleClass", "readonly", "editable", "tabindex", "placeholder", "loadingIcon", "filterPlaceholder", "filterLocale", "inputId", "dataKey", "filterBy", "filterFields", "autofocus", "resetFilterOnHide", "checkmark", "dropdownIcon", "loading", "optionLabel", "optionValue", "optionDisabled", "optionGroupLabel", "optionGroupChildren", "group", "showClear", "emptyFilterMessage", "emptyMessage", "lazy", "virtualScroll", "virtualScrollItemSize", "virtualScrollOptions", "overlayOptions", "ariaFilterLabel", "ariaLabel", "ariaLabelledBy", "filterMatchMode", "tooltip", "tooltipPosition", "tooltipPositionStyle", "tooltipStyleClass", "focusOnHover", "selectOnFocus", "autoOptionFocus", "autofocusFilter", "filterValue", "options", "appendTo", "motionOptions"], outputs: ["onChange", "onFilter", "onFocus", "onBlur", "onClick", "onShow", "onHide", "onClear", "onLazyLoad"] }, { kind: "component", type: i11.FileUpload, selector: "p-fileupload, p-fileUpload", inputs: ["name", "url", "method", "multiple", "accept", "disabled", "auto", "withCredentials", "maxFileSize", "invalidFileSizeMessageSummary", "invalidFileSizeMessageDetail", "invalidFileTypeMessageSummary", "invalidFileTypeMessageDetail", "invalidFileLimitMessageDetail", "invalidFileLimitMessageSummary", "style", "styleClass", "previewWidth", "chooseLabel", "uploadLabel", "cancelLabel", "chooseIcon", "uploadIcon", "cancelIcon", "showUploadButton", "showCancelButton", "mode", "headers", "customUpload", "fileLimit", "uploadStyleClass", "cancelStyleClass", "removeStyleClass", "chooseStyleClass", "chooseButtonProps", "uploadButtonProps", "cancelButtonProps", "files"], outputs: ["onBeforeUpload", "onSend", "onUpload", "onError", "onClear", "onRemove", "onSelect", "onProgress", "uploadHandler", "onImageError", "onRemoveUploadedFile"] }, { kind: "directive", type: i1$1.FormGroupDirective, selector: "[formGroup]", inputs: ["formGroup"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { kind: "directive", type: i1$1.FormControlName, selector: "[formControlName]", inputs: ["formControlName", "disabled", "ngModel"], outputs: ["ngModelChange"] }, { kind: "directive", type: i9.ButtonBusyDirective, selector: "[buttonBusy]", inputs: ["buttonBusy", "busyText"] }, { kind: "component", type: i13.Table, selector: "p-table", inputs: ["frozenColumns", "frozenValue", "styleClass", "tableStyle", "tableStyleClass", "paginator", "pageLinks", "rowsPerPageOptions", "alwaysShowPaginator", "paginatorPosition", "paginatorStyleClass", "paginatorDropdownAppendTo", "paginatorDropdownScrollHeight", "currentPageReportTemplate", "showCurrentPageReport", "showJumpToPageDropdown", "showJumpToPageInput", "showFirstLastIcon", "showPageLinks", "defaultSortOrder", "sortMode", "resetPageOnSort", "selectionMode", "selectionPageOnly", "contextMenuSelection", "contextMenuSelectionMode", "dataKey", "metaKeySelection", "rowSelectable", "rowTrackBy", "lazy", "lazyLoadOnInit", "compareSelectionBy", "csvSeparator", "exportFilename", "filters", "globalFilterFields", "filterDelay", "filterLocale", "expandedRowKeys", "editingRowKeys", "rowExpandMode", "scrollable", "rowGroupMode", "scrollHeight", "virtualScroll", "virtualScrollItemSize", "virtualScrollOptions", "virtualScrollDelay", "frozenWidth", "contextMenu", "resizableColumns", "columnResizeMode", "reorderableColumns", "loading", "loadingIcon", "showLoader", "rowHover", "customSort", "showInitialSortBadge", "exportFunction", "exportHeader", "stateKey", "stateStorage", "editMode", "groupRowsBy", "size", "showGridlines", "stripedRows", "groupRowsByOrder", "responsiveLayout", "breakpoint", "paginatorLocale", "value", "columns", "first", "rows", "totalRecords", "sortField", "sortOrder", "multiSortMeta", "selection", "selectAll"], outputs: ["contextMenuSelectionChange", "selectAllChange", "selectionChange", "onRowSelect", "onRowUnselect", "onPage", "onSort", "onFilter", "onLazyLoad", "onRowExpand", "onRowCollapse", "onContextMenuSelect", "onColResize", "onColReorder", "onRowReorder", "onEditInit", "onEditComplete", "onEditCancel", "onHeaderCheckboxToggle", "sortFunction", "firstChange", "rowsChange", "onStateSave", "onStateRestore"] }, { kind: "component", type: i12.ProgressSpinner, selector: "p-progressSpinner, p-progress-spinner, p-progressspinner", inputs: ["styleClass", "strokeWidth", "fill", "animationDuration", "ariaLabel"] }, { kind: "component", type: i15.InputContainerComponent, selector: "pw-input-container", inputs: ["name", "controlId", "useAriaLabelledbyOnly", "label", "labelClass", "tooltipPosition", "required", "errorMsg", "isReadOnly", "showTooltip", "tooltipText", "showTriangle", "afterLabel", "showAfterLabel", "showTriangleText", "isLeftTooltip"] }, { kind: "component", type: i15.NoDataComponent, selector: "pw-no-data", inputs: ["message", "description", "withImage"] }, { kind: "component", type: i15.RecordsSummaryComponent, selector: "pw-records-summary", inputs: ["showing", "total"] }, { kind: "directive", type: i16.RouterLink, selector: "[routerLink]", inputs: ["target", "queryParams", "fragment", "queryParamsHandling", "state", "info", "relativeTo", "preserveFragment", "skipLocationChange", "replaceUrl", "routerLink"] }, { kind: "component", type: i17.QuillEditorComponent, selector: "quill-editor" }, { kind: "pipe", type: i18.TranslocoPipe, name: "transloco" }, { kind: "pipe", type: i19.DateFormatPipe, name: "dateFormat" }, { kind: "pipe", type: i19.IfNameNullShowEmailPipe, name: "ifNameNullShowEmail" }] }); }
425
448
  }
426
449
  __decorate([
427
450
  ValidateForm('form'),
@@ -429,21 +452,23 @@ __decorate([
429
452
  __metadata("design:paramtypes", []),
430
453
  __metadata("design:returntype", void 0)
431
454
  ], EnterpriseCommunicationsComponent.prototype, "onSave", null);
432
- i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.19", ngImport: i0, type: EnterpriseCommunicationsComponent, decorators: [{
455
+ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.6", ngImport: i0, type: EnterpriseCommunicationsComponent, decorators: [{
433
456
  type: Component,
434
- args: [{ selector: 'pw-enterprise-communications', standalone: false, template: "<section>\n <div class=\"row\">\n <div class=\"col-12\" [ngClass]=\"{'mb-3': !isEdit}\">\n <div class=\"title\">\n <a *ngIf=\"isEdit\"\n aria-label=\"Navigate to Target\"\n (click)=\"onCancel()\"\n (keydown.enter)=\"onCancel()\"\n class=\"previous\"><i class=\"fa fa-arrow-alt-circle-left\" aria-hidden=\"true\"></i></a>\n <h3 *ngIf=\"isEdit\" class=\"m-subheader__title m-subheader__title--separator mt-1\">\n <span>{{ !isAdd ? 'Edit' : 'Create new' }} Communication</span>\n </h3>\n <h2 *ngIf=\"!isEdit\" [ngClass]=\"{ 'mt-2': isEdit }\">Communications <span *ngIf=\"groupId\">for {{ groupName }}</span></h2>\n </div>\n <p *ngIf=\"!isEdit\">\n Here you can send communications to your organization, based on the teams they are\n part of.\n </p>\n </div>\n </div>\n</section>\n<div class=\"w-100 text-center mt-3\"\n *ngIf=\"!isLoaded && isEdit\">\n <p-progressSpinner strokeWidth=\"2\"> </p-progressSpinner>\n</div>\n<ng-container *ngIf=\"isEdit && isLoaded\">\n <div class=\"container-fluid pw-tab overflow-hidden\">\n <div class=\"p-2 mt-1\">\n <form [formGroup]=\"form\"\n (ngSubmit)=\"onSave()\">\n <div class=\"row mb-3\">\n <div class=\"col-12 col-md-12\">\n <pw-input-container [label]=\"'Enterprise.Documentation.Title' | transloco\"\n [errorMsg]=\"'Enterprise.Documentation.Validation.Title' | transloco\"\n name=\"title\" controlId=\"enterprise-communications-title\">\n <input type=\"text\"\n id=\"enterprise-communications-title\"\n class=\"form-control\"\n formControlName=\"title\"\n [ngClass]=\"{ 'is-invalid': submitted && f['title'].errors }\" />\n </pw-input-container>\n </div>\n\n <pw-input-container [label]=\"'Enterprise.Documentation.Body' | transloco\"\n class=\"col-12\"\n name=\"body\" controlId=\"enterprise-communications-body\" [useAriaLabelledbyOnly]=\"true\"\n [errorMsg]=\"'Enterprise.Documentation.Validation.Body' | transloco\">\n <quill-editor [styles]=\"{ height: '220px' }\"\n [attr.aria-labelledby]=\"'enterprise-communications-body-label'\"\n class=\"quillEditor quill-container\" [modules]=\"editorConfig\"\n formControlName=\"body\"\n [ngClass]=\"{ 'is-invalid': submitted && f['body'].errors }\">\n </quill-editor>\n </pw-input-container>\n\n <div class=\"col-12 col-md-6\">\n <pw-input-container [showTooltip]=\"true\"\n [tooltipText]=\"'Enterprise.Tooltip.Group' | transloco\"\n [label]=\"'Enterprise.Documentation.Team' | transloco\"\n [isLeftTooltip]=\"true\"\n name=\"group_id\" controlId=\"enterprise-communications-group_id\" [useAriaLabelledbyOnly]=\"true\"\n [errorMsg]=\"'Enterprise.Documentation.Validation.Team' | transloco\">\n <p-select\n [attr.aria-labelledby]=\"'enterprise-communications-group_id-label'\"\n [options]=\"allGroups\"\n formControlName=\"group_id\"\n [ngClass]=\"{ 'is-invalid': submitted && f['group_id'].errors }\"\n optionValue=\"id\"\n optionLabel=\"name\">\n </p-select>\n </pw-input-container>\n </div>\n\n <div class=\"col-12 col-md-2\">\n <pw-input-container [showTooltip]=\"true\"\n [tooltipText]=\"'Enterprise.Tooltip.VisibleGlobally' | transloco\"\n [label]=\"'Enterprise.Documentation.VisibleGlobally' | transloco\"\n name=\"visible_globally\" controlId=\"enterprise-communications-visible_globally\" [useAriaLabelledbyOnly]=\"true\">\n <ui-switch class=\"d-block\"\n [attr.aria-labelledby]=\"'enterprise-communications-visible_globally-label'\"\n formControlName=\"visible_globally\"\n (change)=\"onChange($event, 'visible_globally')\"\n name=\"visible_globally\">\n </ui-switch>\n </pw-input-container>\n </div>\n\n <div class=\"col-12 col-md-2\">\n <pw-input-container [showTooltip]=\"true\"\n [tooltipText]=\"'Enterprise.Tooltip.Published' | transloco\"\n [label]=\"'Enterprise.Documentation.Published' | transloco\"\n name=\"published\" controlId=\"enterprise-communications-published\" [useAriaLabelledbyOnly]=\"true\">\n <ui-switch class=\"d-block\"\n [attr.aria-labelledby]=\"'enterprise-communications-published-label'\"\n formControlName=\"published\"\n (change)=\"onChange($event, 'published')\"\n name=\"published\">\n </ui-switch>\n </pw-input-container>\n </div>\n\n <div class=\"col-12 col-md-2\">\n <pw-input-container [showTooltip]=\"true\"\n [tooltipText]=\"'Enterprise.Tooltip.Pushed' | transloco\"\n [label]=\"'Enterprise.Documentation.Pushed' | transloco\"\n name=\"pushed\" controlId=\"enterprise-communications-pushed\" [useAriaLabelledbyOnly]=\"true\">\n <ui-switch class=\"d-block\"\n [attr.aria-labelledby]=\"'enterprise-communications-pushed-label'\"\n formControlName=\"pushed\"\n (change)=\"onChange($event, 'pushed')\"\n name=\"pushed\">\n </ui-switch>\n </pw-input-container>\n </div>\n\n <div class=\"col-12 col-md-6\">\n <h4 class=\"mt-4\">You can add files to your communication here</h4>\n <div class=\"mb-3\">\n <span id=\"enterprise-communications-file-label\" class=\"pw-label-style\">Upload Communication File</span>\n <p-fileUpload #forms\n [attr.aria-labelledby]=\"'enterprise-communications-file-label'\"\n name=\"myfile[]\"\n [customUpload]=\"true\"\n [showUploadButton]=\"false\"\n accept=\"\"\n [disabled]=\"uploadedFiles && uploadedFiles.length > 0\"\n (onSelect)=\"onSelect($event)\"\n (onRemove)=\"onRemove($event)\"\n (onError)=\"onUploadError($event)\">\n <ng-template pTemplate=\"content\"\n [ngIf]=\"uploadedFiles?.length\">\n <div class=\"drag-drop-text\" *ngIf=\"!filesUploaded && (!uploadedFiles || uploadedFiles.length === 0)\">\n <p>You can drag and drop your file here</p>\n </div>\n </ng-template>\n </p-fileUpload>\n </div>\n </div>\n </div>\n <div class=\"row\">\n <div class=\"col-12 text-end mt-3\">\n <button type=\"button\"\n class=\"btn btn-outline-default me-2\"\n (click)=\"onCancel()\"\n (keydown.enter)=\"onCancel()\" >\n {{ 'Button.Cancel' | transloco }}\n </button>\n <button type=\"submit\"\n [buttonBusy]=\"buttonBusy\"\n class=\"btn btn-primary\" [disabled]=\"invalidFile\">\n {{ 'Button.Submit' | transloco }}\n </button>\n </div>\n </div>\n </form>\n <div *ngIf=\"filesData?.length\"\n class=\"mt-5\">\n <h2>Communications files attached to this communication</h2>\n <div class=\"communication-files\"\n *ngFor=\"let files of filesData; let i = index\">\n <p>\n <a target=\"blank\"\n href=\"{{ files.name.url }}\">{{\n files.name.url.split('?')[0].split('/')[\n files.name.url.split('?')[0].split('/').length - 1\n ]\n }}</a>\n </p>\n <p ngbTooltip=\"Delete\"\n class=\"ms-3\">\n <i\n class=\"fa fa-trash delete-icon\"\n (keydown.enter)=\"deleteCommunicationFiles(files.id, i)\"\n (keydown.space)=\"deleteCommunicationFiles(files.id, i)\"\n (click)=\"deleteCommunicationFiles(files.id, i)\"\n aria-hidden=\"true\"\n ></i>\n </p>\n </div>\n </div>\n </div>\n </div>\n</ng-container>\n<ng-container *ngIf=\"!isEdit\">\n <div class=\"row\">\n <div class=\"col-12 text-end mb-3\">\n <button class=\"btn btn-sm btn-outline-primary\"\n (click)=\"showEditForm()\">\n <i class=\"fa fa-plus-circle\" aria-hidden=\"true\"></i> {{ 'Add Communication' }}\n </button>\n </div>\n </div>\n <div class=\"w-100 text-center mt-3\"\n *ngIf=\"!isLoaded\">\n <p-progressSpinner strokeWidth=\"2\"> </p-progressSpinner>\n </div>\n\n <div class=\"primeng-datatable-container mt-0 table-responsive\"\n [class.hideTable]=\"totalRecordsUnFiltered === 0\">\n <p-table #dt\n [value]=\"allCommunication\"\n [paginator]=\"totalRecords !== 0\"\n [lazy]=\"true\"\n [rows]=\"PAGE_SIZE\"\n [totalRecords]=\"totalRecords\"\n [loading]=\"loading\"\n (onLazyLoad)=\"onLazyLoad($event)\">\n <ng-template pTemplate=\"caption\">\n <div class=\"search-contact\">\n <div class=\"col-12 col-md-3 mb-2 mb-md-0 filter-domain-list\">\n <p-select\n [options]=\"allCommunicationGroups\"\n optionLabel=\"name\"\n optionValue=\"id\"\n [(ngModel)]=\"groupId\"\n placeholder=\"Select Communication Team\"\n [appendTo]=\"'body'\"\n (onChange)=\"filterDomainsList()\">\n </p-select>\n </div>\n <div class=\"text-end\">\n <label for=\"enterprise-communications-search\" class=\"visually-hidden\">Search Communications</label>\n <i class=\"fa fa-search mt-2 me-2\" aria-hidden=\"true\"></i>\n <input type=\"text\"\n id=\"enterprise-communications-search\"\n name=\"enterprise-communications-search\"\n [(ngModel)]=\"searchText\"\n pInputText\n size=\"50\"\n placeholder=\"Search Communications...\"\n class=\"mw-90\"\n (input)=\"dt.filterGlobal($event.target.value, 'contains')\" />\n </div>\n </div>\n </ng-template>\n <ng-template pTemplate=\"header\">\n <tr>\n <th scope=\"true\">{{ 'Enterprise.Documentation.Title' | transloco }}</th>\n <th scope=\"true\">{{ 'Enterprise.Documentation.Sender' | transloco }}</th>\n <th scope=\"true\">{{ 'Enterprise.Documentation.Team' | transloco }}</th>\n <th scope=\"true\">{{ 'Enterprise.Documentation.Files' | transloco }}</th>\n <th scope=\"true\">{{ 'Enterprise.Documentation.Date' | transloco }}</th>\n <th scope=\"true\">{{ 'Enterprise.Documentation.Status' | transloco }}</th>\n <th scope=\"true\"\n class=\"actions-column\">{{ 'Label.Actions' | transloco }}</th>\n </tr>\n </ng-template>\n <ng-template pTemplate=\"body\"\n let-item>\n <tr class=\"table-row\">\n <td data-head=\"Title\">\n <a [routerLink]=\"[item.id]\">{{ item.title }}</a>\n </td>\n <td data-head=\"Sender\">{{ item.author | ifNameNullShowEmail }}</td>\n <td data-head=\"Team\">{{ item.group?.name }}</td>\n <td data-head=\"Files\">\n <span *ngFor=\"let files of item.group_communication_files\">\n <a target=\"blank\"\n [href]=\"files.name.url\">{{\n files.name.url.split('?')[0].split('/')[\n files.name.url.split('?')[0].split('/').length - 1\n ]\n }}</a>\n </span>\n </td>\n <td data-head=\"Date\">{{ item.created_at | dateFormat: 'datetime' }}</td>\n <td data-head=\"Status\">\n <span *ngIf=\"item.visible_globally\"\n class=\"badge bg-warning ms-2\">{{\n 'Enterprise.Documentation.Global' | transloco\n }}</span><span *ngIf=\"item.published\"\n class=\"badge bg-info ms-2\">{{\n 'Enterprise.Documentation.Published' | transloco\n }}</span><span *ngIf=\"item.pushed\"\n class=\"badge bg-success ms-2\">{{\n 'Enterprise.Documentation.Pushed' | transloco\n }}</span>\n </td>\n <td data-head=\"Action\">\n <ul class=\"list-unstyled list-inline list-action\">\n <li ngbTooltip=\"Edit\"\n class=\"me-2 me-sm-3\">\n <i\n class=\"fa fa-edit edit-icon\"\n (click)=\"getCommunicationDetails(item.id)\"\n (keydown.enter)=\"getCommunicationDetails(item.id)\"\n aria-hidden=\"true\"\n ></i>\n </li>\n <li ngbTooltip=\"Delete\"\n class=\"me-2 me-sm-3\">\n <i\n class=\"fa fa-trash delete-icon\"\n (keydown.enter)=\"onDelete(item.id)\"\n (click)=\"onDelete(item.id)\"\n aria-hidden=\"true\"\n ></i>\n </li>\n <li ngbTooltip=\"See Communication\"\n class=\"me-2 me-sm-3 see-icon\"\n [routerLink]=\"[item.id]\">\n <i class=\"fa fa-eye eye-icon\" aria-hidden=\"true\"></i>\n </li>\n </ul>\n </td>\n </tr>\n </ng-template>\n </p-table>\n <div *ngIf=\"totalRecords === 0 && totalRecordsUnFiltered !== 0 && !groupId\">\n <pw-no-data [withImage]=\"true\" [message]=\"'Search.NoDataMessage' | transloco\" [description]=\"'Search.NoDataDescription' | transloco\" >\n </pw-no-data>\n </div>\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]=\"'Enterprise.Communication.NoCommunication' | transloco\">\n </pw-no-data>\n </div>\n</ng-container>\n", styles: [":root{--first: rgb(23 105 225);--second: rgb(54 194 131);--third: rgb(255 171 0);--text: rgb(34 34 34);--tabs_bg: rgb(23 105 225);--tabs_sub_bg: rgb(70, 136, 236);--tabs_text: rgb(255 255 255);--titles: rgb(34 34 34);--sidebar_bg: rgb(0, 48, 63);--sidebar_text: rgb(255 255 255)}.table-row{vertical-align:top}.communication-files{display:flex!important}.search-contact{display:flex;justify-content:space-between}@media (min-width: 320px) and (max-width: 720px){.search-contact{display:block}}.eye-icon{color:var(--first);font-size:18px;padding-left:3px;padding-right:3px}.title{display:flex}a.previous i{top:0}.drag-drop-text{padding:20px;border:2px dashed #ccc;text-align:center;color:#aaa;margin-top:10px}::ng-deep .file-upload-support-details .p-fileupload .p-fileupload-content{padding:1rem}::ng-deep .file-upload-support-details .p-fileupload-content .p-fileupload-files .p-fileupload-row>:first-child{display:flex}\n"] }]
457
+ args: [{ selector: 'pw-enterprise-communications', standalone: false, template: "<section>\n <div class=\"row\">\n <div class=\"col-12\" [ngClass]=\"{'mb-3': !isEdit}\">\n <div class=\"title\">\n @if (isEdit) {\n <a\n aria-label=\"Navigate to Target\"\n (click)=\"onCancel()\"\n (keydown.enter)=\"onCancel()\"\n class=\"previous\"><i class=\"fa fa-arrow-alt-circle-left\" aria-hidden=\"true\"></i></a>\n }\n @if (isEdit) {\n <h3 class=\"m-subheader__title m-subheader__title--separator mt-1\">\n <span>{{ !isAdd ? 'Edit' : 'Create new' }} Communication</span>\n </h3>\n }\n @if (!isEdit) {\n <h2 [ngClass]=\"{ 'mt-2': isEdit }\">Communications @if (groupId) {\n <span>for {{ groupName }}</span>\n }</h2>\n }\n </div>\n @if (!isEdit) {\n <p>\n Here you can send communications to your organization, based on the teams they are\n part of.\n </p>\n }\n </div>\n </div>\n </section>\n @if (!isLoaded && isEdit) {\n <div class=\"w-100 text-center mt-3\"\n >\n <p-progressSpinner strokeWidth=\"2\"> </p-progressSpinner>\n </div>\n }\n @if (isEdit && isLoaded) {\n <div class=\"container-fluid pw-tab overflow-hidden\">\n <div class=\"p-2 mt-1\">\n <form [formGroup]=\"form\"\n (ngSubmit)=\"onSave()\">\n <div class=\"row mb-3\">\n <div class=\"col-12 col-md-12\">\n <pw-input-container [label]=\"'Enterprise.Documentation.Title' | transloco\"\n [errorMsg]=\"'Enterprise.Documentation.Validation.Title' | transloco\"\n name=\"title\" controlId=\"enterprise-communications-title\">\n <input type=\"text\"\n id=\"enterprise-communications-title\"\n class=\"form-control\"\n formControlName=\"title\"\n [ngClass]=\"{ 'is-invalid': submitted && f['title'].errors }\" />\n </pw-input-container>\n </div>\n <pw-input-container [label]=\"'Enterprise.Documentation.Body' | transloco\"\n class=\"col-12\"\n name=\"body\" controlId=\"enterprise-communications-body\" [useAriaLabelledbyOnly]=\"true\"\n [errorMsg]=\"'Enterprise.Documentation.Validation.Body' | transloco\">\n <quill-editor [styles]=\"{ height: '220px' }\"\n [attr.aria-labelledby]=\"'enterprise-communications-body-label'\"\n class=\"quillEditor quill-container\" [modules]=\"editorConfig\"\n formControlName=\"body\"\n [ngClass]=\"{ 'is-invalid': submitted && f['body'].errors }\">\n </quill-editor>\n </pw-input-container>\n <div class=\"col-12 col-md-6\">\n <pw-input-container [showTooltip]=\"true\"\n [tooltipText]=\"'Enterprise.Tooltip.Group' | transloco\"\n [label]=\"'Enterprise.Documentation.Team' | transloco\"\n [isLeftTooltip]=\"true\"\n name=\"group_id\" controlId=\"enterprise-communications-group_id\" [useAriaLabelledbyOnly]=\"true\"\n [errorMsg]=\"'Enterprise.Documentation.Validation.Team' | transloco\">\n <p-select\n [attr.aria-labelledby]=\"'enterprise-communications-group_id-label'\"\n [options]=\"allGroups\"\n formControlName=\"group_id\"\n [ngClass]=\"{ 'is-invalid': submitted && f['group_id'].errors }\"\n optionValue=\"id\"\n optionLabel=\"name\">\n </p-select>\n </pw-input-container>\n </div>\n <div class=\"col-12 col-md-2\">\n <pw-input-container [showTooltip]=\"true\"\n [tooltipText]=\"'Enterprise.Tooltip.VisibleGlobally' | transloco\"\n [label]=\"'Enterprise.Documentation.VisibleGlobally' | transloco\"\n name=\"visible_globally\" controlId=\"enterprise-communications-visible_globally\" [useAriaLabelledbyOnly]=\"true\">\n <ui-switch class=\"d-block\"\n [attr.aria-labelledby]=\"'enterprise-communications-visible_globally-label'\"\n formControlName=\"visible_globally\"\n (change)=\"onChange($event, 'visible_globally')\"\n name=\"visible_globally\">\n </ui-switch>\n </pw-input-container>\n </div>\n <div class=\"col-12 col-md-2\">\n <pw-input-container [showTooltip]=\"true\"\n [tooltipText]=\"'Enterprise.Tooltip.Published' | transloco\"\n [label]=\"'Enterprise.Documentation.Published' | transloco\"\n name=\"published\" controlId=\"enterprise-communications-published\" [useAriaLabelledbyOnly]=\"true\">\n <ui-switch class=\"d-block\"\n [attr.aria-labelledby]=\"'enterprise-communications-published-label'\"\n formControlName=\"published\"\n (change)=\"onChange($event, 'published')\"\n name=\"published\">\n </ui-switch>\n </pw-input-container>\n </div>\n <div class=\"col-12 col-md-2\">\n <pw-input-container [showTooltip]=\"true\"\n [tooltipText]=\"'Enterprise.Tooltip.Pushed' | transloco\"\n [label]=\"'Enterprise.Documentation.Pushed' | transloco\"\n name=\"pushed\" controlId=\"enterprise-communications-pushed\" [useAriaLabelledbyOnly]=\"true\">\n <ui-switch class=\"d-block\"\n [attr.aria-labelledby]=\"'enterprise-communications-pushed-label'\"\n formControlName=\"pushed\"\n (change)=\"onChange($event, 'pushed')\"\n name=\"pushed\">\n </ui-switch>\n </pw-input-container>\n </div>\n <div class=\"col-12 col-md-6\">\n <h4 class=\"mt-4\">You can add files to your communication here</h4>\n <div class=\"mb-3\">\n <span id=\"enterprise-communications-file-label\" class=\"pw-label-style\">Upload Communication File</span>\n <p-fileUpload #forms\n [attr.aria-labelledby]=\"'enterprise-communications-file-label'\"\n name=\"myfile[]\"\n [customUpload]=\"true\"\n [showUploadButton]=\"false\"\n accept=\"\"\n [disabled]=\"uploadedFiles && uploadedFiles.length > 0\"\n (onSelect)=\"onSelect($event)\"\n (onRemove)=\"onRemove($event)\"\n (onError)=\"onUploadError($event)\">\n @if (uploadedFiles?.length) {\n <ng-template pTemplate=\"content\"\n >\n @if (!filesUploaded && (!uploadedFiles || uploadedFiles.length === 0)) {\n <div class=\"drag-drop-text\">\n <p>You can drag and drop your file here</p>\n </div>\n }\n </ng-template>\n }\n </p-fileUpload>\n </div>\n </div>\n </div>\n <div class=\"row\">\n <div class=\"col-12 text-end mt-3\">\n <button type=\"button\"\n class=\"btn btn-outline-default me-2\"\n (click)=\"onCancel()\"\n (keydown.enter)=\"onCancel()\" >\n {{ 'Button.Cancel' | transloco }}\n </button>\n <button type=\"submit\"\n [buttonBusy]=\"buttonBusy\"\n class=\"btn btn-primary\" [disabled]=\"invalidFile\">\n {{ 'Button.Submit' | transloco }}\n </button>\n </div>\n </div>\n </form>\n @if (filesData?.length) {\n <div\n class=\"mt-5\">\n <h2>Communications files attached to this communication</h2>\n @for (files of filesData; track files; let i = $index) {\n <div class=\"communication-files\"\n >\n <p>\n <a target=\"blank\"\n href=\"{{ files.name.url }}\">{{\n files.name.url.split('?')[0].split('/')[\n files.name.url.split('?')[0].split('/').length - 1\n ]\n }}</a>\n </p>\n <p ngbTooltip=\"Delete\"\n class=\"ms-3\">\n <i\n class=\"fa fa-trash delete-icon\"\n (keydown.enter)=\"deleteCommunicationFiles(files.id, i)\"\n (keydown.space)=\"deleteCommunicationFiles(files.id, i)\"\n (click)=\"deleteCommunicationFiles(files.id, i)\"\n aria-hidden=\"true\"\n ></i>\n </p>\n </div>\n }\n </div>\n }\n </div>\n </div>\n }\n @if (!isEdit) {\n <div class=\"row\">\n <div class=\"col-12 text-end mb-3\">\n <button class=\"btn btn-sm btn-outline-primary\"\n (click)=\"showEditForm()\">\n <i class=\"fa fa-plus-circle\" aria-hidden=\"true\"></i> {{ 'Add Communication' }}\n </button>\n </div>\n </div>\n @if (!isLoaded) {\n <div class=\"w-100 text-center mt-3\"\n >\n <p-progressSpinner strokeWidth=\"2\"> </p-progressSpinner>\n </div>\n }\n <div class=\"primeng-datatable-container actions-collapsed mt-0 table-responsive\"\n [class.hideTable]=\"totalRecordsUnFiltered === 0\">\n <p-table #dt\n [value]=\"allCommunication\"\n [paginator]=\"totalRecords !== 0\"\n [lazy]=\"true\"\n [rows]=\"PAGE_SIZE\"\n [totalRecords]=\"totalRecords\"\n [loading]=\"loading\"\n (onLazyLoad)=\"onLazyLoad($event)\">\n <ng-template pTemplate=\"caption\">\n <div class=\"search-contact\">\n <div class=\"col-12 col-md-3 mb-2 mb-md-0 filter-domain-list\">\n <p-select\n [options]=\"allCommunicationGroups\"\n optionLabel=\"name\"\n optionValue=\"id\"\n [(ngModel)]=\"groupId\"\n placeholder=\"Select Communication Team\"\n [appendTo]=\"'body'\"\n (onChange)=\"filterDomainsList()\">\n </p-select>\n </div>\n <div class=\"text-end\">\n <label for=\"enterprise-communications-search\" class=\"visually-hidden\">Search Communications</label>\n <p-iconfield iconPosition=\"left\">\n <p-inputicon><i class=\"fa fa-search\" aria-hidden=\"true\"></i></p-inputicon>\n <input type=\"text\"\n id=\"enterprise-communications-search\"\n name=\"enterprise-communications-search\"\n [(ngModel)]=\"searchText\"\n pInputText\n placeholder=\"Search Communications...\"\n (input)=\"dt.filterGlobal($event.target.value, 'contains')\" />\n </p-iconfield>\n </div>\n </div>\n </ng-template>\n <ng-template pTemplate=\"header\">\n <tr>\n <th scope=\"true\">{{ 'Enterprise.Documentation.Title' | transloco }}</th>\n <th scope=\"true\">{{ 'Enterprise.Documentation.Sender' | transloco }}</th>\n <th scope=\"true\">{{ 'Enterprise.Documentation.Team' | transloco }}</th>\n <th scope=\"true\">{{ 'Enterprise.Documentation.Files' | transloco }}</th>\n <th scope=\"true\">{{ 'Enterprise.Documentation.Date' | transloco }}</th>\n <th scope=\"true\">{{ 'Enterprise.Documentation.Status' | transloco }}</th>\n <th scope=\"true\"\n class=\"actions-column\">{{ 'Label.Actions' | transloco }}</th>\n </tr>\n </ng-template>\n <ng-template pTemplate=\"body\"\n let-item>\n <tr class=\"table-row\">\n <td data-head=\"Title\">\n <a [routerLink]=\"[item.id]\">{{ item.title }}</a>\n </td>\n <td data-head=\"Sender\">{{ item.author | ifNameNullShowEmail }}</td>\n <td data-head=\"Team\">{{ item.group?.name }}</td>\n <td data-head=\"Files\">\n @for (files of item.group_communication_files; track files) {\n <span>\n <a target=\"blank\"\n [href]=\"files.name.url\">{{\n files.name.url.split('?')[0].split('/')[\n files.name.url.split('?')[0].split('/').length - 1\n ]\n }}</a>\n </span>\n }\n </td>\n <td data-head=\"Date\">{{ item.created_at | dateFormat: 'datetime' }}</td>\n <td data-head=\"Status\">\n @if (item.visible_globally) {\n <span\n class=\"badge bg-warning ms-2\">{{\n 'Enterprise.Documentation.Global' | transloco\n }}</span>\n }@if (item.published) {\n <span\n class=\"badge bg-info ms-2\">{{\n 'Enterprise.Documentation.Published' | transloco\n }}</span>\n }@if (item.pushed) {\n <span\n class=\"badge bg-success ms-2\">{{\n 'Enterprise.Documentation.Pushed' | transloco\n }}</span>\n }\n </td>\n <td data-head=\"Action\">\n <ul class=\"list-unstyled list-inline list-action\">\n <li ngbTooltip=\"Edit\"\n class=\"me-2 me-sm-3\">\n <i\n class=\"fa fa-edit edit-icon\"\n (click)=\"getCommunicationDetails(item.id)\"\n (keydown.enter)=\"getCommunicationDetails(item.id)\"\n aria-hidden=\"true\"\n ></i>\n </li>\n <li ngbTooltip=\"Delete\"\n class=\"me-2 me-sm-3\">\n <i\n class=\"fa fa-trash delete-icon\"\n (keydown.enter)=\"onDelete(item.id)\"\n (click)=\"onDelete(item.id)\"\n aria-hidden=\"true\"\n ></i>\n </li>\n <li ngbTooltip=\"See Communication\"\n class=\"me-2 me-sm-3 see-icon\"\n [routerLink]=\"[item.id]\">\n <i class=\"fa fa-eye eye-icon\" aria-hidden=\"true\"></i>\n </li>\n </ul>\n </td>\n </tr>\n </ng-template>\n </p-table>\n @if (totalRecords === 0 && totalRecordsUnFiltered !== 0 && !groupId) {\n <div>\n <pw-no-data [withImage]=\"true\" [message]=\"'Search.NoDataMessage' | transloco\" [description]=\"'Search.NoDataDescription' | transloco\" >\n </pw-no-data>\n </div>\n }\n @if (totalRecords !== 0) {\n <pw-records-summary [showing]=\"dt?.value?.length ?? 0\" [total]=\"totalRecords\" />\n }\n </div>\n @if (totalRecordsUnFiltered === 0 && isLoaded) {\n <div>\n <pw-no-data [withImage]=\"true\" [message]=\"'Enterprise.Communication.NoCommunication' | transloco\">\n </pw-no-data>\n </div>\n }\n }\n", styles: ["@charset \"UTF-8\";:root{--first: rgb(23 105 225);--second: rgb(54 194 131);--third: rgb(255 171 0);--text: rgb(34 34 34);--tabs_bg: rgb(23 105 225);--tabs_sub_bg: rgb(70, 136, 236);--tabs_text: rgb(255 255 255);--titles: rgb(34 34 34);--sidebar_bg: rgb(0, 48, 63);--sidebar_text: rgb(255 255 255)}.table-row{vertical-align:top}.communication-files{display:flex!important}.search-contact{display:flex;justify-content:space-between}@media(min-width:320px)and (max-width:720px){.search-contact{display:block}}.eye-icon{color:var(--first);font-size:18px;padding-left:3px;padding-right:3px}.title{display:flex}a.previous i{top:0}.drag-drop-text{padding:20px;border:2px dashed #ccc;text-align:center;color:#aaa;margin-top:10px}::ng-deep .file-upload-support-details .p-fileupload .p-fileupload-content{padding:1rem}::ng-deep .file-upload-support-details .p-fileupload-content .p-fileupload-files .p-fileupload-row>:first-child{display:flex}\n"] }]
435
458
  }], ctorParameters: () => [{ type: i1.GroupService }, { type: i0.Injector }, { type: i0.ChangeDetectorRef }, { type: i0.Renderer2 }, { type: i0.ElementRef }], propDecorators: { onSave: [] } });
436
459
 
437
460
  class EnterpriseInsightsComponent extends AppBaseComponent {
438
- constructor(subscriptionService, injector) {
461
+ constructor(subscriptionService, injector, cdr) {
439
462
  super(injector);
440
463
  this.subscriptionService = subscriptionService;
464
+ this.cdr = cdr;
441
465
  this.hasAccess = false;
442
466
  this.isLoaded = false;
443
467
  }
444
468
  ngOnInit() {
445
469
  this.getUserSubscriptionId().subscribe(id => {
446
470
  this.subscriptionId = id;
471
+ this.cdr.markForCheck();
447
472
  });
448
473
  this.dateRanges = HelperService.initializeDateRanges();
449
474
  this.selectedDateRange = '';
@@ -461,9 +486,11 @@ class EnterpriseInsightsComponent extends AppBaseComponent {
461
486
  .subscribe(response => {
462
487
  // API now returns { items: [], totals: {} } instead of array
463
488
  this.graph = response?.items ?? response;
489
+ this.cdr.markForCheck();
464
490
  })
465
491
  .add(() => {
466
492
  this.isLoaded = true;
493
+ this.cdr.markForCheck();
467
494
  });
468
495
  }
469
496
  onDateRangeSelect(event) {
@@ -473,13 +500,13 @@ class EnterpriseInsightsComponent extends AppBaseComponent {
473
500
  ngOnDestroy() {
474
501
  super.ngOnDestroy();
475
502
  }
476
- static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.19", ngImport: i0, type: EnterpriseInsightsComponent, deps: [{ token: i1.SubscriptionService }, { token: i0.Injector }], target: i0.ɵɵFactoryTarget.Component }); }
477
- static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.2.19", type: EnterpriseInsightsComponent, isStandalone: false, selector: "pw-enterprise-insights", usesInheritance: true, ngImport: i0, template: "<div class=\"row\">\n <div class=\"col-12 mb-3\">\n <h2>Enterprise Insight</h2>\n\n <p *ngIf=\"hasAccess\">Please find below some insight for your Enterprise subscription.</p>\n </div>\n\n <app-date-picker\n [selectedDateRange]=\"selectedDateRange\"\n [dateRanges]=\"dateRanges\"\n (dateRangeChange)=\"onDateRangeSelect($event)\">\n</app-date-picker>\n<div class=\"w-100 text-center mt-3\" *ngIf=\"!isLoaded\">\n <p-progressSpinner strokeWidth=\"2\"> </p-progressSpinner>\n</div>\n\n\n <div class=\"col-12\"\n *ngIf=\"hasAccess\">\n <ng-template [ngIf]=\"graph\">\n <plotly-plot [data]=\"graph?.data\"\n [config]=\"graph?.config\"\n [layout]=\"graph?.layout\" [useResizeHandler]=\"graph? true : false\"></plotly-plot>\n </ng-template>\n </div>\n\n <div *ngIf=\"!hasAccess && isLoaded\"\n class=\"w-100\">\n <pw-no-data [withImage]=\"true\" [message]=\"'Enterprise.Insight.NoDataMessage' | transloco\"> </pw-no-data>\n </div>\n</div>\n", dependencies: [{ kind: "directive", type: i2$1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: i3.PlotlyComponent, selector: "plotly-plot", inputs: ["data", "layout", "config", "frames", "style", "theme", "divId", "revision", "className", "debug", "useResizeHandler", "updateOnLayoutChange", "updateOnDataChange", "updateOnlyWithRevision"], outputs: ["initialized", "update", "purge", "error", "afterExport", "afterPlot", "animated", "animatingFrame", "animationInterrupted", "autoSize", "beforeExport", "beforeHover", "buttonClicked", "click", "plotlyClick", "clickAnnotation", "deselect", "doubleClick", "framework", "hover", "legendClick", "legendDoubleClick", "react", "relayout", "relayouting", "restyle", "redraw", "selected", "selecting", "sliderChange", "sliderEnd", "sliderStart", "sunburstclick", "transitioning", "transitionInterrupted", "unhover", "treemapclick", "webglcontextlost"] }, { kind: "component", type: i13.DateRangePickerComponent, selector: "app-date-picker", inputs: ["selectedDateRange", "dateRanges", "inputId"], outputs: ["dateRangeChange"] }, { kind: "component", type: i12.ProgressSpinner, selector: "p-progressSpinner, p-progress-spinner, p-progressspinner", inputs: ["styleClass", "style", "strokeWidth", "fill", "animationDuration", "ariaLabel"] }, { kind: "component", type: i13.NoDataComponent, selector: "pw-no-data", inputs: ["message", "description", "withImage"] }, { kind: "pipe", type: i16.TranslocoPipe, name: "transloco" }] }); }
503
+ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.6", ngImport: i0, type: EnterpriseInsightsComponent, deps: [{ token: i1.SubscriptionService }, { token: i0.Injector }, { token: i0.ChangeDetectorRef }], target: i0.ɵɵFactoryTarget.Component }); }
504
+ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.6", type: EnterpriseInsightsComponent, isStandalone: false, selector: "pw-enterprise-insights", usesInheritance: true, ngImport: i0, template: "<div class=\"row\">\n <div class=\"col-12 mb-3\">\n <h2>Enterprise Insight</h2>\n\n @if (hasAccess) {\n <p>Please find below some insight for your Enterprise subscription.</p>\n }\n </div>\n\n <app-date-picker\n [selectedDateRange]=\"selectedDateRange\"\n [dateRanges]=\"dateRanges\"\n (dateRangeChange)=\"onDateRangeSelect($event)\">\n </app-date-picker>\n @if (!isLoaded) {\n <div class=\"w-100 text-center mt-3\">\n <p-progressSpinner strokeWidth=\"2\"> </p-progressSpinner>\n </div>\n }\n\n\n @if (hasAccess) {\n <div class=\"col-12\"\n >\n @if (graph) {\n <plotly-plot [data]=\"graph?.data\"\n [config]=\"graph?.config\"\n [layout]=\"graph?.layout\" [useResizeHandler]=\"graph? true : false\"></plotly-plot>\n }\n </div>\n }\n\n @if (!hasAccess && isLoaded) {\n <div\n class=\"w-100\">\n <pw-no-data [withImage]=\"true\" [message]=\"'Enterprise.Insight.NoDataMessage' | transloco\"> </pw-no-data>\n </div>\n }\n</div>\n", dependencies: [{ kind: "component", type: i2$1.PlotlyComponent, selector: "plotly-plot", inputs: ["data", "layout", "config", "frames", "style", "theme", "divId", "revision", "className", "debug", "useResizeHandler", "updateOnLayoutChange", "updateOnDataChange", "updateOnlyWithRevision"], outputs: ["initialized", "update", "purge", "error", "afterExport", "afterPlot", "animated", "animatingFrame", "animationInterrupted", "autoSize", "beforeExport", "beforeHover", "buttonClicked", "click", "plotlyClick", "clickAnnotation", "deselect", "doubleClick", "framework", "hover", "legendClick", "legendDoubleClick", "react", "relayout", "relayouting", "restyle", "redraw", "selected", "selecting", "sliderChange", "sliderEnd", "sliderStart", "sunburstclick", "transitioning", "transitionInterrupted", "unhover", "treemapclick", "webglcontextlost"] }, { kind: "component", type: i15.DateRangePickerComponent, selector: "app-date-picker", inputs: ["selectedDateRange", "dateRanges", "inputId"], outputs: ["dateRangeChange"] }, { kind: "component", type: i12.ProgressSpinner, selector: "p-progressSpinner, p-progress-spinner, p-progressspinner", inputs: ["styleClass", "strokeWidth", "fill", "animationDuration", "ariaLabel"] }, { kind: "component", type: i15.NoDataComponent, selector: "pw-no-data", inputs: ["message", "description", "withImage"] }, { kind: "pipe", type: i18.TranslocoPipe, name: "transloco" }] }); }
478
505
  }
479
- i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.19", ngImport: i0, type: EnterpriseInsightsComponent, decorators: [{
506
+ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.6", ngImport: i0, type: EnterpriseInsightsComponent, decorators: [{
480
507
  type: Component,
481
- args: [{ selector: 'pw-enterprise-insights', standalone: false, template: "<div class=\"row\">\n <div class=\"col-12 mb-3\">\n <h2>Enterprise Insight</h2>\n\n <p *ngIf=\"hasAccess\">Please find below some insight for your Enterprise subscription.</p>\n </div>\n\n <app-date-picker\n [selectedDateRange]=\"selectedDateRange\"\n [dateRanges]=\"dateRanges\"\n (dateRangeChange)=\"onDateRangeSelect($event)\">\n</app-date-picker>\n<div class=\"w-100 text-center mt-3\" *ngIf=\"!isLoaded\">\n <p-progressSpinner strokeWidth=\"2\"> </p-progressSpinner>\n</div>\n\n\n <div class=\"col-12\"\n *ngIf=\"hasAccess\">\n <ng-template [ngIf]=\"graph\">\n <plotly-plot [data]=\"graph?.data\"\n [config]=\"graph?.config\"\n [layout]=\"graph?.layout\" [useResizeHandler]=\"graph? true : false\"></plotly-plot>\n </ng-template>\n </div>\n\n <div *ngIf=\"!hasAccess && isLoaded\"\n class=\"w-100\">\n <pw-no-data [withImage]=\"true\" [message]=\"'Enterprise.Insight.NoDataMessage' | transloco\"> </pw-no-data>\n </div>\n</div>\n" }]
482
- }], ctorParameters: () => [{ type: i1.SubscriptionService }, { type: i0.Injector }] });
508
+ args: [{ selector: 'pw-enterprise-insights', standalone: false, template: "<div class=\"row\">\n <div class=\"col-12 mb-3\">\n <h2>Enterprise Insight</h2>\n\n @if (hasAccess) {\n <p>Please find below some insight for your Enterprise subscription.</p>\n }\n </div>\n\n <app-date-picker\n [selectedDateRange]=\"selectedDateRange\"\n [dateRanges]=\"dateRanges\"\n (dateRangeChange)=\"onDateRangeSelect($event)\">\n </app-date-picker>\n @if (!isLoaded) {\n <div class=\"w-100 text-center mt-3\">\n <p-progressSpinner strokeWidth=\"2\"> </p-progressSpinner>\n </div>\n }\n\n\n @if (hasAccess) {\n <div class=\"col-12\"\n >\n @if (graph) {\n <plotly-plot [data]=\"graph?.data\"\n [config]=\"graph?.config\"\n [layout]=\"graph?.layout\" [useResizeHandler]=\"graph? true : false\"></plotly-plot>\n }\n </div>\n }\n\n @if (!hasAccess && isLoaded) {\n <div\n class=\"w-100\">\n <pw-no-data [withImage]=\"true\" [message]=\"'Enterprise.Insight.NoDataMessage' | transloco\"> </pw-no-data>\n </div>\n }\n</div>\n" }]
509
+ }], ctorParameters: () => [{ type: i1.SubscriptionService }, { type: i0.Injector }, { type: i0.ChangeDetectorRef }] });
483
510
 
484
511
  class EnterpriseMembersComponent extends AppBaseComponent {
485
512
  constructor(injector, formBuilder, subscriptionService, authService, adminService, cdr) {
@@ -515,17 +542,16 @@ class EnterpriseMembersComponent extends AppBaseComponent {
515
542
  this.id = this.userSubscription?.id;
516
543
  this.getSubscriptionDetails();
517
544
  }
545
+ this.cdr.markForCheck();
518
546
  });
519
547
  this.userStore().subscribe(user => {
520
548
  if (user) {
521
549
  this.user = user;
522
550
  }
551
+ this.cdr.markForCheck();
523
552
  });
524
553
  this.chatPermission = `${PermissionService.selectedProduct?.permission}.${PermissionService.selectedProduct?.feature_key}.Chat`;
525
554
  }
526
- ngAfterViewChecked() {
527
- this.cdr.detectChanges();
528
- }
529
555
  onLazyLoad(event) {
530
556
  if (this.user) {
531
557
  const pageDetails = HelperService.onTableLazyLoad(event);
@@ -641,6 +667,7 @@ class EnterpriseMembersComponent extends AppBaseComponent {
641
667
  this.getSubscriptionRoles();
642
668
  }
643
669
  }
670
+ this.cdr.markForCheck();
644
671
  });
645
672
  }
646
673
  getSubscriptionRoles() {
@@ -649,6 +676,7 @@ class EnterpriseMembersComponent extends AppBaseComponent {
649
676
  if (this.allRoles) {
650
677
  this.filterRoles();
651
678
  }
679
+ this.cdr.markForCheck();
652
680
  });
653
681
  }
654
682
  filterRoles() {
@@ -689,6 +717,7 @@ class EnterpriseMembersComponent extends AppBaseComponent {
689
717
  else {
690
718
  this.toast.success(this.translation.translate('Admin.Users.DeletedMessage'));
691
719
  }
720
+ this.cdr.markForCheck();
692
721
  });
693
722
  }
694
723
  getSubscriptionDetails() {
@@ -698,6 +727,7 @@ class EnterpriseMembersComponent extends AppBaseComponent {
698
727
  this.productName = resp.products[0].name;
699
728
  this.subscription = resp;
700
729
  this.availableUnits = resp.products[0].purchased_units - resp.units_in_use;
730
+ this.cdr.markForCheck();
701
731
  });
702
732
  }
703
733
  onSignUpMember() {
@@ -735,9 +765,11 @@ class EnterpriseMembersComponent extends AppBaseComponent {
735
765
  else {
736
766
  this.toast.error(response.error.message);
737
767
  }
768
+ this.cdr.markForCheck();
738
769
  })
739
770
  .add(() => {
740
771
  this.buttonBusy = false;
772
+ this.cdr.markForCheck();
741
773
  });
742
774
  }
743
775
  }
@@ -765,6 +797,7 @@ class EnterpriseMembersComponent extends AppBaseComponent {
765
797
  else {
766
798
  this.toast.error(response.error.message);
767
799
  }
800
+ this.cdr.markForCheck();
768
801
  });
769
802
  }
770
803
  });
@@ -792,6 +825,7 @@ class EnterpriseMembersComponent extends AppBaseComponent {
792
825
  page: this.page,
793
826
  page_size: PAGE_SIZE
794
827
  });
828
+ this.cdr.markForCheck();
795
829
  });
796
830
  }
797
831
  });
@@ -799,8 +833,8 @@ class EnterpriseMembersComponent extends AppBaseComponent {
799
833
  ngOnDestroy() {
800
834
  super.ngOnDestroy();
801
835
  }
802
- static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.19", ngImport: i0, type: EnterpriseMembersComponent, deps: [{ token: i0.Injector }, { token: i1$1.UntypedFormBuilder }, { token: i1.SubscriptionService }, { token: i1.AuthService }, { token: i3$1.AdminService }, { token: i0.ChangeDetectorRef }], target: i0.ɵɵFactoryTarget.Component }); }
803
- static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.2.19", type: EnterpriseMembersComponent, isStandalone: false, selector: "pw-enterprise-members", usesInheritance: true, ngImport: i0, template: "<section>\n <div class=\"row\">\n <div class=\"col-12 mb-3\">\n <div class=\"title\">\n <a *ngIf=\"isAddEnabled\"\n aria-label=\"Navigate to Target\"\n (click)=\"back()\"\n class=\"previous\"><i class=\"fa fa-arrow-alt-circle-left\" aria-hidden=\"true\"></i></a>\n <h2>Enterprise Members for {{ productName }}</h2>\n </div>\n <p *ngIf=\"!isAddEnabled\">\n You'll find in this section all the members of your subscription. Based on your role\n in the enterprise, you'll be able to see, add, edit or remove access to them.\n </p>\n <p *ngIf=\"isAddEnabled\">Here you can add members to your subscriptions</p>\n </div>\n </div>\n</section>\n<section id=\"enrolled\"\n *ngIf=\"!isAddEnabled\">\n <div class=\"row\">\n <div class=\"col-12 text-end\"\n *ngIf=\"hasAccess\">\n <button class=\"btn btn-sm btn-outline-primary\"\n *ngIf=\"!isAddEnabled\"\n (click)=\"isAddEnabled = true\">\n <i class=\"fa fa-plus-circle\" aria-hidden=\"true\"></i> Add Members\n </button>\n </div>\n </div>\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]=\"totalRecordsUnFiltered === 0\">\n <p-table #dt\n [value]=\"subscriptionMembers?.members\"\n [paginator]=\"subscriptionMembers?.members.length !== 0\"\n [totalRecords]=\"subscriptionMembers?.members.length\"\n [globalFilterFields]=\"['email', 'name']\"\n [rows]=\"PAGE_SIZE\"\n [loading]=\"loading\"\n [lazy]=\"true\"\n (onLazyLoad)=\"onLazyLoad($event)\">\n <ng-template pTemplate=\"caption\">\n <div class=\"text-end\">\n <label for=\"enterprise-members-search-contact\" class=\"visually-hidden\">Search contact</label>\n <i class=\"fa fa-search mt-2 me-2\" aria-hidden=\"true\"></i>\n <input type=\"text\"\n id=\"enterprise-members-search-contact\"\n name=\"enterprise-members-search-contact\"\n [(ngModel)]=\"searchText\"\n pInputText\n size=\"50\"\n placeholder=\"Search contact...\"\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\">{{ 'Label.Email' | transloco }}</th>\n <th scope=\"true\">{{ 'Enterprise.Members.Team' | transloco }}</th>\n <th scope=\"true\">{{ 'Enterprise.Members.LastSeen' | transloco }}</th>\n <th scope=\"true\">{{ 'Label.Actions' | transloco }}</th>\n </tr>\n </ng-template>\n <ng-template pTemplate=\"body\"\n let-users>\n <tr class=\"table-row\">\n <td data-head=\"Name\">\n <span>\n <a [routerLink]=\"['/members', users.slug]\">{{\n users?.preferred_name\n ? users?.preferred_name\n : (users | ifNameNullShowEmail)\n }}\n </a>\n <span class=\"ms-2\"\n *ngIf=\"!users?.has_password\"\n [pTooltip]=\"'This user hasn\\'t joined yet'\"\n tooltipPosition=\"top\">\n <i class=\"fas fa-exclamation-triangle text-warning\"></i>\n </span>\n <span class=\"ms-2\"\n *ngIf=\"users?.enable_two_factor_authenticator\"\n [pTooltip]=\"'2FA enabled'\"\n tooltipPosition=\"top\">\n <i class=\"fa-solid fa-lock text-success\"></i>\n </span>\n <span class=\"ms-2\"\n *ngIf=\"users?.blocked\"\n [pTooltip]=\"'This user has been blocked, please contact support'\"\n tooltipPosition=\"top\">\n <i class=\"fa-solid fa-hexagon-exclamation text-danger\"></i>\n </span>\n <span class=\"badge bg-dark mx-1\" *ngIf=\"users.id === subscriptionOwner\"> Owner </span>\n <span class=\"badge bg-success mx-1 admin-badge\" *ngIf=\"subscriptionMembers.admins.includes(users.id)\"> Admin </span>\n <span class=\"badge bg-info mx-1\" *ngIf=\"users.id === user.id\"> You </span>\n </span>\n </td>\n <td data-head=\"Email\">{{ users.email }}</td>\n <td data-head=\"Team\">\n <span *ngFor=\"let groups of users.user_groups\"><a class=\"badge bg-primary text-white ms-2\"\n [routerLink]=\"[\n '/' + subscription?.slug + '/enterprise',\n 'groups',\n groups.id,\n 'members'\n ]\">{{ groups.name }}</a>\n </span>\n </td>\n <td data-head=\"Last seen\">\n <span *ngIf=\"users?.current_sign_in_at; else lastSignin\">\n <span>{{ users.current_sign_in_at | dateFormat }}</span>\n <span *ngIf=\"users.current_sign_in_at\">&nbsp;({{ users.current_sign_in_at | sinceAgo }})</span>\n </span>\n <ng-template #lastSignin>\n <span>\n <span>{{ users.last_sign_in_at | dateFormat }}</span>\n <span *ngIf=\"users.last_sign_in_at\">&nbsp;({{ users.last_sign_in_at | sinceAgo }})</span>\n </span>\n </ng-template>\n </td>\n <td data-head=\"Action\">\n <ul class=\"list-unstyled list-inline d-inline-block me-2 list-action\">\n <ng-container *ngIf=\"hasAccess && allRoles.length\">\n <li class=\"enterprise-member-table mx-2 mb-2 mb-sm-0\" *rbacAllow=\"'Pages.Alpha'\">\n <p-multiSelect [(ngModel)]=\"users.selected_roles\" [options]=\"allRoles\" (onChange)=\"onRoleChange($event, users)\"\n inputId=\"enterprise-members-roles-{{ users.id }}\"\n placeholder=\"Set roles\" [showHeader]=\"false\" appendTo=\"body\">\n </p-multiSelect>\n </li>\n </ng-container>\n <!-- Message Icon -->\n <li ngbTooltip=\"Message\"\n class=\"me-2 me-sm-3 mx-2\"\n *rbacAllow=\"chatPermission\"\n [class.invisible]=\"user && user.id === users.id\"\n [routerLink]=\"['/message']\"\n [fragment]=\"users.slug\">\n <i class=\"fa fa-comments cta1-icon\" aria-hidden=\"true\"></i>\n </li>\n <!-- Action Buttons -->\n <ng-template [ngIf]=\"hasAccess && users.id !== subscriptionOwner\"\n [ngIfElse]=\"empty\">\n <!-- Make Admin -->\n <li ngbTooltip=\"Make Admin\"\n class=\"me-2 me-sm-3 mx-2\"\n *ngIf=\"!this.subscriptionMembers.admins.includes(users.id)\">\n <i\n class=\"fa fa-user-crown fa-lg success\"\n (click)=\"makeAdmin(users, true)\"\n (keydown.enter)=\"makeAdmin(users, true)\"\n aria-hidden=\"true\"\n ></i>\n </li>\n <li></li>\n <!-- Remove Admin -->\n <li ngbTooltip=\"Remove Admin\"\n class=\"me-2 me-sm-3 mx-2\"\n *ngIf=\"this.subscriptionMembers.admins.includes(users.id)\">\n <i\n class=\"fa fa-ban warning fa-lg\"\n (keydown.enter)=\"makeAdmin(users, false)\"\n (click)=\"makeAdmin(users, false)\"\n aria-hidden=\"true\"\n ></i>\n </li>\n </ng-template>\n <ng-template #empty>\n <li class=\"mx-3\"></li>\n </ng-template>\n <ng-container *ngIf=\"hasAccess\">\n <li class=\"delete-user mx-2\"\n ngbTooltip=\"Remove user from subscription\"\n *ngIf=\"users.id !== subscriptionOwner\">\n <i\n class=\"fa fa-trash delete-icon\"\n (keydown.enter)=\"onDelete(users)\"\n (keydown.space)=\"onDelete(users)\"\n (click)=\"onDelete(users)\"\n aria-hidden=\"true\"\n ></i>\n </li>\n </ng-container>\n </ul>\n </td>\n </tr>\n </ng-template>\n </p-table>\n <span class=\"total-records-count\" *ngIf=\"subscriptionMembers?.members.length !== 0\">{{ 'Label.Total' | transloco }}: {{ subscriptionMembers?.members.length || 0 }}</span>\n </div>\n</section>\n\n<section id=\"manage-members\"\n *ngIf=\"isAddEnabled\">\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 id=\"enterprise-members-csv-upload\"\n name=\"enterprise-members-csv-upload\"\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\" [attr.for]=\"'enterprise-members-email-' + i\">\n #{{ i + 1 }}</label>\n <div class=\"col-10 col-md-4\">\n <input formControlName=\"email\"\n [id]=\"'enterprise-members-email-' + i\"\n class=\"form-control form-control-sm\"\n placeholder=\"Email\" id=\"input_email_3\" name=\"input_email_3\"/>\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)=\"isAddEnabled = false\">\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", styles: [":root{--first: rgb(23 105 225);--second: rgb(54 194 131);--third: rgb(255 171 0);--text: rgb(34 34 34);--tabs_bg: rgb(23 105 225);--tabs_sub_bg: rgb(70, 136, 236);--tabs_text: rgb(255 255 255);--titles: rgb(34 34 34);--sidebar_bg: rgb(0, 48, 63);--sidebar_text: rgb(255 255 255)}a.previous i{top:0}.pw-tab .card{min-height:auto}.enterprise-member-table{vertical-align:middle;min-width:200px;max-width:200px}.delete-user{margin-left:15px}.title{display:flex}.table-row{vertical-align:top}.admin-badge{background-color:var(--first)}td{vertical-align:middle}\n"], dependencies: [{ kind: "directive", type: i2$1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i2$1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i5.InputText, selector: "[pInputText]", inputs: ["variant", "fluid", "pSize"] }, { kind: "directive", type: i4.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: i1$1.ɵNgNoValidate, selector: "form:not([ngNoForm]):not([ngNativeValidate])" }, { kind: "directive", type: i1$1.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: i1$1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1$1.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { kind: "directive", type: i1$1.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "directive", type: i7$1.PrimeTemplate, selector: "[pTemplate]", inputs: ["type", "pTemplate"] }, { kind: "directive", type: i1$1.FormGroupDirective, selector: "[formGroup]", inputs: ["formGroup"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { kind: "directive", type: i1$1.FormControlName, selector: "[formControlName]", inputs: ["formControlName", "disabled", "ngModel"], outputs: ["ngModelChange"] }, { kind: "directive", type: i1$1.FormGroupName, selector: "[formGroupName]", inputs: ["formGroupName"] }, { kind: "directive", type: i1$1.FormArrayName, selector: "[formArrayName]", inputs: ["formArrayName"] }, { kind: "directive", type: i8.ButtonBusyDirective, selector: "[buttonBusy]", inputs: ["buttonBusy", "busyText"] }, { kind: "directive", type: i8.RbacAllowDirective, selector: "[rbacAllow]", inputs: ["rbacAllow"] }, { kind: "component", type: i9$1.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", "size", "showGridlines", "stripedRows", "groupRowsByOrder", "responsiveLayout", "breakpoint", "paginatorLocale", "value", "columns", "first", "rows", "totalRecords", "sortField", "sortOrder", "multiSortMeta", "selection", "virtualRowHeight", "selectAll"], outputs: ["contextMenuSelectionChange", "selectAllChange", "selectionChange", "onRowSelect", "onRowUnselect", "onPage", "onSort", "onFilter", "onLazyLoad", "onRowExpand", "onRowCollapse", "onContextMenuSelect", "onColResize", "onColReorder", "onRowReorder", "onEditInit", "onEditComplete", "onEditCancel", "onHeaderCheckboxToggle", "sortFunction", "firstChange", "rowsChange", "onStateSave", "onStateRestore"] }, { kind: "component", type: i10.MultiSelect, selector: "p-multiSelect, p-multiselect, p-multi-select", inputs: ["id", "ariaLabel", "style", "styleClass", "panelStyle", "panelStyleClass", "inputId", "disabled", "fluid", "readonly", "group", "filter", "filterPlaceHolder", "filterLocale", "overlayVisible", "tabindex", "variant", "appendTo", "dataKey", "name", "ariaLabelledBy", "displaySelectedLabel", "maxSelectedLabels", "selectionLimit", "selectedItemsLabel", "showToggleAll", "emptyFilterMessage", "emptyMessage", "resetFilterOnHide", "dropdownIcon", "chipIcon", "optionLabel", "optionValue", "optionDisabled", "optionGroupLabel", "optionGroupChildren", "showHeader", "filterBy", "scrollHeight", "lazy", "virtualScroll", "loading", "virtualScrollItemSize", "loadingIcon", "virtualScrollOptions", "overlayOptions", "ariaFilterLabel", "filterMatchMode", "tooltip", "tooltipPosition", "tooltipPositionStyle", "tooltipStyleClass", "autofocusFilter", "display", "autocomplete", "size", "showClear", "autofocus", "autoZIndex", "baseZIndex", "showTransitionOptions", "hideTransitionOptions", "defaultLabel", "placeholder", "options", "filterValue", "itemSize", "selectAll", "focusOnHover", "filterFields", "selectOnFocus", "autoOptionFocus", "highlightOnSelect"], outputs: ["onChange", "onFilter", "onFocus", "onBlur", "onClick", "onClear", "onPanelShow", "onPanelHide", "onLazyLoad", "onRemove", "onSelectAllChange"] }, { kind: "component", type: i12.ProgressSpinner, selector: "p-progressSpinner, p-progress-spinner, p-progressspinner", inputs: ["styleClass", "style", "strokeWidth", "fill", "animationDuration", "ariaLabel"] }, { kind: "directive", type: i12$1.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: i14.RouterLink, selector: "[routerLink]", inputs: ["target", "queryParams", "fragment", "queryParamsHandling", "state", "info", "relativeTo", "preserveFragment", "skipLocationChange", "replaceUrl", "routerLink"] }, { kind: "directive", type: i14$1.NgFileDropDirective, selector: "[ngFileDrop]", inputs: ["options", "uploadInput"], outputs: ["uploadOutput"] }, { kind: "directive", type: i14$1.NgFileSelectDirective, selector: "[ngFileSelect]", inputs: ["options", "uploadInput"], outputs: ["uploadOutput"] }, { kind: "pipe", type: i16.TranslocoPipe, name: "transloco" }, { kind: "pipe", type: i17.DateFormatPipe, name: "dateFormat" }, { kind: "pipe", type: i17.SinceAgoPipe, name: "sinceAgo" }, { kind: "pipe", type: i17.IfNameNullShowEmailPipe, name: "ifNameNullShowEmail" }] }); }
836
+ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.6", ngImport: i0, type: EnterpriseMembersComponent, deps: [{ token: i0.Injector }, { token: i1$1.UntypedFormBuilder }, { token: i1.SubscriptionService }, { token: i1.AuthService }, { token: i3$2.AdminService }, { token: i0.ChangeDetectorRef }], target: i0.ɵɵFactoryTarget.Component }); }
837
+ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.6", type: EnterpriseMembersComponent, isStandalone: false, selector: "pw-enterprise-members", usesInheritance: true, ngImport: i0, template: "<section>\n <div class=\"row\">\n <div class=\"col-12 mb-3\">\n <div class=\"title\">\n @if (isAddEnabled) {\n <a\n aria-label=\"Navigate to Target\"\n (click)=\"back()\"\n class=\"previous\"><i class=\"fa fa-arrow-alt-circle-left\" aria-hidden=\"true\"></i></a>\n }\n <h2>Enterprise Members for {{ productName }}</h2>\n </div>\n @if (!isAddEnabled) {\n <p>\n You'll find in this section all the members of your subscription. Based on your role\n in the enterprise, you'll be able to see, add, edit or remove access to them.\n </p>\n }\n @if (isAddEnabled) {\n <p>Here you can add members to your subscriptions</p>\n }\n </div>\n </div>\n </section>\n @if (!isAddEnabled) {\n <section id=\"enrolled\"\n >\n <div class=\"row\">\n @if (hasAccess) {\n <div class=\"col-12 text-end\"\n >\n @if (!isAddEnabled) {\n <button class=\"btn btn-sm btn-outline-primary\"\n (click)=\"isAddEnabled = true\">\n <i class=\"fa fa-plus-circle\" aria-hidden=\"true\"></i> Add Members\n </button>\n }\n </div>\n }\n </div>\n @if (!isLoaded) {\n <div class=\"w-100 text-center mt-3\"\n >\n <p-progressSpinner strokeWidth=\"2\"> </p-progressSpinner>\n </div>\n }\n <div class=\"primeng-datatable-container actions-collapsed table-responsive\"\n [class.hideTable]=\"totalRecordsUnFiltered === 0\">\n <p-table #dt\n [value]=\"subscriptionMembers?.members\"\n [paginator]=\"subscriptionMembers?.members.length !== 0\"\n [totalRecords]=\"subscriptionMembers?.members.length\"\n [globalFilterFields]=\"['email', 'name']\"\n [rows]=\"PAGE_SIZE\"\n [loading]=\"loading\"\n [lazy]=\"true\"\n (onLazyLoad)=\"onLazyLoad($event)\">\n <ng-template pTemplate=\"caption\">\n <div class=\"text-end\">\n <label for=\"enterprise-members-search-contact\" class=\"visually-hidden\">Search contact</label>\n <p-iconfield iconPosition=\"left\">\n <p-inputicon><i class=\"fa fa-search\" aria-hidden=\"true\"></i></p-inputicon>\n <input type=\"text\"\n id=\"enterprise-members-search-contact\"\n name=\"enterprise-members-search-contact\"\n [(ngModel)]=\"searchText\"\n pInputText\n placeholder=\"Search contact...\"\n (input)=\"dt.filterGlobal($event.target.value, 'contains')\" />\n </p-iconfield>\n </div>\n </ng-template>\n <ng-template pTemplate=\"header\">\n <tr>\n <th scope=\"true\">{{ 'Label.Name' | transloco }}</th>\n <th scope=\"true\">{{ 'Label.Email' | transloco }}</th>\n <th scope=\"true\">{{ 'Enterprise.Members.Team' | transloco }}</th>\n <th scope=\"true\">{{ 'Label.Roles' | transloco }}</th>\n <th scope=\"true\">{{ 'Enterprise.Members.LastSeen' | transloco }}</th>\n <th scope=\"true\" class=\"actions-list-three\">{{ 'Label.Actions' | transloco }}</th>\n </tr>\n </ng-template>\n <ng-template pTemplate=\"body\"\n let-users>\n <tr class=\"table-row\">\n <td data-head=\"Name\">\n <span>\n <a [routerLink]=\"['/members', users.slug]\">{{\n users?.preferred_name\n ? users?.preferred_name\n : (users | ifNameNullShowEmail)\n }}\n </a>\n @if (!users?.has_password) {\n <span class=\"ms-2\"\n [pTooltip]=\"'This user hasn\\'t joined yet'\"\n tooltipPosition=\"top\">\n <i class=\"fas fa-exclamation-triangle text-warning\"></i>\n </span>\n }\n @if (users?.enable_two_factor_authenticator) {\n <span class=\"ms-2\"\n [pTooltip]=\"'2FA enabled'\"\n tooltipPosition=\"top\">\n <i class=\"fa-solid fa-lock text-success\"></i>\n </span>\n }\n @if (users?.blocked) {\n <span class=\"ms-2\"\n [pTooltip]=\"'This user has been blocked, please contact support'\"\n tooltipPosition=\"top\">\n <i class=\"fa-solid fa-hexagon-exclamation text-danger\"></i>\n </span>\n }\n @if (users.id === subscriptionOwner) {\n <span class=\"badge bg-dark mx-1\"> Owner </span>\n }\n @if (subscriptionMembers.admins.includes(users.id)) {\n <span class=\"badge bg-success mx-1 admin-badge\"> Admin </span>\n }\n @if (users.id === user.id) {\n <span class=\"badge bg-info mx-1\"> You </span>\n }\n </span>\n </td>\n <td data-head=\"Email\">{{ users.email }}</td>\n <td data-head=\"Team\">\n @for (groups of users.user_groups; track groups) {\n <span><a class=\"badge bg-primary text-white ms-2\"\n [routerLink]=\"[\n '/' + subscription?.slug + '/enterprise',\n 'groups',\n groups.id,\n 'members'\n ]\">{{ groups.name }}</a>\n </span>\n }\n </td>\n <td data-head=\"Roles\">\n @if (hasAccess && allRoles.length) {\n <div *rbacAllow=\"'Pages.Alpha'\">\n <p-multiSelect [(ngModel)]=\"users.selected_roles\" [options]=\"allRoles\" (onChange)=\"onRoleChange($event, users)\"\n inputId=\"enterprise-members-roles-{{ users.id }}\"\n placeholder=\"Set roles\" [showHeader]=\"false\" appendTo=\"body\">\n </p-multiSelect>\n </div>\n }\n </td>\n <td data-head=\"Last seen\">\n @if (users?.current_sign_in_at) {\n <span>\n <span>{{ users.current_sign_in_at | dateFormat }}</span>\n @if (users.current_sign_in_at) {\n <span>&nbsp;({{ users.current_sign_in_at | sinceAgo }})</span>\n }\n </span>\n } @else {\n <span>\n <span>{{ users.last_sign_in_at | dateFormat }}</span>\n @if (users.last_sign_in_at) {\n <span>&nbsp;({{ users.last_sign_in_at | sinceAgo }})</span>\n }\n </span>\n }\n </td>\n <td data-head=\"Action\">\n <ul class=\"list-unstyled list-inline\">\n <!-- Message Icon -->\n <li ngbTooltip=\"Message\"\n class=\"me-2 me-sm-3 mx-2\"\n *rbacAllow=\"chatPermission\"\n [class.invisible]=\"user && user.id === users.id\"\n [routerLink]=\"['/message']\"\n [fragment]=\"users.slug\">\n <i class=\"fa fa-comments cta1-icon\" aria-hidden=\"true\"></i>\n </li>\n <!-- Action Buttons -->\n @if (hasAccess && users.id !== subscriptionOwner) {\n <!-- Make Admin -->\n @if (!this.subscriptionMembers.admins.includes(users.id)) {\n <li ngbTooltip=\"Make Admin\"\n class=\"me-2 me-sm-3 mx-2\"\n >\n <i\n class=\"fa fa-user-crown fa-lg success\"\n (click)=\"makeAdmin(users, true)\"\n (keydown.enter)=\"makeAdmin(users, true)\"\n aria-hidden=\"true\"\n ></i>\n </li>\n }\n <li></li>\n <!-- Remove Admin -->\n @if (this.subscriptionMembers.admins.includes(users.id)) {\n <li ngbTooltip=\"Remove Admin\"\n class=\"me-2 me-sm-3 mx-2\"\n >\n <i\n class=\"fa fa-ban warning fa-lg\"\n (keydown.enter)=\"makeAdmin(users, false)\"\n (click)=\"makeAdmin(users, false)\"\n aria-hidden=\"true\"\n ></i>\n </li>\n }\n } @else {\n <li class=\"mx-3\"></li>\n }\n @if (hasAccess) {\n @if (users.id !== subscriptionOwner) {\n <li class=\"delete-user mx-2\"\n ngbTooltip=\"Remove user from subscription\"\n >\n <i\n class=\"fa fa-trash delete-icon\"\n (keydown.enter)=\"onDelete(users)\"\n (keydown.space)=\"onDelete(users)\"\n (click)=\"onDelete(users)\"\n aria-hidden=\"true\"\n ></i>\n </li>\n }\n }\n </ul>\n </td>\n </tr>\n </ng-template>\n </p-table>\n @if (subscriptionMembers?.members.length !== 0) {\n <pw-records-summary [showing]=\"dt?.value?.length ?? 0\" [total]=\"subscriptionMembers?.members.length || 0\" />\n }\n </div>\n </section>\n}\n\n@if (isAddEnabled) {\n <section id=\"manage-members\"\n >\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 id=\"enterprise-members-csv-upload\"\n name=\"enterprise-members-csv-upload\"\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 @for (f of files; track f; let i = $index) {\n <div class=\"upload-item\"\n >\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 @if (f.progress?.data?.percentage !== 100) {\n <span>Uploading...</span>\n }\n @if (f.progress?.data?.percentage === 100) {\n <span>Done</span>\n }\n </span>\n @if (\n f.progress?.data?.percentage !== 0 &&\n f.progress?.data?.percentage !== 100\n ) {\n <span class=\"speed-and-eta-text\"\n >\n <span>{{ f.progress?.data?.speedHuman }} </span>\n <span>ETA {{ f.progress?.data?.etaHuman }}</span>\n </span>\n }\n </div>\n </div>\n </div>\n }\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 @for (\n item of form.get('emailsFormArray')['controls']; track\n item; let i = $index; let last = $last) {\n <div formArrayName=\"emailsFormArray\"\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\" [attr.for]=\"'enterprise-members-email-' + i\">\n #{{ i + 1 }}</label>\n <div class=\"col-10 col-md-4\">\n <input formControlName=\"email\"\n [id]=\"'enterprise-members-email-' + i\"\n class=\"form-control form-control-sm\"\n placeholder=\"Email\" id=\"input_email_3\" name=\"input_email_3\"/>\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 @if (last && emailsFormArray?.controls?.length < availableUnits) {\n <i\n class=\"btn btn-sm btn-primary fal fa-plus ms-2\"\n title=\"Add More\"\n (click)=\"addItem()\"\n (keydown.enter)=\"addItem()\"\n aria-hidden=\"true\"\n ></i>\n }\n </div>\n </div>\n </div>\n </div>\n }\n <div class=\"text-center mt-2\">\n <button class=\"btn btn-sm btn-outline-default me-2\"\n (click)=\"isAddEnabled = false\">\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}\n", styles: ["@charset \"UTF-8\";:root{--first: rgb(23 105 225);--second: rgb(54 194 131);--third: rgb(255 171 0);--text: rgb(34 34 34);--tabs_bg: rgb(23 105 225);--tabs_sub_bg: rgb(70, 136, 236);--tabs_text: rgb(255 255 255);--titles: rgb(34 34 34);--sidebar_bg: rgb(0, 48, 63);--sidebar_text: rgb(255 255 255)}a.previous i{top:0}.pw-tab .card{min-height:auto}td[data-head=Roles]{vertical-align:middle;min-width:200px;max-width:220px}td[data-head=Roles] p-multiselect{width:100%}.title{display:flex}.table-row{vertical-align:top}.admin-badge{background-color:var(--first)}td{vertical-align:middle}\n"], dependencies: [{ kind: "directive", type: i3$1.InputText, selector: "[pInputText]", inputs: ["hostName", "ptInputText", "pInputTextPT", "pInputTextUnstyled", "pSize", "variant", "fluid", "invalid"] }, { kind: "component", type: i4.IconField, selector: "p-iconfield, p-iconField, p-icon-field", inputs: ["hostName", "iconPosition", "styleClass"] }, { kind: "component", type: i5.InputIcon, selector: "p-inputicon, p-inputIcon", inputs: ["hostName", "styleClass"] }, { kind: "directive", type: i6.PrimeTemplate, selector: "[pTemplate]", inputs: ["type", "pTemplate"] }, { kind: "directive", type: i7.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: i1$1.ɵNgNoValidate, selector: "form:not([ngNoForm]):not([ngNativeValidate])" }, { kind: "directive", type: i1$1.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: i1$1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1$1.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],[formArray],form:not([ngNoForm]),[ngForm]" }, { kind: "directive", type: i1$1.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "directive", type: i1$1.FormGroupDirective, selector: "[formGroup]", inputs: ["formGroup"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { kind: "directive", type: i1$1.FormControlName, selector: "[formControlName]", inputs: ["formControlName", "disabled", "ngModel"], outputs: ["ngModelChange"] }, { kind: "directive", type: i1$1.FormGroupName, selector: "[formGroupName]", inputs: ["formGroupName"] }, { kind: "directive", type: i1$1.FormArrayName, selector: "[formArrayName]", inputs: ["formArrayName"] }, { kind: "directive", type: i9.ButtonBusyDirective, selector: "[buttonBusy]", inputs: ["buttonBusy", "busyText"] }, { kind: "directive", type: i9.RbacAllowDirective, selector: "[rbacAllow]", inputs: ["rbacAllow"] }, { kind: "component", type: i13.Table, selector: "p-table", inputs: ["frozenColumns", "frozenValue", "styleClass", "tableStyle", "tableStyleClass", "paginator", "pageLinks", "rowsPerPageOptions", "alwaysShowPaginator", "paginatorPosition", "paginatorStyleClass", "paginatorDropdownAppendTo", "paginatorDropdownScrollHeight", "currentPageReportTemplate", "showCurrentPageReport", "showJumpToPageDropdown", "showJumpToPageInput", "showFirstLastIcon", "showPageLinks", "defaultSortOrder", "sortMode", "resetPageOnSort", "selectionMode", "selectionPageOnly", "contextMenuSelection", "contextMenuSelectionMode", "dataKey", "metaKeySelection", "rowSelectable", "rowTrackBy", "lazy", "lazyLoadOnInit", "compareSelectionBy", "csvSeparator", "exportFilename", "filters", "globalFilterFields", "filterDelay", "filterLocale", "expandedRowKeys", "editingRowKeys", "rowExpandMode", "scrollable", "rowGroupMode", "scrollHeight", "virtualScroll", "virtualScrollItemSize", "virtualScrollOptions", "virtualScrollDelay", "frozenWidth", "contextMenu", "resizableColumns", "columnResizeMode", "reorderableColumns", "loading", "loadingIcon", "showLoader", "rowHover", "customSort", "showInitialSortBadge", "exportFunction", "exportHeader", "stateKey", "stateStorage", "editMode", "groupRowsBy", "size", "showGridlines", "stripedRows", "groupRowsByOrder", "responsiveLayout", "breakpoint", "paginatorLocale", "value", "columns", "first", "rows", "totalRecords", "sortField", "sortOrder", "multiSortMeta", "selection", "selectAll"], outputs: ["contextMenuSelectionChange", "selectAllChange", "selectionChange", "onRowSelect", "onRowUnselect", "onPage", "onSort", "onFilter", "onLazyLoad", "onRowExpand", "onRowCollapse", "onContextMenuSelect", "onColResize", "onColReorder", "onRowReorder", "onEditInit", "onEditComplete", "onEditCancel", "onHeaderCheckboxToggle", "sortFunction", "firstChange", "rowsChange", "onStateSave", "onStateRestore"] }, { kind: "component", type: i11$1.MultiSelect, selector: "p-multiSelect, p-multiselect, p-multi-select", inputs: ["id", "ariaLabel", "styleClass", "panelStyle", "panelStyleClass", "inputId", "readonly", "group", "filter", "filterPlaceHolder", "filterLocale", "overlayVisible", "tabindex", "dataKey", "ariaLabelledBy", "displaySelectedLabel", "maxSelectedLabels", "selectionLimit", "selectedItemsLabel", "showToggleAll", "emptyFilterMessage", "emptyMessage", "resetFilterOnHide", "dropdownIcon", "chipIcon", "optionLabel", "optionValue", "optionDisabled", "optionGroupLabel", "optionGroupChildren", "showHeader", "filterBy", "scrollHeight", "lazy", "virtualScroll", "loading", "virtualScrollItemSize", "loadingIcon", "virtualScrollOptions", "overlayOptions", "ariaFilterLabel", "filterMatchMode", "tooltip", "tooltipPosition", "tooltipPositionStyle", "tooltipStyleClass", "autofocusFilter", "display", "autocomplete", "showClear", "autofocus", "placeholder", "options", "filterValue", "selectAll", "focusOnHover", "filterFields", "selectOnFocus", "autoOptionFocus", "highlightOnSelect", "size", "variant", "fluid", "appendTo", "motionOptions"], outputs: ["onChange", "onFilter", "onFocus", "onBlur", "onClick", "onClear", "onPanelShow", "onPanelHide", "onLazyLoad", "onRemove", "onSelectAllChange"] }, { kind: "component", type: i12.ProgressSpinner, selector: "p-progressSpinner, p-progress-spinner, p-progressspinner", inputs: ["styleClass", "strokeWidth", "fill", "animationDuration", "ariaLabel"] }, { kind: "component", type: i15.RecordsSummaryComponent, selector: "pw-records-summary", inputs: ["showing", "total"] }, { kind: "directive", type: i14.Tooltip, selector: "[pTooltip]", inputs: ["tooltipPosition", "tooltipEvent", "positionStyle", "tooltipStyleClass", "tooltipZIndex", "escape", "showDelay", "hideDelay", "life", "positionTop", "positionLeft", "autoHide", "fitContent", "hideOnEscape", "pTooltip", "tooltipDisabled", "tooltipOptions", "appendTo", "ptTooltip", "pTooltipPT", "pTooltipUnstyled"] }, { kind: "directive", type: i16.RouterLink, selector: "[routerLink]", inputs: ["target", "queryParams", "fragment", "queryParamsHandling", "state", "info", "relativeTo", "preserveFragment", "skipLocationChange", "replaceUrl", "routerLink"] }, { kind: "directive", type: i16$1.NgFileDropDirective, selector: "[ngFileDrop]", inputs: ["options", "uploadInput"], outputs: ["uploadOutput"] }, { kind: "directive", type: i16$1.NgFileSelectDirective, selector: "[ngFileSelect]", inputs: ["options", "uploadInput"], outputs: ["uploadOutput"] }, { kind: "pipe", type: i18.TranslocoPipe, name: "transloco" }, { kind: "pipe", type: i19.DateFormatPipe, name: "dateFormat" }, { kind: "pipe", type: i19.SinceAgoPipe, name: "sinceAgo" }, { kind: "pipe", type: i19.IfNameNullShowEmailPipe, name: "ifNameNullShowEmail" }] }); }
804
838
  }
805
839
  __decorate([
806
840
  ValidateForm('form'),
@@ -808,10 +842,10 @@ __decorate([
808
842
  __metadata("design:paramtypes", []),
809
843
  __metadata("design:returntype", void 0)
810
844
  ], EnterpriseMembersComponent.prototype, "onSignUpMember", null);
811
- i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.19", ngImport: i0, type: EnterpriseMembersComponent, decorators: [{
845
+ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.6", ngImport: i0, type: EnterpriseMembersComponent, decorators: [{
812
846
  type: Component,
813
- args: [{ selector: 'pw-enterprise-members', standalone: false, template: "<section>\n <div class=\"row\">\n <div class=\"col-12 mb-3\">\n <div class=\"title\">\n <a *ngIf=\"isAddEnabled\"\n aria-label=\"Navigate to Target\"\n (click)=\"back()\"\n class=\"previous\"><i class=\"fa fa-arrow-alt-circle-left\" aria-hidden=\"true\"></i></a>\n <h2>Enterprise Members for {{ productName }}</h2>\n </div>\n <p *ngIf=\"!isAddEnabled\">\n You'll find in this section all the members of your subscription. Based on your role\n in the enterprise, you'll be able to see, add, edit or remove access to them.\n </p>\n <p *ngIf=\"isAddEnabled\">Here you can add members to your subscriptions</p>\n </div>\n </div>\n</section>\n<section id=\"enrolled\"\n *ngIf=\"!isAddEnabled\">\n <div class=\"row\">\n <div class=\"col-12 text-end\"\n *ngIf=\"hasAccess\">\n <button class=\"btn btn-sm btn-outline-primary\"\n *ngIf=\"!isAddEnabled\"\n (click)=\"isAddEnabled = true\">\n <i class=\"fa fa-plus-circle\" aria-hidden=\"true\"></i> Add Members\n </button>\n </div>\n </div>\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]=\"totalRecordsUnFiltered === 0\">\n <p-table #dt\n [value]=\"subscriptionMembers?.members\"\n [paginator]=\"subscriptionMembers?.members.length !== 0\"\n [totalRecords]=\"subscriptionMembers?.members.length\"\n [globalFilterFields]=\"['email', 'name']\"\n [rows]=\"PAGE_SIZE\"\n [loading]=\"loading\"\n [lazy]=\"true\"\n (onLazyLoad)=\"onLazyLoad($event)\">\n <ng-template pTemplate=\"caption\">\n <div class=\"text-end\">\n <label for=\"enterprise-members-search-contact\" class=\"visually-hidden\">Search contact</label>\n <i class=\"fa fa-search mt-2 me-2\" aria-hidden=\"true\"></i>\n <input type=\"text\"\n id=\"enterprise-members-search-contact\"\n name=\"enterprise-members-search-contact\"\n [(ngModel)]=\"searchText\"\n pInputText\n size=\"50\"\n placeholder=\"Search contact...\"\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\">{{ 'Label.Email' | transloco }}</th>\n <th scope=\"true\">{{ 'Enterprise.Members.Team' | transloco }}</th>\n <th scope=\"true\">{{ 'Enterprise.Members.LastSeen' | transloco }}</th>\n <th scope=\"true\">{{ 'Label.Actions' | transloco }}</th>\n </tr>\n </ng-template>\n <ng-template pTemplate=\"body\"\n let-users>\n <tr class=\"table-row\">\n <td data-head=\"Name\">\n <span>\n <a [routerLink]=\"['/members', users.slug]\">{{\n users?.preferred_name\n ? users?.preferred_name\n : (users | ifNameNullShowEmail)\n }}\n </a>\n <span class=\"ms-2\"\n *ngIf=\"!users?.has_password\"\n [pTooltip]=\"'This user hasn\\'t joined yet'\"\n tooltipPosition=\"top\">\n <i class=\"fas fa-exclamation-triangle text-warning\"></i>\n </span>\n <span class=\"ms-2\"\n *ngIf=\"users?.enable_two_factor_authenticator\"\n [pTooltip]=\"'2FA enabled'\"\n tooltipPosition=\"top\">\n <i class=\"fa-solid fa-lock text-success\"></i>\n </span>\n <span class=\"ms-2\"\n *ngIf=\"users?.blocked\"\n [pTooltip]=\"'This user has been blocked, please contact support'\"\n tooltipPosition=\"top\">\n <i class=\"fa-solid fa-hexagon-exclamation text-danger\"></i>\n </span>\n <span class=\"badge bg-dark mx-1\" *ngIf=\"users.id === subscriptionOwner\"> Owner </span>\n <span class=\"badge bg-success mx-1 admin-badge\" *ngIf=\"subscriptionMembers.admins.includes(users.id)\"> Admin </span>\n <span class=\"badge bg-info mx-1\" *ngIf=\"users.id === user.id\"> You </span>\n </span>\n </td>\n <td data-head=\"Email\">{{ users.email }}</td>\n <td data-head=\"Team\">\n <span *ngFor=\"let groups of users.user_groups\"><a class=\"badge bg-primary text-white ms-2\"\n [routerLink]=\"[\n '/' + subscription?.slug + '/enterprise',\n 'groups',\n groups.id,\n 'members'\n ]\">{{ groups.name }}</a>\n </span>\n </td>\n <td data-head=\"Last seen\">\n <span *ngIf=\"users?.current_sign_in_at; else lastSignin\">\n <span>{{ users.current_sign_in_at | dateFormat }}</span>\n <span *ngIf=\"users.current_sign_in_at\">&nbsp;({{ users.current_sign_in_at | sinceAgo }})</span>\n </span>\n <ng-template #lastSignin>\n <span>\n <span>{{ users.last_sign_in_at | dateFormat }}</span>\n <span *ngIf=\"users.last_sign_in_at\">&nbsp;({{ users.last_sign_in_at | sinceAgo }})</span>\n </span>\n </ng-template>\n </td>\n <td data-head=\"Action\">\n <ul class=\"list-unstyled list-inline d-inline-block me-2 list-action\">\n <ng-container *ngIf=\"hasAccess && allRoles.length\">\n <li class=\"enterprise-member-table mx-2 mb-2 mb-sm-0\" *rbacAllow=\"'Pages.Alpha'\">\n <p-multiSelect [(ngModel)]=\"users.selected_roles\" [options]=\"allRoles\" (onChange)=\"onRoleChange($event, users)\"\n inputId=\"enterprise-members-roles-{{ users.id }}\"\n placeholder=\"Set roles\" [showHeader]=\"false\" appendTo=\"body\">\n </p-multiSelect>\n </li>\n </ng-container>\n <!-- Message Icon -->\n <li ngbTooltip=\"Message\"\n class=\"me-2 me-sm-3 mx-2\"\n *rbacAllow=\"chatPermission\"\n [class.invisible]=\"user && user.id === users.id\"\n [routerLink]=\"['/message']\"\n [fragment]=\"users.slug\">\n <i class=\"fa fa-comments cta1-icon\" aria-hidden=\"true\"></i>\n </li>\n <!-- Action Buttons -->\n <ng-template [ngIf]=\"hasAccess && users.id !== subscriptionOwner\"\n [ngIfElse]=\"empty\">\n <!-- Make Admin -->\n <li ngbTooltip=\"Make Admin\"\n class=\"me-2 me-sm-3 mx-2\"\n *ngIf=\"!this.subscriptionMembers.admins.includes(users.id)\">\n <i\n class=\"fa fa-user-crown fa-lg success\"\n (click)=\"makeAdmin(users, true)\"\n (keydown.enter)=\"makeAdmin(users, true)\"\n aria-hidden=\"true\"\n ></i>\n </li>\n <li></li>\n <!-- Remove Admin -->\n <li ngbTooltip=\"Remove Admin\"\n class=\"me-2 me-sm-3 mx-2\"\n *ngIf=\"this.subscriptionMembers.admins.includes(users.id)\">\n <i\n class=\"fa fa-ban warning fa-lg\"\n (keydown.enter)=\"makeAdmin(users, false)\"\n (click)=\"makeAdmin(users, false)\"\n aria-hidden=\"true\"\n ></i>\n </li>\n </ng-template>\n <ng-template #empty>\n <li class=\"mx-3\"></li>\n </ng-template>\n <ng-container *ngIf=\"hasAccess\">\n <li class=\"delete-user mx-2\"\n ngbTooltip=\"Remove user from subscription\"\n *ngIf=\"users.id !== subscriptionOwner\">\n <i\n class=\"fa fa-trash delete-icon\"\n (keydown.enter)=\"onDelete(users)\"\n (keydown.space)=\"onDelete(users)\"\n (click)=\"onDelete(users)\"\n aria-hidden=\"true\"\n ></i>\n </li>\n </ng-container>\n </ul>\n </td>\n </tr>\n </ng-template>\n </p-table>\n <span class=\"total-records-count\" *ngIf=\"subscriptionMembers?.members.length !== 0\">{{ 'Label.Total' | transloco }}: {{ subscriptionMembers?.members.length || 0 }}</span>\n </div>\n</section>\n\n<section id=\"manage-members\"\n *ngIf=\"isAddEnabled\">\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 id=\"enterprise-members-csv-upload\"\n name=\"enterprise-members-csv-upload\"\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\" [attr.for]=\"'enterprise-members-email-' + i\">\n #{{ i + 1 }}</label>\n <div class=\"col-10 col-md-4\">\n <input formControlName=\"email\"\n [id]=\"'enterprise-members-email-' + i\"\n class=\"form-control form-control-sm\"\n placeholder=\"Email\" id=\"input_email_3\" name=\"input_email_3\"/>\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)=\"isAddEnabled = false\">\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", styles: [":root{--first: rgb(23 105 225);--second: rgb(54 194 131);--third: rgb(255 171 0);--text: rgb(34 34 34);--tabs_bg: rgb(23 105 225);--tabs_sub_bg: rgb(70, 136, 236);--tabs_text: rgb(255 255 255);--titles: rgb(34 34 34);--sidebar_bg: rgb(0, 48, 63);--sidebar_text: rgb(255 255 255)}a.previous i{top:0}.pw-tab .card{min-height:auto}.enterprise-member-table{vertical-align:middle;min-width:200px;max-width:200px}.delete-user{margin-left:15px}.title{display:flex}.table-row{vertical-align:top}.admin-badge{background-color:var(--first)}td{vertical-align:middle}\n"] }]
814
- }], ctorParameters: () => [{ type: i0.Injector }, { type: i1$1.UntypedFormBuilder }, { type: i1.SubscriptionService }, { type: i1.AuthService }, { type: i3$1.AdminService }, { type: i0.ChangeDetectorRef }], propDecorators: { onSignUpMember: [] } });
847
+ args: [{ selector: 'pw-enterprise-members', standalone: false, template: "<section>\n <div class=\"row\">\n <div class=\"col-12 mb-3\">\n <div class=\"title\">\n @if (isAddEnabled) {\n <a\n aria-label=\"Navigate to Target\"\n (click)=\"back()\"\n class=\"previous\"><i class=\"fa fa-arrow-alt-circle-left\" aria-hidden=\"true\"></i></a>\n }\n <h2>Enterprise Members for {{ productName }}</h2>\n </div>\n @if (!isAddEnabled) {\n <p>\n You'll find in this section all the members of your subscription. Based on your role\n in the enterprise, you'll be able to see, add, edit or remove access to them.\n </p>\n }\n @if (isAddEnabled) {\n <p>Here you can add members to your subscriptions</p>\n }\n </div>\n </div>\n </section>\n @if (!isAddEnabled) {\n <section id=\"enrolled\"\n >\n <div class=\"row\">\n @if (hasAccess) {\n <div class=\"col-12 text-end\"\n >\n @if (!isAddEnabled) {\n <button class=\"btn btn-sm btn-outline-primary\"\n (click)=\"isAddEnabled = true\">\n <i class=\"fa fa-plus-circle\" aria-hidden=\"true\"></i> Add Members\n </button>\n }\n </div>\n }\n </div>\n @if (!isLoaded) {\n <div class=\"w-100 text-center mt-3\"\n >\n <p-progressSpinner strokeWidth=\"2\"> </p-progressSpinner>\n </div>\n }\n <div class=\"primeng-datatable-container actions-collapsed table-responsive\"\n [class.hideTable]=\"totalRecordsUnFiltered === 0\">\n <p-table #dt\n [value]=\"subscriptionMembers?.members\"\n [paginator]=\"subscriptionMembers?.members.length !== 0\"\n [totalRecords]=\"subscriptionMembers?.members.length\"\n [globalFilterFields]=\"['email', 'name']\"\n [rows]=\"PAGE_SIZE\"\n [loading]=\"loading\"\n [lazy]=\"true\"\n (onLazyLoad)=\"onLazyLoad($event)\">\n <ng-template pTemplate=\"caption\">\n <div class=\"text-end\">\n <label for=\"enterprise-members-search-contact\" class=\"visually-hidden\">Search contact</label>\n <p-iconfield iconPosition=\"left\">\n <p-inputicon><i class=\"fa fa-search\" aria-hidden=\"true\"></i></p-inputicon>\n <input type=\"text\"\n id=\"enterprise-members-search-contact\"\n name=\"enterprise-members-search-contact\"\n [(ngModel)]=\"searchText\"\n pInputText\n placeholder=\"Search contact...\"\n (input)=\"dt.filterGlobal($event.target.value, 'contains')\" />\n </p-iconfield>\n </div>\n </ng-template>\n <ng-template pTemplate=\"header\">\n <tr>\n <th scope=\"true\">{{ 'Label.Name' | transloco }}</th>\n <th scope=\"true\">{{ 'Label.Email' | transloco }}</th>\n <th scope=\"true\">{{ 'Enterprise.Members.Team' | transloco }}</th>\n <th scope=\"true\">{{ 'Label.Roles' | transloco }}</th>\n <th scope=\"true\">{{ 'Enterprise.Members.LastSeen' | transloco }}</th>\n <th scope=\"true\" class=\"actions-list-three\">{{ 'Label.Actions' | transloco }}</th>\n </tr>\n </ng-template>\n <ng-template pTemplate=\"body\"\n let-users>\n <tr class=\"table-row\">\n <td data-head=\"Name\">\n <span>\n <a [routerLink]=\"['/members', users.slug]\">{{\n users?.preferred_name\n ? users?.preferred_name\n : (users | ifNameNullShowEmail)\n }}\n </a>\n @if (!users?.has_password) {\n <span class=\"ms-2\"\n [pTooltip]=\"'This user hasn\\'t joined yet'\"\n tooltipPosition=\"top\">\n <i class=\"fas fa-exclamation-triangle text-warning\"></i>\n </span>\n }\n @if (users?.enable_two_factor_authenticator) {\n <span class=\"ms-2\"\n [pTooltip]=\"'2FA enabled'\"\n tooltipPosition=\"top\">\n <i class=\"fa-solid fa-lock text-success\"></i>\n </span>\n }\n @if (users?.blocked) {\n <span class=\"ms-2\"\n [pTooltip]=\"'This user has been blocked, please contact support'\"\n tooltipPosition=\"top\">\n <i class=\"fa-solid fa-hexagon-exclamation text-danger\"></i>\n </span>\n }\n @if (users.id === subscriptionOwner) {\n <span class=\"badge bg-dark mx-1\"> Owner </span>\n }\n @if (subscriptionMembers.admins.includes(users.id)) {\n <span class=\"badge bg-success mx-1 admin-badge\"> Admin </span>\n }\n @if (users.id === user.id) {\n <span class=\"badge bg-info mx-1\"> You </span>\n }\n </span>\n </td>\n <td data-head=\"Email\">{{ users.email }}</td>\n <td data-head=\"Team\">\n @for (groups of users.user_groups; track groups) {\n <span><a class=\"badge bg-primary text-white ms-2\"\n [routerLink]=\"[\n '/' + subscription?.slug + '/enterprise',\n 'groups',\n groups.id,\n 'members'\n ]\">{{ groups.name }}</a>\n </span>\n }\n </td>\n <td data-head=\"Roles\">\n @if (hasAccess && allRoles.length) {\n <div *rbacAllow=\"'Pages.Alpha'\">\n <p-multiSelect [(ngModel)]=\"users.selected_roles\" [options]=\"allRoles\" (onChange)=\"onRoleChange($event, users)\"\n inputId=\"enterprise-members-roles-{{ users.id }}\"\n placeholder=\"Set roles\" [showHeader]=\"false\" appendTo=\"body\">\n </p-multiSelect>\n </div>\n }\n </td>\n <td data-head=\"Last seen\">\n @if (users?.current_sign_in_at) {\n <span>\n <span>{{ users.current_sign_in_at | dateFormat }}</span>\n @if (users.current_sign_in_at) {\n <span>&nbsp;({{ users.current_sign_in_at | sinceAgo }})</span>\n }\n </span>\n } @else {\n <span>\n <span>{{ users.last_sign_in_at | dateFormat }}</span>\n @if (users.last_sign_in_at) {\n <span>&nbsp;({{ users.last_sign_in_at | sinceAgo }})</span>\n }\n </span>\n }\n </td>\n <td data-head=\"Action\">\n <ul class=\"list-unstyled list-inline\">\n <!-- Message Icon -->\n <li ngbTooltip=\"Message\"\n class=\"me-2 me-sm-3 mx-2\"\n *rbacAllow=\"chatPermission\"\n [class.invisible]=\"user && user.id === users.id\"\n [routerLink]=\"['/message']\"\n [fragment]=\"users.slug\">\n <i class=\"fa fa-comments cta1-icon\" aria-hidden=\"true\"></i>\n </li>\n <!-- Action Buttons -->\n @if (hasAccess && users.id !== subscriptionOwner) {\n <!-- Make Admin -->\n @if (!this.subscriptionMembers.admins.includes(users.id)) {\n <li ngbTooltip=\"Make Admin\"\n class=\"me-2 me-sm-3 mx-2\"\n >\n <i\n class=\"fa fa-user-crown fa-lg success\"\n (click)=\"makeAdmin(users, true)\"\n (keydown.enter)=\"makeAdmin(users, true)\"\n aria-hidden=\"true\"\n ></i>\n </li>\n }\n <li></li>\n <!-- Remove Admin -->\n @if (this.subscriptionMembers.admins.includes(users.id)) {\n <li ngbTooltip=\"Remove Admin\"\n class=\"me-2 me-sm-3 mx-2\"\n >\n <i\n class=\"fa fa-ban warning fa-lg\"\n (keydown.enter)=\"makeAdmin(users, false)\"\n (click)=\"makeAdmin(users, false)\"\n aria-hidden=\"true\"\n ></i>\n </li>\n }\n } @else {\n <li class=\"mx-3\"></li>\n }\n @if (hasAccess) {\n @if (users.id !== subscriptionOwner) {\n <li class=\"delete-user mx-2\"\n ngbTooltip=\"Remove user from subscription\"\n >\n <i\n class=\"fa fa-trash delete-icon\"\n (keydown.enter)=\"onDelete(users)\"\n (keydown.space)=\"onDelete(users)\"\n (click)=\"onDelete(users)\"\n aria-hidden=\"true\"\n ></i>\n </li>\n }\n }\n </ul>\n </td>\n </tr>\n </ng-template>\n </p-table>\n @if (subscriptionMembers?.members.length !== 0) {\n <pw-records-summary [showing]=\"dt?.value?.length ?? 0\" [total]=\"subscriptionMembers?.members.length || 0\" />\n }\n </div>\n </section>\n}\n\n@if (isAddEnabled) {\n <section id=\"manage-members\"\n >\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 id=\"enterprise-members-csv-upload\"\n name=\"enterprise-members-csv-upload\"\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 @for (f of files; track f; let i = $index) {\n <div class=\"upload-item\"\n >\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 @if (f.progress?.data?.percentage !== 100) {\n <span>Uploading...</span>\n }\n @if (f.progress?.data?.percentage === 100) {\n <span>Done</span>\n }\n </span>\n @if (\n f.progress?.data?.percentage !== 0 &&\n f.progress?.data?.percentage !== 100\n ) {\n <span class=\"speed-and-eta-text\"\n >\n <span>{{ f.progress?.data?.speedHuman }} </span>\n <span>ETA {{ f.progress?.data?.etaHuman }}</span>\n </span>\n }\n </div>\n </div>\n </div>\n }\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 @for (\n item of form.get('emailsFormArray')['controls']; track\n item; let i = $index; let last = $last) {\n <div formArrayName=\"emailsFormArray\"\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\" [attr.for]=\"'enterprise-members-email-' + i\">\n #{{ i + 1 }}</label>\n <div class=\"col-10 col-md-4\">\n <input formControlName=\"email\"\n [id]=\"'enterprise-members-email-' + i\"\n class=\"form-control form-control-sm\"\n placeholder=\"Email\" id=\"input_email_3\" name=\"input_email_3\"/>\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 @if (last && emailsFormArray?.controls?.length < availableUnits) {\n <i\n class=\"btn btn-sm btn-primary fal fa-plus ms-2\"\n title=\"Add More\"\n (click)=\"addItem()\"\n (keydown.enter)=\"addItem()\"\n aria-hidden=\"true\"\n ></i>\n }\n </div>\n </div>\n </div>\n </div>\n }\n <div class=\"text-center mt-2\">\n <button class=\"btn btn-sm btn-outline-default me-2\"\n (click)=\"isAddEnabled = false\">\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}\n", styles: ["@charset \"UTF-8\";:root{--first: rgb(23 105 225);--second: rgb(54 194 131);--third: rgb(255 171 0);--text: rgb(34 34 34);--tabs_bg: rgb(23 105 225);--tabs_sub_bg: rgb(70, 136, 236);--tabs_text: rgb(255 255 255);--titles: rgb(34 34 34);--sidebar_bg: rgb(0, 48, 63);--sidebar_text: rgb(255 255 255)}a.previous i{top:0}.pw-tab .card{min-height:auto}td[data-head=Roles]{vertical-align:middle;min-width:200px;max-width:220px}td[data-head=Roles] p-multiselect{width:100%}.title{display:flex}.table-row{vertical-align:top}.admin-badge{background-color:var(--first)}td{vertical-align:middle}\n"] }]
848
+ }], ctorParameters: () => [{ type: i0.Injector }, { type: i1$1.UntypedFormBuilder }, { type: i1.SubscriptionService }, { type: i1.AuthService }, { type: i3$2.AdminService }, { type: i0.ChangeDetectorRef }], propDecorators: { onSignUpMember: [] } });
815
849
 
816
850
  class EnterprisePartnersComponent extends AppBaseComponent {
817
851
  constructor(injector, formBuilder, subscriptionService, authService, adminService, productService, cdr) {
@@ -853,18 +887,17 @@ class EnterprisePartnersComponent extends AppBaseComponent {
853
887
  this.id = this.userSubscription?.id;
854
888
  this.getSubscriptionDetails();
855
889
  }
890
+ this.cdr.markForCheck();
856
891
  });
857
892
  this.userStore().subscribe(user => {
858
893
  if (user) {
859
894
  this.user = user;
860
895
  }
896
+ this.cdr.markForCheck();
861
897
  });
862
898
  this.chatPermission = `${PermissionService.selectedProduct?.permission}.${PermissionService.selectedProduct?.feature_key}.Chat`;
863
899
  this.getProductsList();
864
900
  }
865
- ngAfterViewChecked() {
866
- this.cdr.detectChanges();
867
- }
868
901
  addItem() {
869
902
  this.emailsFormArray = this.form.get('emailsFormArray');
870
903
  if (this.emailsFormArray.valid &&
@@ -900,6 +933,7 @@ class EnterprisePartnersComponent extends AppBaseComponent {
900
933
  this.totalRecords = response.object_count;
901
934
  this.isLoaded = true;
902
935
  this.loading = false;
936
+ this.cdr.markForCheck();
903
937
  });
904
938
  }
905
939
  getSubscriptionDetails() {
@@ -907,11 +941,13 @@ class EnterprisePartnersComponent extends AppBaseComponent {
907
941
  this.productName = resp.products[0].name;
908
942
  this.subscription = resp;
909
943
  this.availableUnits = resp.products[0].purchased_units - resp.units_in_use;
944
+ this.cdr.markForCheck();
910
945
  });
911
946
  }
912
947
  getSupportedCurrency() {
913
948
  this.productService.getSupportedCurrency().subscribe(res => {
914
949
  this.currency = res?.regions;
950
+ this.cdr.markForCheck();
915
951
  });
916
952
  }
917
953
  onSave() {
@@ -946,9 +982,11 @@ class EnterprisePartnersComponent extends AppBaseComponent {
946
982
  else {
947
983
  this.toast.error(response.error.message);
948
984
  }
985
+ this.cdr.markForCheck();
949
986
  })
950
987
  .add(() => {
951
988
  this.buttonBusy = false;
989
+ this.cdr.markForCheck();
952
990
  });
953
991
  }
954
992
  }
@@ -973,6 +1011,7 @@ class EnterprisePartnersComponent extends AppBaseComponent {
973
1011
  else {
974
1012
  this.toast.success(response.error.message);
975
1013
  }
1014
+ this.cdr.markForCheck();
976
1015
  });
977
1016
  }
978
1017
  });
@@ -1003,6 +1042,7 @@ class EnterprisePartnersComponent extends AppBaseComponent {
1003
1042
  else {
1004
1043
  this.toast.success(response.error.message);
1005
1044
  }
1045
+ this.cdr.markForCheck();
1006
1046
  });
1007
1047
  }
1008
1048
  });
@@ -1016,6 +1056,7 @@ class EnterprisePartnersComponent extends AppBaseComponent {
1016
1056
  label: element ?? ''
1017
1057
  };
1018
1058
  });
1059
+ this.cdr.markForCheck();
1019
1060
  });
1020
1061
  }
1021
1062
  sortObj(obj) {
@@ -1031,6 +1072,7 @@ class EnterprisePartnersComponent extends AppBaseComponent {
1031
1072
  .getProductList({ search: event.query }, this.id)
1032
1073
  .subscribe(response => {
1033
1074
  this.filteredProducts = this.groupProducts(response.products);
1075
+ this.cdr.markForCheck();
1034
1076
  });
1035
1077
  }
1036
1078
  onProductChange(event) {
@@ -1068,21 +1110,22 @@ class EnterprisePartnersComponent extends AppBaseComponent {
1068
1110
  }
1069
1111
  return [];
1070
1112
  }
1071
- static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.19", ngImport: i0, type: EnterprisePartnersComponent, deps: [{ token: i0.Injector }, { token: i1$1.UntypedFormBuilder }, { token: i1.SubscriptionService }, { token: i1.AuthService }, { token: i3$1.AdminService }, { token: i1.ProductService }, { token: i0.ChangeDetectorRef }], target: i0.ɵɵFactoryTarget.Component }); }
1072
- static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.2.19", type: EnterprisePartnersComponent, isStandalone: false, selector: "pw-enterprise-partners", viewQueries: [{ propertyName: "refProduct", first: true, predicate: ["refProduct"], descendants: true }], usesInheritance: true, ngImport: i0, template: "<section>\n <div class=\"row\">\n <div class=\"col-12 mb-3\">\n <div class=\"title\">\n <a *ngIf=\"isAddEnabled\"\n aria-label=\"Navigate to Target\"\n (click)=\"isAddEnabled = false;\"\n class=\"previous\"><i class=\"fa fa-arrow-alt-circle-left\" aria-hidden=\"true\"></i></a>\n <h2 [ngClass]=\"{ 'mt-2': isAddEnabled }\">Enterprise Partners for {{ productName }}</h2>\n </div>\n <p *ngIf=\"!isAddEnabled\">\n You'll find in this section all the partners of your subscription. Based on your role\n in the enterprise, you'll be able to see, add, edit or remove access to them.\n </p>\n <p *ngIf=\"isAddEnabled\">Here you can add partners to your subscriptions</p>\n </div>\n </div>\n</section>\n<section *ngIf=\"!isAddEnabled\">\n\n <div class=\"row\">\n <div class=\"col-12 text-end mb-3\">\n <button class=\"btn btn-sm btn-outline-primary\"\n *ngIf=\"!isAddEnabled\"\n (click)=\"isAddEnabled = true\">\n <i class=\"fa fa-plus-circle\" aria-hidden=\"true\"></i> Add Partners\n </button>\n </div>\n </div>\n\n<div class=\"w-100 text-center mt-3\" *ngIf=\"!isLoaded\">\n <p-progressSpinner strokeWidth=\"2\"> </p-progressSpinner>\n</div>\n\n\n<div class=\"row faqlist primeng-datatable-container mt-0\" [class.custom-disable-wrapper]=\"buttonBusy\" [class.hideTable]=\"totalRecordsUnFiltered === 0\">\n <div class=\"col-12 px-0\">\n <p-table #dt\n [value]=\"subscriptionPartners\"\n [paginator]=\"totalRecords !== 0\"\n [lazy]=\"true\"\n [rows]=\"PAGE_SIZE\"\n [totalRecords]=\"totalRecords\"\n [filterDelay]=\"1000\"\n (onLazyLoad)=\"onLazyLoad($event)\"\n [customSort]=\"true\">\n <ng-template pTemplate=\"caption\">\n <div class=\"text-end\">\n <label for=\"enterprise-partners-search\" class=\"visually-hidden\">Search partner</label>\n <i class=\"fa fa-search mt-2 me-2\" aria-hidden=\"true\"></i>\n <input type=\"text\"\n id=\"enterprise-partners-search\"\n name=\"enterprise-partners-search\"\n [(ngModel)]=\"searchText\"\n pInputText\n size=\"50\"\n placeholder=\"Search partner...\"\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\">{{ 'Label.Email' | transloco }}</th>\n <th scope=\"true\">{{ 'Relationship' | transloco }}</th>\n <th scope=\"true\">{{ 'Sessions' | transloco }}</th>\n <th scope=\"true\">{{ 'Label.Actions' | transloco }}</th>\n </tr>\n </ng-template>\n <ng-template pTemplate=\"body\"\n let-partner>\n <tr class=\"table-row\">\n <td data-head=\"Name\">\n {{partner.organisation}}\n </td>\n <td data-head=\"Email\">{{ partner.contact_email }}</td>\n <td data-head=\"Relationship\">\n {{partner.relationship_to_partner}}\n </td>\n <td>\n <span>{{ partner.sessions_last_month }}</span>\n </td>\n <td data-head=\"Action\">\n <ul class=\"list-unstyled list-inline list-action\">\n <li ngbTooltip=\"Click to remove this partner\" class=\"me-2 me-sm-2\">\n <i class=\"fa fa-trash delete-icon\" (keydown.enter)=\"onDelete(partner)\"\n (keydown.space)=\"onDelete(partner)\"\n (click)=\"onDelete(partner)\" aria-hidden=\"true\"></i>\n </li>\n <li [ngClass]=\"{'me-2 me-sm-2': true, }\"\n [ngbTooltip]=\"partner.is_active ? 'Deactivate this partner' : 'Activate this partner'\"\n (keydown.enter)=\"onDeactivate(partner)\"\n (click)=\"onDeactivate(partner)\">\n <i class=\"fa fa-power-off deactivate-icon\"\n [ngClass]=\"{'text-success': partner.is_active, 'text-danger': !partner.is_active}\"\n aria-hidden=\"true\"></i>\n </li>\n </ul>\n </td>\n </tr>\n </ng-template>\n </p-table>\n <div *ngIf=\"totalRecords === 0 && totalRecordsUnFiltered !== 0\">\n <pw-no-data [withImage]=\"true\" [message]=\"'Search.NoDataMessage' | transloco\" [description]=\"'Search.NoDataDescription' | transloco\" >\n </pw-no-data>\n </div>\n <span *ngIf=\"totalRecords !== 0\" class=\"total-records-count\">{{ 'Label.Total' | transloco }}: {{ totalRecords }}</span>\n </div>\n</div>\n\n<pw-no-data [withImage]=\"true\" [message]=\"'Enterprise.Partner.NoDataMessage' | transloco\" *ngIf=\"totalRecordsUnFiltered === 0 && isLoaded\">\n</pw-no-data>\n</section>\n\n<section id=\"manage-members\"\n *ngIf=\"isAddEnabled\">\n <div class=\"mt-4\"\n *ngIf=\"!isGroupEdit\">\n <form [formGroup]=\"form\"\n (ngSubmit)=\"onSave()\">\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\" [attr.for]=\"'enterprise-partners-email-' + i\">\n #{{ i + 1 }}</label>\n <div class=\"col-10 col-md-4\">\n <input formControlName=\"email\"\n [id]=\"'enterprise-partners-email-' + i\"\n class=\"form-control form-control-sm\"\n placeholder=\"Email\" id=\"input_email_2\" name=\"input_email_2\"/>\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=\"mb-3 col-12 col-md-4 mx-sm-auto\">\n <pw-input-container [label]=\"'Label.Product' | transloco\"\n [showTooltip]=\"true\"\n [tooltipText]=\"'Admin.Subscriptions.Tooltip.SubscriptionProduct' | transloco\"\n name=\"product_id\" controlId=\"enterprise-partners-product_id\" [useAriaLabelledbyOnly]=\"true\"\n [errorMsg]=\"'Admin.Subscriptions.Validation.Product' | transloco\">\n <p-autoComplete #refProduct\n [attr.aria-labelledby]=\"'enterprise-partners-product_id-label'\"\n [suggestions]=\"filteredProducts\"\n formControlName=\"product_id\"\n dataKey=\"id\"\n field=\"label\"\n [dropdown]=\"true\"\n [delay]=\"1000\"\n [type]=\"'search'\"\n (completeMethod)=\"searchProduct($event)\"\n (onSelect)=\"onProductChange($event)\"\n (onClear)=\"onProductClear($event)\"\n styleClass=\"w-100\"\n placeholder=\"Search Product\"\n [inputStyle]=\"\n form.get('product_id').touched && form.get('product_id').invalid\n ? { border: '1px solid #ff586b' }\n : { border: '1px solid gray' }\n \"\n [multiple]=\"false\">\n </p-autoComplete>\n </pw-input-container>\n </div>\n <div class=\"text-center mt-4\">\n <input type=\"button\"\n class=\"btn btn-outline-primary me-3\"\n value=\"Cancel\"\n (click)=\"form.reset(); totalRecordsUnFiltered = 0; isAddEnabled = false;\" />\n <button type=\"submit\"\n [buttonBusy]=\"buttonBusy\"\n [disabled]=\"buttonBusy\"\n class=\"btn btn-primary\">Submit</button>\n </div>\n </form>\n</div>\n</section>\n", styles: [":root{--first: rgb(23 105 225);--second: rgb(54 194 131);--third: rgb(255 171 0);--text: rgb(34 34 34);--tabs_bg: rgb(23 105 225);--tabs_sub_bg: rgb(70, 136, 236);--tabs_text: rgb(255 255 255);--titles: rgb(34 34 34);--sidebar_bg: rgb(0, 48, 63);--sidebar_text: rgb(255 255 255)}a.previous i{top:0}.pw-tab .card{min-height:auto}.enterprise-member-table{vertical-align:middle;min-width:200px}.delete-user{margin-left:15px}.title{display:flex}.table-row{vertical-align:top}.admin-badge{background-color:var(--first)}.col-product{width:61%}\n"], dependencies: [{ kind: "directive", type: i2$1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i2$1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i2$1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i5.InputText, selector: "[pInputText]", inputs: ["variant", "fluid", "pSize"] }, { kind: "directive", type: i4.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: i1$1.ɵNgNoValidate, selector: "form:not([ngNoForm]):not([ngNativeValidate])" }, { kind: "directive", type: i1$1.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: i1$1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1$1.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { kind: "directive", type: i1$1.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "directive", type: i7$1.PrimeTemplate, selector: "[pTemplate]", inputs: ["type", "pTemplate"] }, { kind: "directive", type: i1$1.FormGroupDirective, selector: "[formGroup]", inputs: ["formGroup"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { kind: "directive", type: i1$1.FormControlName, selector: "[formControlName]", inputs: ["formControlName", "disabled", "ngModel"], outputs: ["ngModelChange"] }, { kind: "directive", type: i1$1.FormGroupName, selector: "[formGroupName]", inputs: ["formGroupName"] }, { kind: "directive", type: i1$1.FormArrayName, selector: "[formArrayName]", inputs: ["formArrayName"] }, { kind: "directive", type: i8.ButtonBusyDirective, selector: "[buttonBusy]", inputs: ["buttonBusy", "busyText"] }, { kind: "component", type: i9$1.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", "size", "showGridlines", "stripedRows", "groupRowsByOrder", "responsiveLayout", "breakpoint", "paginatorLocale", "value", "columns", "first", "rows", "totalRecords", "sortField", "sortOrder", "multiSortMeta", "selection", "virtualRowHeight", "selectAll"], outputs: ["contextMenuSelectionChange", "selectAllChange", "selectionChange", "onRowSelect", "onRowUnselect", "onPage", "onSort", "onFilter", "onLazyLoad", "onRowExpand", "onRowCollapse", "onContextMenuSelect", "onColResize", "onColReorder", "onRowReorder", "onEditInit", "onEditComplete", "onEditCancel", "onHeaderCheckboxToggle", "sortFunction", "firstChange", "rowsChange", "onStateSave", "onStateRestore"] }, { kind: "component", type: i12.ProgressSpinner, selector: "p-progressSpinner, p-progress-spinner, p-progressspinner", inputs: ["styleClass", "style", "strokeWidth", "fill", "animationDuration", "ariaLabel"] }, { kind: "component", type: i11.AutoComplete, selector: "p-autoComplete, p-autocomplete, p-auto-complete", 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", "typeahead", "variant", "fluid"], outputs: ["completeMethod", "onSelect", "onUnselect", "onFocus", "onBlur", "onDropdownClick", "onClear", "onKeyUp", "onShow", "onHide", "onLazyLoad"] }, { kind: "component", type: i13.InputContainerComponent, selector: "pw-input-container", inputs: ["name", "controlId", "useAriaLabelledbyOnly", "label", "labelClass", "tooltipPosition", "required", "errorMsg", "isReadOnly", "showTooltip", "tooltipText", "showTriangle", "afterLabel", "showAfterLabel", "showTriangleText", "isLeftTooltip"] }, { kind: "component", type: i13.NoDataComponent, selector: "pw-no-data", inputs: ["message", "description", "withImage"] }, { kind: "pipe", type: i16.TranslocoPipe, name: "transloco" }] }); }
1113
+ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.6", ngImport: i0, type: EnterprisePartnersComponent, deps: [{ token: i0.Injector }, { token: i1$1.UntypedFormBuilder }, { token: i1.SubscriptionService }, { token: i1.AuthService }, { token: i3$2.AdminService }, { token: i1.ProductService }, { token: i0.ChangeDetectorRef }], target: i0.ɵɵFactoryTarget.Component }); }
1114
+ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.6", type: EnterprisePartnersComponent, isStandalone: false, selector: "pw-enterprise-partners", viewQueries: [{ propertyName: "refProduct", first: true, predicate: ["refProduct"], descendants: true }], usesInheritance: true, ngImport: i0, template: "<section>\n <div class=\"row\">\n <div class=\"col-12 mb-3\">\n <div class=\"title\">\n @if (isAddEnabled) {\n <a\n aria-label=\"Navigate to Target\"\n (click)=\"isAddEnabled = false;\"\n class=\"previous\"><i class=\"fa fa-arrow-alt-circle-left\" aria-hidden=\"true\"></i></a>\n }\n <h2 [ngClass]=\"{ 'mt-2': isAddEnabled }\">Enterprise Partners for {{ productName }}</h2>\n </div>\n @if (!isAddEnabled) {\n <p>\n You'll find in this section all the partners of your subscription. Based on your role\n in the enterprise, you'll be able to see, add, edit or remove access to them.\n </p>\n }\n @if (isAddEnabled) {\n <p>Here you can add partners to your subscriptions</p>\n }\n </div>\n </div>\n </section>\n @if (!isAddEnabled) {\n <section>\n <div class=\"row\">\n <div class=\"col-12 text-end mb-3\">\n @if (!isAddEnabled) {\n <button class=\"btn btn-sm btn-outline-primary\"\n (click)=\"isAddEnabled = true\">\n <i class=\"fa fa-plus-circle\" aria-hidden=\"true\"></i> Add Partners\n </button>\n }\n </div>\n </div>\n @if (!isLoaded) {\n <div class=\"w-100 text-center mt-3\">\n <p-progressSpinner strokeWidth=\"2\"> </p-progressSpinner>\n </div>\n }\n <div class=\"row faqlist primeng-datatable-container actions-collapsed mt-0\" [class.custom-disable-wrapper]=\"buttonBusy\" [class.hideTable]=\"totalRecordsUnFiltered === 0\">\n <div class=\"col-12 px-0\">\n <p-table #dt\n [value]=\"subscriptionPartners\"\n [paginator]=\"totalRecords !== 0\"\n [lazy]=\"true\"\n [rows]=\"PAGE_SIZE\"\n [totalRecords]=\"totalRecords\"\n [filterDelay]=\"1000\"\n (onLazyLoad)=\"onLazyLoad($event)\"\n [customSort]=\"true\">\n <ng-template pTemplate=\"caption\">\n <div class=\"text-end\">\n <label for=\"enterprise-partners-search\" class=\"visually-hidden\">Search partner</label>\n <p-iconfield iconPosition=\"left\">\n <p-inputicon><i class=\"fa fa-search\" aria-hidden=\"true\"></i></p-inputicon>\n <input type=\"text\"\n id=\"enterprise-partners-search\"\n name=\"enterprise-partners-search\"\n [(ngModel)]=\"searchText\"\n pInputText\n placeholder=\"Search partner...\"\n (input)=\"dt.filterGlobal($event.target.value, 'contains')\" />\n </p-iconfield>\n </div>\n </ng-template>\n <ng-template pTemplate=\"header\">\n <tr>\n <th scope=\"true\">{{ 'Label.Name' | transloco }}</th>\n <th scope=\"true\">{{ 'Label.Email' | transloco }}</th>\n <th scope=\"true\">{{ 'Relationship' | transloco }}</th>\n <th scope=\"true\">{{ 'Sessions' | transloco }}</th>\n <th scope=\"true\">{{ 'Label.Actions' | transloco }}</th>\n </tr>\n </ng-template>\n <ng-template pTemplate=\"body\"\n let-partner>\n <tr class=\"table-row\">\n <td data-head=\"Name\">\n {{partner.organisation}}\n </td>\n <td data-head=\"Email\">{{ partner.contact_email }}</td>\n <td data-head=\"Relationship\">\n {{partner.relationship_to_partner}}\n </td>\n <td>\n <span>{{ partner.sessions_last_month }}</span>\n </td>\n <td data-head=\"Action\">\n <ul class=\"list-unstyled list-inline list-action\">\n <li ngbTooltip=\"Click to remove this partner\" class=\"me-2 me-sm-2\">\n <i class=\"fa fa-trash delete-icon\" (keydown.enter)=\"onDelete(partner)\"\n (keydown.space)=\"onDelete(partner)\"\n (click)=\"onDelete(partner)\" aria-hidden=\"true\"></i>\n </li>\n <li [ngClass]=\"{'me-2 me-sm-2': true, }\"\n [ngbTooltip]=\"partner.is_active ? 'Deactivate this partner' : 'Activate this partner'\"\n (keydown.enter)=\"onDeactivate(partner)\"\n (click)=\"onDeactivate(partner)\">\n <i class=\"fa fa-power-off deactivate-icon\"\n [ngClass]=\"{'text-success': partner.is_active, 'text-danger': !partner.is_active}\"\n aria-hidden=\"true\"></i>\n </li>\n </ul>\n </td>\n </tr>\n </ng-template>\n </p-table>\n @if (totalRecords === 0 && totalRecordsUnFiltered !== 0) {\n <div>\n <pw-no-data [withImage]=\"true\" [message]=\"'Search.NoDataMessage' | transloco\" [description]=\"'Search.NoDataDescription' | transloco\" >\n </pw-no-data>\n </div>\n }\n @if (totalRecords !== 0) {\n <pw-records-summary [showing]=\"dt?.value?.length ?? 0\" [total]=\"totalRecords\" />\n }\n </div>\n </div>\n @if (totalRecordsUnFiltered === 0 && isLoaded) {\n <pw-no-data [withImage]=\"true\" [message]=\"'Enterprise.Partner.NoDataMessage' | transloco\">\n </pw-no-data>\n }\n </section>\n }\n\n @if (isAddEnabled) {\n <section id=\"manage-members\"\n >\n @if (!isGroupEdit) {\n <div class=\"mt-4\"\n >\n <form [formGroup]=\"form\"\n (ngSubmit)=\"onSave()\">\n @for (\n item of form.get('emailsFormArray')['controls']; track\n item; let i = $index; let last = $last) {\n <div formArrayName=\"emailsFormArray\"\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\" [attr.for]=\"'enterprise-partners-email-' + i\">\n #{{ i + 1 }}</label>\n <div class=\"col-10 col-md-4\">\n <input formControlName=\"email\"\n [id]=\"'enterprise-partners-email-' + i\"\n class=\"form-control form-control-sm\"\n placeholder=\"Email\" id=\"input_email_2\" name=\"input_email_2\"/>\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 @if (last && emailsFormArray?.controls?.length < availableUnits) {\n <i\n class=\"btn btn-sm btn-primary fal fa-plus ms-2\"\n title=\"Add More\"\n (click)=\"addItem()\"\n (keydown.enter)=\"addItem()\"\n aria-hidden=\"true\"\n ></i>\n }\n </div>\n </div>\n </div>\n </div>\n }\n <div class=\"mb-3 col-12 col-md-4 mx-sm-auto\">\n <pw-input-container [label]=\"'Label.Product' | transloco\"\n [showTooltip]=\"true\"\n [tooltipText]=\"'Admin.Subscriptions.Tooltip.SubscriptionProduct' | transloco\"\n name=\"product_id\" controlId=\"enterprise-partners-product_id\" [useAriaLabelledbyOnly]=\"true\"\n [errorMsg]=\"'Admin.Subscriptions.Validation.Product' | transloco\">\n <p-autoComplete #refProduct\n [attr.aria-labelledby]=\"'enterprise-partners-product_id-label'\"\n [suggestions]=\"filteredProducts\"\n formControlName=\"product_id\"\n dataKey=\"id\"\n optionLabel=\"label\"\n [dropdown]=\"true\"\n [delay]=\"1000\"\n [type]=\"'search'\"\n (completeMethod)=\"searchProduct($event)\"\n (onSelect)=\"onProductChange($event)\"\n (onClear)=\"onProductClear($event)\"\n styleClass=\"w-100\"\n placeholder=\"Search Product\"\n [inputStyle]=\"\n form.get('product_id').touched && form.get('product_id').invalid\n ? { border: '1px solid #ff586b' }\n : { border: '1px solid gray' }\n \"\n [multiple]=\"false\">\n </p-autoComplete>\n </pw-input-container>\n </div>\n <div class=\"text-center mt-4\">\n <input type=\"button\"\n class=\"btn btn-outline-primary me-3\"\n value=\"Cancel\"\n (click)=\"form.reset(); totalRecordsUnFiltered = 0; isAddEnabled = false;\" />\n <button type=\"submit\"\n [buttonBusy]=\"buttonBusy\"\n [disabled]=\"buttonBusy\"\n class=\"btn btn-primary\">Submit</button>\n </div>\n </form>\n </div>\n }\n </section>\n }\n", styles: ["@charset \"UTF-8\";:root{--first: rgb(23 105 225);--second: rgb(54 194 131);--third: rgb(255 171 0);--text: rgb(34 34 34);--tabs_bg: rgb(23 105 225);--tabs_sub_bg: rgb(70, 136, 236);--tabs_text: rgb(255 255 255);--titles: rgb(34 34 34);--sidebar_bg: rgb(0, 48, 63);--sidebar_text: rgb(255 255 255)}a.previous i{top:0}.pw-tab .card{min-height:auto}.enterprise-member-table{vertical-align:middle;min-width:200px}.delete-user{margin-left:15px}.title{display:flex}.table-row{vertical-align:top}.admin-badge{background-color:var(--first)}.col-product{width:61%}\n"], dependencies: [{ kind: "directive", type: i3.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i3$1.InputText, selector: "[pInputText]", inputs: ["hostName", "ptInputText", "pInputTextPT", "pInputTextUnstyled", "pSize", "variant", "fluid", "invalid"] }, { kind: "component", type: i4.IconField, selector: "p-iconfield, p-iconField, p-icon-field", inputs: ["hostName", "iconPosition", "styleClass"] }, { kind: "component", type: i5.InputIcon, selector: "p-inputicon, p-inputIcon", inputs: ["hostName", "styleClass"] }, { kind: "directive", type: i6.PrimeTemplate, selector: "[pTemplate]", inputs: ["type", "pTemplate"] }, { kind: "directive", type: i7.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: i1$1.ɵNgNoValidate, selector: "form:not([ngNoForm]):not([ngNativeValidate])" }, { kind: "directive", type: i1$1.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: i1$1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1$1.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],[formArray],form:not([ngNoForm]),[ngForm]" }, { kind: "directive", type: i1$1.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "directive", type: i1$1.FormGroupDirective, selector: "[formGroup]", inputs: ["formGroup"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { kind: "directive", type: i1$1.FormControlName, selector: "[formControlName]", inputs: ["formControlName", "disabled", "ngModel"], outputs: ["ngModelChange"] }, { kind: "directive", type: i1$1.FormGroupName, selector: "[formGroupName]", inputs: ["formGroupName"] }, { kind: "directive", type: i1$1.FormArrayName, selector: "[formArrayName]", inputs: ["formArrayName"] }, { kind: "directive", type: i9.ButtonBusyDirective, selector: "[buttonBusy]", inputs: ["buttonBusy", "busyText"] }, { kind: "component", type: i13.Table, selector: "p-table", inputs: ["frozenColumns", "frozenValue", "styleClass", "tableStyle", "tableStyleClass", "paginator", "pageLinks", "rowsPerPageOptions", "alwaysShowPaginator", "paginatorPosition", "paginatorStyleClass", "paginatorDropdownAppendTo", "paginatorDropdownScrollHeight", "currentPageReportTemplate", "showCurrentPageReport", "showJumpToPageDropdown", "showJumpToPageInput", "showFirstLastIcon", "showPageLinks", "defaultSortOrder", "sortMode", "resetPageOnSort", "selectionMode", "selectionPageOnly", "contextMenuSelection", "contextMenuSelectionMode", "dataKey", "metaKeySelection", "rowSelectable", "rowTrackBy", "lazy", "lazyLoadOnInit", "compareSelectionBy", "csvSeparator", "exportFilename", "filters", "globalFilterFields", "filterDelay", "filterLocale", "expandedRowKeys", "editingRowKeys", "rowExpandMode", "scrollable", "rowGroupMode", "scrollHeight", "virtualScroll", "virtualScrollItemSize", "virtualScrollOptions", "virtualScrollDelay", "frozenWidth", "contextMenu", "resizableColumns", "columnResizeMode", "reorderableColumns", "loading", "loadingIcon", "showLoader", "rowHover", "customSort", "showInitialSortBadge", "exportFunction", "exportHeader", "stateKey", "stateStorage", "editMode", "groupRowsBy", "size", "showGridlines", "stripedRows", "groupRowsByOrder", "responsiveLayout", "breakpoint", "paginatorLocale", "value", "columns", "first", "rows", "totalRecords", "sortField", "sortOrder", "multiSortMeta", "selection", "selectAll"], outputs: ["contextMenuSelectionChange", "selectAllChange", "selectionChange", "onRowSelect", "onRowUnselect", "onPage", "onSort", "onFilter", "onLazyLoad", "onRowExpand", "onRowCollapse", "onContextMenuSelect", "onColResize", "onColReorder", "onRowReorder", "onEditInit", "onEditComplete", "onEditCancel", "onHeaderCheckboxToggle", "sortFunction", "firstChange", "rowsChange", "onStateSave", "onStateRestore"] }, { kind: "component", type: i12.ProgressSpinner, selector: "p-progressSpinner, p-progress-spinner, p-progressspinner", inputs: ["styleClass", "strokeWidth", "fill", "animationDuration", "ariaLabel"] }, { kind: "component", type: i13$1.AutoComplete, selector: "p-autoComplete, p-autocomplete, p-auto-complete", inputs: ["minLength", "minQueryLength", "delay", "panelStyle", "styleClass", "panelStyleClass", "inputStyle", "inputId", "inputStyleClass", "placeholder", "readonly", "scrollHeight", "lazy", "virtualScroll", "virtualScrollItemSize", "virtualScrollOptions", "autoHighlight", "forceSelection", "type", "autoZIndex", "baseZIndex", "ariaLabel", "dropdownAriaLabel", "ariaLabelledBy", "dropdownIcon", "unique", "group", "completeOnFocus", "showClear", "dropdown", "showEmptyMessage", "dropdownMode", "multiple", "addOnTab", "tabindex", "dataKey", "emptyMessage", "showTransitionOptions", "hideTransitionOptions", "autofocus", "autocomplete", "optionGroupChildren", "optionGroupLabel", "overlayOptions", "suggestions", "optionLabel", "optionValue", "id", "searchMessage", "emptySelectionMessage", "selectionMessage", "autoOptionFocus", "selectOnFocus", "searchLocale", "optionDisabled", "focusOnHover", "typeahead", "addOnBlur", "separator", "appendTo", "motionOptions"], outputs: ["completeMethod", "onSelect", "onUnselect", "onAdd", "onFocus", "onBlur", "onDropdownClick", "onClear", "onInputKeydown", "onKeyUp", "onShow", "onHide", "onLazyLoad"] }, { kind: "component", type: i15.InputContainerComponent, selector: "pw-input-container", inputs: ["name", "controlId", "useAriaLabelledbyOnly", "label", "labelClass", "tooltipPosition", "required", "errorMsg", "isReadOnly", "showTooltip", "tooltipText", "showTriangle", "afterLabel", "showAfterLabel", "showTriangleText", "isLeftTooltip"] }, { kind: "component", type: i15.NoDataComponent, selector: "pw-no-data", inputs: ["message", "description", "withImage"] }, { kind: "component", type: i15.RecordsSummaryComponent, selector: "pw-records-summary", inputs: ["showing", "total"] }, { kind: "pipe", type: i18.TranslocoPipe, name: "transloco" }] }); }
1073
1115
  }
1074
- i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.19", ngImport: i0, type: EnterprisePartnersComponent, decorators: [{
1116
+ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.6", ngImport: i0, type: EnterprisePartnersComponent, decorators: [{
1075
1117
  type: Component,
1076
- args: [{ selector: 'pw-enterprise-partners', standalone: false, template: "<section>\n <div class=\"row\">\n <div class=\"col-12 mb-3\">\n <div class=\"title\">\n <a *ngIf=\"isAddEnabled\"\n aria-label=\"Navigate to Target\"\n (click)=\"isAddEnabled = false;\"\n class=\"previous\"><i class=\"fa fa-arrow-alt-circle-left\" aria-hidden=\"true\"></i></a>\n <h2 [ngClass]=\"{ 'mt-2': isAddEnabled }\">Enterprise Partners for {{ productName }}</h2>\n </div>\n <p *ngIf=\"!isAddEnabled\">\n You'll find in this section all the partners of your subscription. Based on your role\n in the enterprise, you'll be able to see, add, edit or remove access to them.\n </p>\n <p *ngIf=\"isAddEnabled\">Here you can add partners to your subscriptions</p>\n </div>\n </div>\n</section>\n<section *ngIf=\"!isAddEnabled\">\n\n <div class=\"row\">\n <div class=\"col-12 text-end mb-3\">\n <button class=\"btn btn-sm btn-outline-primary\"\n *ngIf=\"!isAddEnabled\"\n (click)=\"isAddEnabled = true\">\n <i class=\"fa fa-plus-circle\" aria-hidden=\"true\"></i> Add Partners\n </button>\n </div>\n </div>\n\n<div class=\"w-100 text-center mt-3\" *ngIf=\"!isLoaded\">\n <p-progressSpinner strokeWidth=\"2\"> </p-progressSpinner>\n</div>\n\n\n<div class=\"row faqlist primeng-datatable-container mt-0\" [class.custom-disable-wrapper]=\"buttonBusy\" [class.hideTable]=\"totalRecordsUnFiltered === 0\">\n <div class=\"col-12 px-0\">\n <p-table #dt\n [value]=\"subscriptionPartners\"\n [paginator]=\"totalRecords !== 0\"\n [lazy]=\"true\"\n [rows]=\"PAGE_SIZE\"\n [totalRecords]=\"totalRecords\"\n [filterDelay]=\"1000\"\n (onLazyLoad)=\"onLazyLoad($event)\"\n [customSort]=\"true\">\n <ng-template pTemplate=\"caption\">\n <div class=\"text-end\">\n <label for=\"enterprise-partners-search\" class=\"visually-hidden\">Search partner</label>\n <i class=\"fa fa-search mt-2 me-2\" aria-hidden=\"true\"></i>\n <input type=\"text\"\n id=\"enterprise-partners-search\"\n name=\"enterprise-partners-search\"\n [(ngModel)]=\"searchText\"\n pInputText\n size=\"50\"\n placeholder=\"Search partner...\"\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\">{{ 'Label.Email' | transloco }}</th>\n <th scope=\"true\">{{ 'Relationship' | transloco }}</th>\n <th scope=\"true\">{{ 'Sessions' | transloco }}</th>\n <th scope=\"true\">{{ 'Label.Actions' | transloco }}</th>\n </tr>\n </ng-template>\n <ng-template pTemplate=\"body\"\n let-partner>\n <tr class=\"table-row\">\n <td data-head=\"Name\">\n {{partner.organisation}}\n </td>\n <td data-head=\"Email\">{{ partner.contact_email }}</td>\n <td data-head=\"Relationship\">\n {{partner.relationship_to_partner}}\n </td>\n <td>\n <span>{{ partner.sessions_last_month }}</span>\n </td>\n <td data-head=\"Action\">\n <ul class=\"list-unstyled list-inline list-action\">\n <li ngbTooltip=\"Click to remove this partner\" class=\"me-2 me-sm-2\">\n <i class=\"fa fa-trash delete-icon\" (keydown.enter)=\"onDelete(partner)\"\n (keydown.space)=\"onDelete(partner)\"\n (click)=\"onDelete(partner)\" aria-hidden=\"true\"></i>\n </li>\n <li [ngClass]=\"{'me-2 me-sm-2': true, }\"\n [ngbTooltip]=\"partner.is_active ? 'Deactivate this partner' : 'Activate this partner'\"\n (keydown.enter)=\"onDeactivate(partner)\"\n (click)=\"onDeactivate(partner)\">\n <i class=\"fa fa-power-off deactivate-icon\"\n [ngClass]=\"{'text-success': partner.is_active, 'text-danger': !partner.is_active}\"\n aria-hidden=\"true\"></i>\n </li>\n </ul>\n </td>\n </tr>\n </ng-template>\n </p-table>\n <div *ngIf=\"totalRecords === 0 && totalRecordsUnFiltered !== 0\">\n <pw-no-data [withImage]=\"true\" [message]=\"'Search.NoDataMessage' | transloco\" [description]=\"'Search.NoDataDescription' | transloco\" >\n </pw-no-data>\n </div>\n <span *ngIf=\"totalRecords !== 0\" class=\"total-records-count\">{{ 'Label.Total' | transloco }}: {{ totalRecords }}</span>\n </div>\n</div>\n\n<pw-no-data [withImage]=\"true\" [message]=\"'Enterprise.Partner.NoDataMessage' | transloco\" *ngIf=\"totalRecordsUnFiltered === 0 && isLoaded\">\n</pw-no-data>\n</section>\n\n<section id=\"manage-members\"\n *ngIf=\"isAddEnabled\">\n <div class=\"mt-4\"\n *ngIf=\"!isGroupEdit\">\n <form [formGroup]=\"form\"\n (ngSubmit)=\"onSave()\">\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\" [attr.for]=\"'enterprise-partners-email-' + i\">\n #{{ i + 1 }}</label>\n <div class=\"col-10 col-md-4\">\n <input formControlName=\"email\"\n [id]=\"'enterprise-partners-email-' + i\"\n class=\"form-control form-control-sm\"\n placeholder=\"Email\" id=\"input_email_2\" name=\"input_email_2\"/>\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=\"mb-3 col-12 col-md-4 mx-sm-auto\">\n <pw-input-container [label]=\"'Label.Product' | transloco\"\n [showTooltip]=\"true\"\n [tooltipText]=\"'Admin.Subscriptions.Tooltip.SubscriptionProduct' | transloco\"\n name=\"product_id\" controlId=\"enterprise-partners-product_id\" [useAriaLabelledbyOnly]=\"true\"\n [errorMsg]=\"'Admin.Subscriptions.Validation.Product' | transloco\">\n <p-autoComplete #refProduct\n [attr.aria-labelledby]=\"'enterprise-partners-product_id-label'\"\n [suggestions]=\"filteredProducts\"\n formControlName=\"product_id\"\n dataKey=\"id\"\n field=\"label\"\n [dropdown]=\"true\"\n [delay]=\"1000\"\n [type]=\"'search'\"\n (completeMethod)=\"searchProduct($event)\"\n (onSelect)=\"onProductChange($event)\"\n (onClear)=\"onProductClear($event)\"\n styleClass=\"w-100\"\n placeholder=\"Search Product\"\n [inputStyle]=\"\n form.get('product_id').touched && form.get('product_id').invalid\n ? { border: '1px solid #ff586b' }\n : { border: '1px solid gray' }\n \"\n [multiple]=\"false\">\n </p-autoComplete>\n </pw-input-container>\n </div>\n <div class=\"text-center mt-4\">\n <input type=\"button\"\n class=\"btn btn-outline-primary me-3\"\n value=\"Cancel\"\n (click)=\"form.reset(); totalRecordsUnFiltered = 0; isAddEnabled = false;\" />\n <button type=\"submit\"\n [buttonBusy]=\"buttonBusy\"\n [disabled]=\"buttonBusy\"\n class=\"btn btn-primary\">Submit</button>\n </div>\n </form>\n</div>\n</section>\n", styles: [":root{--first: rgb(23 105 225);--second: rgb(54 194 131);--third: rgb(255 171 0);--text: rgb(34 34 34);--tabs_bg: rgb(23 105 225);--tabs_sub_bg: rgb(70, 136, 236);--tabs_text: rgb(255 255 255);--titles: rgb(34 34 34);--sidebar_bg: rgb(0, 48, 63);--sidebar_text: rgb(255 255 255)}a.previous i{top:0}.pw-tab .card{min-height:auto}.enterprise-member-table{vertical-align:middle;min-width:200px}.delete-user{margin-left:15px}.title{display:flex}.table-row{vertical-align:top}.admin-badge{background-color:var(--first)}.col-product{width:61%}\n"] }]
1077
- }], ctorParameters: () => [{ type: i0.Injector }, { type: i1$1.UntypedFormBuilder }, { type: i1.SubscriptionService }, { type: i1.AuthService }, { type: i3$1.AdminService }, { type: i1.ProductService }, { type: i0.ChangeDetectorRef }], propDecorators: { refProduct: [{
1118
+ args: [{ selector: 'pw-enterprise-partners', standalone: false, template: "<section>\n <div class=\"row\">\n <div class=\"col-12 mb-3\">\n <div class=\"title\">\n @if (isAddEnabled) {\n <a\n aria-label=\"Navigate to Target\"\n (click)=\"isAddEnabled = false;\"\n class=\"previous\"><i class=\"fa fa-arrow-alt-circle-left\" aria-hidden=\"true\"></i></a>\n }\n <h2 [ngClass]=\"{ 'mt-2': isAddEnabled }\">Enterprise Partners for {{ productName }}</h2>\n </div>\n @if (!isAddEnabled) {\n <p>\n You'll find in this section all the partners of your subscription. Based on your role\n in the enterprise, you'll be able to see, add, edit or remove access to them.\n </p>\n }\n @if (isAddEnabled) {\n <p>Here you can add partners to your subscriptions</p>\n }\n </div>\n </div>\n </section>\n @if (!isAddEnabled) {\n <section>\n <div class=\"row\">\n <div class=\"col-12 text-end mb-3\">\n @if (!isAddEnabled) {\n <button class=\"btn btn-sm btn-outline-primary\"\n (click)=\"isAddEnabled = true\">\n <i class=\"fa fa-plus-circle\" aria-hidden=\"true\"></i> Add Partners\n </button>\n }\n </div>\n </div>\n @if (!isLoaded) {\n <div class=\"w-100 text-center mt-3\">\n <p-progressSpinner strokeWidth=\"2\"> </p-progressSpinner>\n </div>\n }\n <div class=\"row faqlist primeng-datatable-container actions-collapsed mt-0\" [class.custom-disable-wrapper]=\"buttonBusy\" [class.hideTable]=\"totalRecordsUnFiltered === 0\">\n <div class=\"col-12 px-0\">\n <p-table #dt\n [value]=\"subscriptionPartners\"\n [paginator]=\"totalRecords !== 0\"\n [lazy]=\"true\"\n [rows]=\"PAGE_SIZE\"\n [totalRecords]=\"totalRecords\"\n [filterDelay]=\"1000\"\n (onLazyLoad)=\"onLazyLoad($event)\"\n [customSort]=\"true\">\n <ng-template pTemplate=\"caption\">\n <div class=\"text-end\">\n <label for=\"enterprise-partners-search\" class=\"visually-hidden\">Search partner</label>\n <p-iconfield iconPosition=\"left\">\n <p-inputicon><i class=\"fa fa-search\" aria-hidden=\"true\"></i></p-inputicon>\n <input type=\"text\"\n id=\"enterprise-partners-search\"\n name=\"enterprise-partners-search\"\n [(ngModel)]=\"searchText\"\n pInputText\n placeholder=\"Search partner...\"\n (input)=\"dt.filterGlobal($event.target.value, 'contains')\" />\n </p-iconfield>\n </div>\n </ng-template>\n <ng-template pTemplate=\"header\">\n <tr>\n <th scope=\"true\">{{ 'Label.Name' | transloco }}</th>\n <th scope=\"true\">{{ 'Label.Email' | transloco }}</th>\n <th scope=\"true\">{{ 'Relationship' | transloco }}</th>\n <th scope=\"true\">{{ 'Sessions' | transloco }}</th>\n <th scope=\"true\">{{ 'Label.Actions' | transloco }}</th>\n </tr>\n </ng-template>\n <ng-template pTemplate=\"body\"\n let-partner>\n <tr class=\"table-row\">\n <td data-head=\"Name\">\n {{partner.organisation}}\n </td>\n <td data-head=\"Email\">{{ partner.contact_email }}</td>\n <td data-head=\"Relationship\">\n {{partner.relationship_to_partner}}\n </td>\n <td>\n <span>{{ partner.sessions_last_month }}</span>\n </td>\n <td data-head=\"Action\">\n <ul class=\"list-unstyled list-inline list-action\">\n <li ngbTooltip=\"Click to remove this partner\" class=\"me-2 me-sm-2\">\n <i class=\"fa fa-trash delete-icon\" (keydown.enter)=\"onDelete(partner)\"\n (keydown.space)=\"onDelete(partner)\"\n (click)=\"onDelete(partner)\" aria-hidden=\"true\"></i>\n </li>\n <li [ngClass]=\"{'me-2 me-sm-2': true, }\"\n [ngbTooltip]=\"partner.is_active ? 'Deactivate this partner' : 'Activate this partner'\"\n (keydown.enter)=\"onDeactivate(partner)\"\n (click)=\"onDeactivate(partner)\">\n <i class=\"fa fa-power-off deactivate-icon\"\n [ngClass]=\"{'text-success': partner.is_active, 'text-danger': !partner.is_active}\"\n aria-hidden=\"true\"></i>\n </li>\n </ul>\n </td>\n </tr>\n </ng-template>\n </p-table>\n @if (totalRecords === 0 && totalRecordsUnFiltered !== 0) {\n <div>\n <pw-no-data [withImage]=\"true\" [message]=\"'Search.NoDataMessage' | transloco\" [description]=\"'Search.NoDataDescription' | transloco\" >\n </pw-no-data>\n </div>\n }\n @if (totalRecords !== 0) {\n <pw-records-summary [showing]=\"dt?.value?.length ?? 0\" [total]=\"totalRecords\" />\n }\n </div>\n </div>\n @if (totalRecordsUnFiltered === 0 && isLoaded) {\n <pw-no-data [withImage]=\"true\" [message]=\"'Enterprise.Partner.NoDataMessage' | transloco\">\n </pw-no-data>\n }\n </section>\n }\n\n @if (isAddEnabled) {\n <section id=\"manage-members\"\n >\n @if (!isGroupEdit) {\n <div class=\"mt-4\"\n >\n <form [formGroup]=\"form\"\n (ngSubmit)=\"onSave()\">\n @for (\n item of form.get('emailsFormArray')['controls']; track\n item; let i = $index; let last = $last) {\n <div formArrayName=\"emailsFormArray\"\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\" [attr.for]=\"'enterprise-partners-email-' + i\">\n #{{ i + 1 }}</label>\n <div class=\"col-10 col-md-4\">\n <input formControlName=\"email\"\n [id]=\"'enterprise-partners-email-' + i\"\n class=\"form-control form-control-sm\"\n placeholder=\"Email\" id=\"input_email_2\" name=\"input_email_2\"/>\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 @if (last && emailsFormArray?.controls?.length < availableUnits) {\n <i\n class=\"btn btn-sm btn-primary fal fa-plus ms-2\"\n title=\"Add More\"\n (click)=\"addItem()\"\n (keydown.enter)=\"addItem()\"\n aria-hidden=\"true\"\n ></i>\n }\n </div>\n </div>\n </div>\n </div>\n }\n <div class=\"mb-3 col-12 col-md-4 mx-sm-auto\">\n <pw-input-container [label]=\"'Label.Product' | transloco\"\n [showTooltip]=\"true\"\n [tooltipText]=\"'Admin.Subscriptions.Tooltip.SubscriptionProduct' | transloco\"\n name=\"product_id\" controlId=\"enterprise-partners-product_id\" [useAriaLabelledbyOnly]=\"true\"\n [errorMsg]=\"'Admin.Subscriptions.Validation.Product' | transloco\">\n <p-autoComplete #refProduct\n [attr.aria-labelledby]=\"'enterprise-partners-product_id-label'\"\n [suggestions]=\"filteredProducts\"\n formControlName=\"product_id\"\n dataKey=\"id\"\n optionLabel=\"label\"\n [dropdown]=\"true\"\n [delay]=\"1000\"\n [type]=\"'search'\"\n (completeMethod)=\"searchProduct($event)\"\n (onSelect)=\"onProductChange($event)\"\n (onClear)=\"onProductClear($event)\"\n styleClass=\"w-100\"\n placeholder=\"Search Product\"\n [inputStyle]=\"\n form.get('product_id').touched && form.get('product_id').invalid\n ? { border: '1px solid #ff586b' }\n : { border: '1px solid gray' }\n \"\n [multiple]=\"false\">\n </p-autoComplete>\n </pw-input-container>\n </div>\n <div class=\"text-center mt-4\">\n <input type=\"button\"\n class=\"btn btn-outline-primary me-3\"\n value=\"Cancel\"\n (click)=\"form.reset(); totalRecordsUnFiltered = 0; isAddEnabled = false;\" />\n <button type=\"submit\"\n [buttonBusy]=\"buttonBusy\"\n [disabled]=\"buttonBusy\"\n class=\"btn btn-primary\">Submit</button>\n </div>\n </form>\n </div>\n }\n </section>\n }\n", styles: ["@charset \"UTF-8\";:root{--first: rgb(23 105 225);--second: rgb(54 194 131);--third: rgb(255 171 0);--text: rgb(34 34 34);--tabs_bg: rgb(23 105 225);--tabs_sub_bg: rgb(70, 136, 236);--tabs_text: rgb(255 255 255);--titles: rgb(34 34 34);--sidebar_bg: rgb(0, 48, 63);--sidebar_text: rgb(255 255 255)}a.previous i{top:0}.pw-tab .card{min-height:auto}.enterprise-member-table{vertical-align:middle;min-width:200px}.delete-user{margin-left:15px}.title{display:flex}.table-row{vertical-align:top}.admin-badge{background-color:var(--first)}.col-product{width:61%}\n"] }]
1119
+ }], ctorParameters: () => [{ type: i0.Injector }, { type: i1$1.UntypedFormBuilder }, { type: i1.SubscriptionService }, { type: i1.AuthService }, { type: i3$2.AdminService }, { type: i1.ProductService }, { type: i0.ChangeDetectorRef }], propDecorators: { refProduct: [{
1078
1120
  type: ViewChild,
1079
1121
  args: ['refProduct']
1080
1122
  }] } });
1081
1123
 
1082
1124
  class EnterpriseSubscriptionsComponent extends AppBaseComponent {
1083
- constructor(injector, data) {
1125
+ constructor(injector, data, cdr) {
1084
1126
  super(injector);
1085
1127
  this.data = data;
1128
+ this.cdr = cdr;
1086
1129
  this.subscriptions = [];
1087
1130
  this.isLoaded = true;
1088
1131
  }
@@ -1090,6 +1133,7 @@ class EnterpriseSubscriptionsComponent extends AppBaseComponent {
1090
1133
  this.getUserSubscription().subscribe(response => {
1091
1134
  this.subscription = response;
1092
1135
  this.userSlug = response?.slug;
1136
+ this.cdr.markForCheck();
1093
1137
  });
1094
1138
  this.userStore().subscribe((user) => {
1095
1139
  if (user) {
@@ -1105,18 +1149,21 @@ class EnterpriseSubscriptionsComponent extends AppBaseComponent {
1105
1149
  ]);
1106
1150
  }
1107
1151
  }
1152
+ this.cdr.markForCheck();
1108
1153
  });
1109
1154
  this.isLoaded = false;
1110
1155
  this.getEnterpriseSubscription();
1111
1156
  this.data.currentMessage.subscribe(message => {
1112
1157
  this.message = message;
1158
+ this.cdr.markForCheck();
1113
1159
  });
1114
1160
  }
1115
1161
  getEnterpriseSubscription() {
1116
1162
  const subscribe$ = this.userService.getUserInfo().pipe(switchMap(user => {
1117
1163
  return this.userService.getUserSubscriptions(user.id);
1118
1164
  }));
1119
- subscribe$.subscribe(response => {
1165
+ subscribe$
1166
+ .subscribe(response => {
1120
1167
  if (response.subscriptions.length > 0) {
1121
1168
  this.isLoaded = true;
1122
1169
  this.subscriptions = [
@@ -1127,6 +1174,9 @@ class EnterpriseSubscriptionsComponent extends AppBaseComponent {
1127
1174
  })
1128
1175
  ];
1129
1176
  }
1177
+ })
1178
+ .add(() => {
1179
+ this.cdr.markForCheck();
1130
1180
  });
1131
1181
  }
1132
1182
  nextUrl() {
@@ -1135,13 +1185,13 @@ class EnterpriseSubscriptionsComponent extends AppBaseComponent {
1135
1185
  ngOnDestroy() {
1136
1186
  super.ngOnDestroy();
1137
1187
  }
1138
- static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.19", ngImport: i0, type: EnterpriseSubscriptionsComponent, deps: [{ token: i0.Injector }, { token: i1.DataService }], target: i0.ɵɵFactoryTarget.Component }); }
1139
- static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.2.19", type: EnterpriseSubscriptionsComponent, isStandalone: false, selector: "pw-enterprise-subscriptions", usesInheritance: true, ngImport: i0, template: "<div class=\"container-fluid overflow-hidden\">\n <div class=\"row\">\n <div class=\"col-12 col-md-6 col-xl-4 my-3\"\n *ngFor=\"let item of subscriptions\">\n <div class=\"card\">\n <div class=\"card-content\">\n <div class=\"card-header\">\n <h5 class=\"mb-3\">{{ item?.product?.name }}</h5>\n <p>\n <strong class=\"d-inline-block w-50\">Organisation:</strong>\n {{ item.organisation }}\n </p>\n <p>\n <strong class=\"d-inline-block w-50\">Units Purchased:</strong>\n {{ item.purchased_units }}\n </p>\n <p>\n <strong class=\"d-inline-block w-50\">Seats In Use:</strong>\n {{ item.units_in_use }}\n </p>\n </div>\n <div class=\"card-footer px-3\">\n <div class=\"float-end px-2\">\n <a (click)=\"nextUrl()\"\n class=\"btn btn-sm btn-outline-primary\"\n [routerLink]=\"['/' + subscription?.slug + item.id, 'members']\">\n Manage</a>\n </div>\n </div>\n </div>\n </div>\n </div>\n <div class=\"col-12\">\n <pw-no-data [withImage]=\"true\" message=\"No current enterprise subscriptions.\"\n *ngIf=\"subscriptions.length === 0\">\n </pw-no-data>\n </div>\n <div class=\"w-100 text-center mt-3\"\n *ngIf=\"!isLoaded\">\n <p-progressSpinner strokeWidth=\"2\"> </p-progressSpinner>\n </div>\n </div>\n</div>\n", dependencies: [{ kind: "directive", type: i2$1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i2$1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: i12.ProgressSpinner, selector: "p-progressSpinner, p-progress-spinner, p-progressspinner", inputs: ["styleClass", "style", "strokeWidth", "fill", "animationDuration", "ariaLabel"] }, { kind: "component", type: i13.NoDataComponent, selector: "pw-no-data", inputs: ["message", "description", "withImage"] }, { kind: "directive", type: i14.RouterLink, selector: "[routerLink]", inputs: ["target", "queryParams", "fragment", "queryParamsHandling", "state", "info", "relativeTo", "preserveFragment", "skipLocationChange", "replaceUrl", "routerLink"] }] }); }
1188
+ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.6", ngImport: i0, type: EnterpriseSubscriptionsComponent, deps: [{ token: i0.Injector }, { token: i1.DataService }, { token: i0.ChangeDetectorRef }], target: i0.ɵɵFactoryTarget.Component }); }
1189
+ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.6", type: EnterpriseSubscriptionsComponent, isStandalone: false, selector: "pw-enterprise-subscriptions", usesInheritance: true, ngImport: i0, template: "<div class=\"container-fluid overflow-hidden\">\n <div class=\"row\">\n @for (item of subscriptions; track item) {\n <div class=\"col-12 col-md-6 col-xl-4 my-3\"\n >\n <div class=\"card\">\n <div class=\"card-content\">\n <div class=\"card-header\">\n <h5 class=\"mb-3\">{{ item?.product?.name }}</h5>\n <p>\n <strong class=\"d-inline-block w-50\">Organisation:</strong>\n {{ item.organisation }}\n </p>\n <p>\n <strong class=\"d-inline-block w-50\">Units Purchased:</strong>\n {{ item.purchased_units }}\n </p>\n <p>\n <strong class=\"d-inline-block w-50\">Seats In Use:</strong>\n {{ item.units_in_use }}\n </p>\n </div>\n <div class=\"card-footer px-3\">\n <div class=\"float-end px-2\">\n <a (click)=\"nextUrl()\"\n class=\"btn btn-sm btn-outline-primary\"\n [routerLink]=\"['/' + subscription?.slug + item.id, 'members']\">\n Manage</a>\n </div>\n </div>\n </div>\n </div>\n </div>\n }\n <div class=\"col-12\">\n @if (subscriptions.length === 0) {\n <pw-no-data [withImage]=\"true\" message=\"No current enterprise subscriptions.\"\n >\n </pw-no-data>\n }\n </div>\n @if (!isLoaded) {\n <div class=\"w-100 text-center mt-3\"\n >\n <p-progressSpinner strokeWidth=\"2\"> </p-progressSpinner>\n </div>\n }\n </div>\n</div>\n", dependencies: [{ kind: "component", type: i12.ProgressSpinner, selector: "p-progressSpinner, p-progress-spinner, p-progressspinner", inputs: ["styleClass", "strokeWidth", "fill", "animationDuration", "ariaLabel"] }, { kind: "component", type: i15.NoDataComponent, selector: "pw-no-data", inputs: ["message", "description", "withImage"] }, { kind: "directive", type: i16.RouterLink, selector: "[routerLink]", inputs: ["target", "queryParams", "fragment", "queryParamsHandling", "state", "info", "relativeTo", "preserveFragment", "skipLocationChange", "replaceUrl", "routerLink"] }] }); }
1140
1190
  }
1141
- i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.19", ngImport: i0, type: EnterpriseSubscriptionsComponent, decorators: [{
1191
+ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.6", ngImport: i0, type: EnterpriseSubscriptionsComponent, decorators: [{
1142
1192
  type: Component,
1143
- args: [{ selector: 'pw-enterprise-subscriptions', standalone: false, template: "<div class=\"container-fluid overflow-hidden\">\n <div class=\"row\">\n <div class=\"col-12 col-md-6 col-xl-4 my-3\"\n *ngFor=\"let item of subscriptions\">\n <div class=\"card\">\n <div class=\"card-content\">\n <div class=\"card-header\">\n <h5 class=\"mb-3\">{{ item?.product?.name }}</h5>\n <p>\n <strong class=\"d-inline-block w-50\">Organisation:</strong>\n {{ item.organisation }}\n </p>\n <p>\n <strong class=\"d-inline-block w-50\">Units Purchased:</strong>\n {{ item.purchased_units }}\n </p>\n <p>\n <strong class=\"d-inline-block w-50\">Seats In Use:</strong>\n {{ item.units_in_use }}\n </p>\n </div>\n <div class=\"card-footer px-3\">\n <div class=\"float-end px-2\">\n <a (click)=\"nextUrl()\"\n class=\"btn btn-sm btn-outline-primary\"\n [routerLink]=\"['/' + subscription?.slug + item.id, 'members']\">\n Manage</a>\n </div>\n </div>\n </div>\n </div>\n </div>\n <div class=\"col-12\">\n <pw-no-data [withImage]=\"true\" message=\"No current enterprise subscriptions.\"\n *ngIf=\"subscriptions.length === 0\">\n </pw-no-data>\n </div>\n <div class=\"w-100 text-center mt-3\"\n *ngIf=\"!isLoaded\">\n <p-progressSpinner strokeWidth=\"2\"> </p-progressSpinner>\n </div>\n </div>\n</div>\n" }]
1144
- }], ctorParameters: () => [{ type: i0.Injector }, { type: i1.DataService }] });
1193
+ args: [{ selector: 'pw-enterprise-subscriptions', standalone: false, template: "<div class=\"container-fluid overflow-hidden\">\n <div class=\"row\">\n @for (item of subscriptions; track item) {\n <div class=\"col-12 col-md-6 col-xl-4 my-3\"\n >\n <div class=\"card\">\n <div class=\"card-content\">\n <div class=\"card-header\">\n <h5 class=\"mb-3\">{{ item?.product?.name }}</h5>\n <p>\n <strong class=\"d-inline-block w-50\">Organisation:</strong>\n {{ item.organisation }}\n </p>\n <p>\n <strong class=\"d-inline-block w-50\">Units Purchased:</strong>\n {{ item.purchased_units }}\n </p>\n <p>\n <strong class=\"d-inline-block w-50\">Seats In Use:</strong>\n {{ item.units_in_use }}\n </p>\n </div>\n <div class=\"card-footer px-3\">\n <div class=\"float-end px-2\">\n <a (click)=\"nextUrl()\"\n class=\"btn btn-sm btn-outline-primary\"\n [routerLink]=\"['/' + subscription?.slug + item.id, 'members']\">\n Manage</a>\n </div>\n </div>\n </div>\n </div>\n </div>\n }\n <div class=\"col-12\">\n @if (subscriptions.length === 0) {\n <pw-no-data [withImage]=\"true\" message=\"No current enterprise subscriptions.\"\n >\n </pw-no-data>\n }\n </div>\n @if (!isLoaded) {\n <div class=\"w-100 text-center mt-3\"\n >\n <p-progressSpinner strokeWidth=\"2\"> </p-progressSpinner>\n </div>\n }\n </div>\n</div>\n" }]
1194
+ }], ctorParameters: () => [{ type: i0.Injector }, { type: i1.DataService }, { type: i0.ChangeDetectorRef }] });
1145
1195
 
1146
1196
  class EnterpriseTabsComponent extends AppBaseComponent {
1147
1197
  constructor(injector) {
@@ -1190,10 +1240,10 @@ class EnterpriseTabsComponent extends AppBaseComponent {
1190
1240
  }
1191
1241
  ];
1192
1242
  }
1193
- static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.19", ngImport: i0, type: EnterpriseTabsComponent, deps: [{ token: i0.Injector }], target: i0.ɵɵFactoryTarget.Component }); }
1194
- static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.2.19", type: EnterpriseTabsComponent, isStandalone: false, selector: "pw-enterprise-tabs", usesInheritance: true, ngImport: i0, template: "<pw-tabs [items]=\"items\"\n [withSubscription]=\"true\"></pw-tabs>\n", dependencies: [{ kind: "component", type: i13.PwTabsComponent, selector: "pw-tabs", inputs: ["items", "withSubscription"] }] }); }
1243
+ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.6", ngImport: i0, type: EnterpriseTabsComponent, deps: [{ token: i0.Injector }], target: i0.ɵɵFactoryTarget.Component }); }
1244
+ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "21.2.6", type: EnterpriseTabsComponent, isStandalone: false, selector: "pw-enterprise-tabs", usesInheritance: true, ngImport: i0, template: "<pw-tabs [items]=\"items\"\n [withSubscription]=\"true\"></pw-tabs>\n", dependencies: [{ kind: "component", type: i15.PwTabsComponent, selector: "pw-tabs", inputs: ["items", "withSubscription"] }] }); }
1195
1245
  }
1196
- i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.19", ngImport: i0, type: EnterpriseTabsComponent, decorators: [{
1246
+ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.6", ngImport: i0, type: EnterpriseTabsComponent, decorators: [{
1197
1247
  type: Component,
1198
1248
  args: [{ selector: 'pw-enterprise-tabs', standalone: false, template: "<pw-tabs [items]=\"items\"\n [withSubscription]=\"true\"></pw-tabs>\n" }]
1199
1249
  }], ctorParameters: () => [{ type: i0.Injector }] });
@@ -1234,6 +1284,7 @@ class EnterpriseWikiComponent extends AppBaseComponent {
1234
1284
  if (this.subscription?.id) {
1235
1285
  this.id = this.subscription?.id;
1236
1286
  }
1287
+ this.cdr.markForCheck();
1237
1288
  });
1238
1289
  this.groupId = Number(this.route.snapshot.queryParams['entity_id']);
1239
1290
  // eslint-disable-next-line no-restricted-globals
@@ -1242,12 +1293,10 @@ class EnterpriseWikiComponent extends AppBaseComponent {
1242
1293
  if (user) {
1243
1294
  this.user = user;
1244
1295
  }
1296
+ this.cdr.markForCheck();
1245
1297
  });
1246
1298
  this.getAllGroupDefinition();
1247
1299
  }
1248
- ngAfterViewChecked() {
1249
- this.cdr.detectChanges();
1250
- }
1251
1300
  onLazyLoad(event) {
1252
1301
  const pageDetails = HelperService.onTableLazyLoad(event);
1253
1302
  this.page = pageDetails.page;
@@ -1286,6 +1335,7 @@ class EnterpriseWikiComponent extends AppBaseComponent {
1286
1335
  ...this.allGroups
1287
1336
  ];
1288
1337
  }
1338
+ this.cdr.markForCheck();
1289
1339
  });
1290
1340
  }
1291
1341
  /** Function to get group name and to setValue to group field if we have group_id */
@@ -1308,12 +1358,17 @@ class EnterpriseWikiComponent extends AppBaseComponent {
1308
1358
  this.allCommunication = response.group_communications;
1309
1359
  this.totalRecords = response.object_count;
1310
1360
  this.totalRecordsUnFiltered = response.unfiltered_count;
1361
+ this.cdr.markForCheck();
1311
1362
  },
1312
- error: error => this.toast.showToast(error)
1363
+ error: error => {
1364
+ this.toast.showToast(error);
1365
+ this.cdr.markForCheck();
1366
+ }
1313
1367
  })
1314
1368
  .add(() => {
1315
1369
  this.isLoaded = true;
1316
1370
  this.loading = false;
1371
+ this.cdr.markForCheck();
1317
1372
  });
1318
1373
  }
1319
1374
  /** Function to filter by groups */
@@ -1364,9 +1419,11 @@ class EnterpriseWikiComponent extends AppBaseComponent {
1364
1419
  : 'Communication Added Successfully';
1365
1420
  this.toast.success(this.translation.translate(message));
1366
1421
  this.onCancel();
1422
+ this.cdr.markForCheck();
1367
1423
  })
1368
1424
  .add(() => {
1369
1425
  this.buttonBusy = false;
1426
+ this.cdr.markForCheck();
1370
1427
  });
1371
1428
  this.submitted = false;
1372
1429
  }
@@ -1381,9 +1438,11 @@ class EnterpriseWikiComponent extends AppBaseComponent {
1381
1438
  this.data = response;
1382
1439
  this.form.patchValue(response);
1383
1440
  this.filesData = response.group_communication_files;
1441
+ this.cdr.markForCheck();
1384
1442
  })
1385
1443
  .add(() => {
1386
1444
  this.isLoaded = true;
1445
+ this.cdr.markForCheck();
1387
1446
  });
1388
1447
  }
1389
1448
  /** Function to delete communications */
@@ -1403,6 +1462,7 @@ class EnterpriseWikiComponent extends AppBaseComponent {
1403
1462
  if (onSuccess) {
1404
1463
  onSuccess();
1405
1464
  }
1465
+ this.cdr.markForCheck();
1406
1466
  });
1407
1467
  }
1408
1468
  });
@@ -1476,6 +1536,7 @@ class EnterpriseWikiComponent extends AppBaseComponent {
1476
1536
  fileData.append('group_communication_id', `${id}`);
1477
1537
  this.groupService.postCommunicationFiles(fileData).subscribe(() => {
1478
1538
  this.translation.translate('Communication File Added Successfully');
1539
+ this.cdr.markForCheck();
1479
1540
  });
1480
1541
  });
1481
1542
  }
@@ -1483,8 +1544,8 @@ class EnterpriseWikiComponent extends AppBaseComponent {
1483
1544
  ngOnDestroy() {
1484
1545
  super.ngOnDestroy();
1485
1546
  }
1486
- static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.19", ngImport: i0, type: EnterpriseWikiComponent, deps: [{ token: i1.GroupService }, { token: i0.Injector }, { token: i0.ChangeDetectorRef }, { token: i0.Renderer2 }, { token: i0.ElementRef }], target: i0.ɵɵFactoryTarget.Component }); }
1487
- static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.2.19", type: EnterpriseWikiComponent, isStandalone: false, selector: "pw-enterprise-wiki", usesInheritance: true, ngImport: i0, template: "<section>\n <div class=\"row\">\n <div class=\"col-12\" [ngClass]=\"{'mb-3': !isEdit}\">\n <div class=\"title\">\n <a *ngIf=\"isEdit\"\n aria-label=\"Navigate to Target\"\n (click)=\"onCancel()\"\n (keydown.enter)=\"onCancel()\"\n class=\"previous\"><i class=\"fa fa-arrow-alt-circle-left\" aria-hidden=\"true\"></i></a>\n <h3 *ngIf=\"isEdit\" class=\"m-subheader__title m-subheader__title--separator mt-1\">\n <span>{{ !isAdd ? 'Edit' : 'Create a new' }} documentation page</span>\n </h3>\n <h2 *ngIf=\"!isEdit\" [ngClass]=\"{ 'mt-2': isEdit }\">Documentation <span *ngIf=\"groupId\">for {{ groupName }}</span></h2>\n </div>\n <p *ngIf=\"!isEdit\">\n Here you can write the documentation for your organization's members. Documentation\n pages are visible based on the teams the subscription's members are part of.\n </p>\n </div>\n </div>\n</section>\n<div class=\"w-100 text-center mt-3\"\n *ngIf=\"!isLoaded && isEdit\">\n <p-progressSpinner strokeWidth=\"2\"> </p-progressSpinner>\n</div>\n<ng-container *ngIf=\"isEdit && isLoaded\">\n <div class=\"container-fluid pw-tab overflow-hidden\">\n <div class=\"p-2 mt-1\">\n <form [formGroup]=\"form\"\n (ngSubmit)=\"onSave()\">\n <div class=\"row mb-3\">\n <div class=\"col-12 col-md-12\">\n <pw-input-container [label]=\"'Enterprise.Documentation.Title' | transloco\"\n [errorMsg]=\"'Enterprise.Documentation.Validation.Title' | transloco\"\n name=\"title\" controlId=\"enterprise-wiki-title\">\n <input type=\"text\"\n id=\"enterprise-wiki-title\"\n class=\"form-control\"\n formControlName=\"title\"\n [ngClass]=\"{ 'is-invalid': submitted && f.title.errors }\" />\n </pw-input-container>\n </div>\n\n <pw-input-container [label]=\"'Enterprise.Documentation.Body' | transloco\"\n class=\"col-12\"\n name=\"body\" controlId=\"enterprise-wiki-body\" [useAriaLabelledbyOnly]=\"true\"\n [errorMsg]=\"'Enterprise.Documentation.Validation.Body' | transloco\">\n <quill-editor [styles]=\"{ height: '220px' }\"\n [attr.aria-labelledby]=\"'enterprise-wiki-body-label'\"\n class=\"quillEditor quill-container\" [modules]=\"editorConfig\"\n formControlName=\"body\"\n [ngClass]=\"{ 'is-invalid': submitted && f.body.errors }\">\n </quill-editor>\n </pw-input-container>\n <div class=\"col-12 col-md-6\">\n <pw-input-container [showTooltip]=\"true\"\n [tooltipText]=\"'Enterprise.Tooltip.Group' | transloco\"\n [label]=\"'Enterprise.Documentation.Team' | transloco\"\n [isLeftTooltip]=\"true\"\n [errorMsg]=\"'Enterprise.Documentation.Validation.Team' | transloco\"\n name=\"group_id\" controlId=\"enterprise-wiki-group_id\" [useAriaLabelledbyOnly]=\"true\">\n <p-select\n [attr.aria-labelledby]=\"'enterprise-wiki-group_id-label'\"\n [options]=\"allGroups\"\n formControlName=\"group_id\"\n [ngClass]=\"{ 'is-invalid': submitted && f['group_id'].errors }\"\n [placeholder]=\"'Select Team'\"\n optionValue=\"id\"\n optionLabel=\"name\">\n </p-select>\n </pw-input-container>\n </div>\n\n <div class=\"col-12 col-md-2\">\n <pw-input-container [showTooltip]=\"true\"\n [tooltipText]=\"'Enterprise.Tooltip.VisibleGlobally' | transloco\"\n [label]=\"'Enterprise.Documentation.VisibleGlobally' | transloco\"\n name=\"visible_globally\" controlId=\"enterprise-wiki-visible_globally\" [useAriaLabelledbyOnly]=\"true\">\n <ui-switch class=\"d-block\"\n [attr.aria-labelledby]=\"'enterprise-wiki-visible_globally-label'\"\n formControlName=\"visible_globally\"\n (change)=\"onChange($event, 'visible_globally')\"\n name=\"visible_globally\">\n </ui-switch>\n </pw-input-container>\n </div>\n\n <div class=\"col-12 col-md-2\">\n <pw-input-container [showTooltip]=\"true\"\n [tooltipText]=\"'Enterprise.Tooltip.Published' | transloco\"\n [label]=\"'Enterprise.Documentation.Published' | transloco\"\n name=\"published\" controlId=\"enterprise-wiki-published\" [useAriaLabelledbyOnly]=\"true\">\n <ui-switch class=\"d-block\"\n [attr.aria-labelledby]=\"'enterprise-wiki-published-label'\"\n formControlName=\"published\"\n (change)=\"onChange($event, 'published')\"\n name=\"published\">\n </ui-switch>\n </pw-input-container>\n </div>\n\n <div class=\"col-12 col-md-2\">\n <pw-input-container [showTooltip]=\"true\"\n [tooltipText]=\"'Enterprise.Tooltip.Pushed' | transloco\"\n [label]=\"'Enterprise.Documentation.Pushed' | transloco\"\n name=\"pushed\" controlId=\"enterprise-wiki-pushed\" [useAriaLabelledbyOnly]=\"true\">\n <ui-switch class=\"d-block\"\n [attr.aria-labelledby]=\"'enterprise-wiki-pushed-label'\"\n formControlName=\"pushed\"\n (change)=\"onChange($event, 'pushed')\"\n name=\"pushed\">\n </ui-switch>\n </pw-input-container>\n </div>\n\n <div class=\"col-12 col-md-6\">\n <h4 class=\"mt-4\">You can add files to your documentation page here</h4>\n <div class=\"mb-3\">\n <span id=\"enterprise-wiki-file-label\" class=\"pw-label-style\">Upload File</span>\n <p-fileUpload #forms\n [attr.aria-labelledby]=\"'enterprise-wiki-file-label'\"\n name=\"myfile[]\"\n [customUpload]=\"true\"\n [showUploadButton]=\"false\"\n accept=\"\"\n [disabled]=\"uploadedFiles && uploadedFiles.length > 0\"\n (onSelect)=\"onSelect($event)\"\n (onRemove)=\"onRemove($event)\"\n (onError)=\"onUploadError($event)\">\n <ng-template pTemplate=\"content\"\n [ngIf]=\"uploadedFiles?.length\">\n <div class=\"drag-drop-text\" *ngIf=\"!filesUploaded && (!uploadedFiles || uploadedFiles.length === 0)\">\n <p>You can drag and drop your file here</p>\n </div>\n </ng-template>\n </p-fileUpload>\n </div>\n </div>\n </div>\n <div class=\"row\">\n <div class=\"col-12 text-end mt-3\">\n <button type=\"button\"\n class=\"btn btn-outline-default me-2\"\n (click)=\"onCancel()\"\n (keydown.enter)=\"onCancel()\" >\n {{ 'Button.Cancel' | transloco }}\n </button>\n <button type=\"submit\"\n [buttonBusy]=\"buttonBusy\"\n class=\"btn btn-primary\" [disabled]=\"invalidFile\">\n {{ 'Button.Submit' | transloco }}\n </button>\n </div>\n </div>\n </form>\n <div *ngIf=\"filesData?.length\"\n class=\"mt-5\">\n <h2>Files attached to this documentation page</h2>\n <div class=\"communication-files\"\n *ngFor=\"let files of filesData; let i = index\">\n <p>\n <a target=\"blank\"\n [href]=\"files.name.url\">\n {{\n files.name.url.split('?')[0].split('/')[\n files.name?.url?.split('?')[0].split('/').length - 1\n ]\n }}\n </a>\n </p>\n <p ngbTooltip=\"Delete\"\n class=\"ms-3\">\n <i\n class=\"fa fa-trash delete-icon\"\n (keydown.enter)=\"deleteCommunicationFiles(files.id, i)\"\n (keydown.space)=\"deleteCommunicationFiles(files.id, i)\"\n (click)=\"deleteCommunicationFiles(files.id, i)\"\n aria-hidden=\"true\"\n ></i>\n </p>\n </div>\n </div>\n </div>\n </div>\n</ng-container>\n<ng-container *ngIf=\"!isEdit\">\n <div class=\"row\">\n <div class=\"col-12 text-end mb-3\">\n <button class=\"btn btn-sm btn-outline-primary\"\n (click)=\"showEditForm()\">\n <i class=\"fa fa-plus-circle\" aria-hidden=\"true\"></i> {{ 'Add documentation' }}\n </button>\n </div>\n </div>\n <div class=\"w-100 text-center mt-3\"\n *ngIf=\"!isLoaded\">\n <p-progressSpinner strokeWidth=\"2\"> </p-progressSpinner>\n </div>\n\n <div class=\"primeng-datatable-container mt-0 table-responsive\"\n [class.hideTable]=\"totalRecordsUnFiltered === 0\">\n <p-table #dt\n [value]=\"allCommunication\"\n [paginator]=\"totalRecords !== 0\"\n [lazy]=\"true\"\n [rows]=\"PAGE_SIZE\"\n [totalRecords]=\"totalRecords\"\n [loading]=\"loading\"\n (onLazyLoad)=\"onLazyLoad($event)\">\n <ng-template pTemplate=\"caption\">\n <div class=\"search-contact\">\n <div class=\"col-sm-3 mb-2 mb-md-0 filter-domain-list\">\n <p-select\n [options]=\"allDocumentationGroups\"\n optionLabel=\"name\"\n optionValue=\"id\"\n [(ngModel)]=\"groupId\"\n placeholder=\"Select Documentation Team\"\n [appendTo]=\"'body'\"\n (onChange)=\"filterDomainsList()\">\n </p-select>\n </div>\n <div class=\"text-end\">\n <label for=\"enterprise-wiki-search\" class=\"visually-hidden\">Search Documentation</label>\n <i class=\"fa fa-search mt-2 me-2\" aria-hidden=\"true\"></i>\n <input type=\"text\"\n id=\"enterprise-wiki-search\"\n name=\"enterprise-wiki-search\"\n [(ngModel)]=\"searchText\"\n pInputText\n size=\"50\"\n placeholder=\"Search Documentation...\"\n class=\"mw-90\"\n (input)=\"dt.filterGlobal($event.target.value, 'contains')\" />\n </div>\n </div>\n </ng-template>\n <ng-template pTemplate=\"header\">\n <tr>\n <th scope=\"true\">{{ 'Enterprise.Documentation.Title' | transloco }}</th>\n <th scope=\"true\">{{ 'Enterprise.Documentation.Sender' | transloco }}</th>\n <th scope=\"true\">{{ 'Enterprise.Documentation.Team' | transloco }}</th>\n <th scope=\"true\">{{ 'Enterprise.Documentation.Files' | transloco }}</th>\n <th scope=\"true\">{{ 'Enterprise.Documentation.Date' | transloco }}</th>\n <th scope=\"true\">{{ 'Enterprise.Documentation.Status' | transloco }}</th>\n <th scope=\"true\"\n class=\"actions-column\">{{ 'Label.Actions' | transloco }}</th>\n </tr>\n </ng-template>\n <ng-template pTemplate=\"body\"\n let-item>\n <tr class=\"table-row\">\n <td data-head=\"Title\">\n <a [routerLink]=\"[item.id]\">{{ item.title }}</a>\n </td>\n <td data-head=\"Sender\">{{ item.author | ifNameNullShowEmail }}</td>\n <td data-head=\"Team\">{{ item.group?.name }}</td>\n <td data-head=\"Files\">\n <span *ngFor=\"let files of item.group_communication_files\">\n <a target=\"blank\"\n [href]=\"files.name.url\">\n {{\n files.name.url.split('?')[0].split('/')[\n files.name.url.split('?')[0].split('/').length - 1\n ]\n }}\n </a>\n </span>\n </td>\n <td data-head=\"Date\">{{ item.created_at | dateFormat: 'datetime' }}</td>\n <td data-head=\"Status\">\n <span *ngIf=\"item.visible_globally\"\n class=\"badge bg-warning ms-2\">{{\n 'Enterprise.Documentation.Global' | transloco\n }}</span><span *ngIf=\"item.published\"\n class=\"badge bg-info ms-2\">{{\n 'Enterprise.Documentation.Published' | transloco\n }}</span><span *ngIf=\"item.pushed\"\n class=\"badge bg-success ms-2\">{{\n 'Enterprise.Documentation.Pushed' | transloco\n }}</span>\n </td>\n <td data-head=\"Action\">\n <ul class=\"list-unstyled list-inline list-action\">\n <li ngbTooltip=\"Edit\"\n class=\"me-2 me-sm-3\">\n <i\n class=\"fa fa-edit edit-icon\"\n (click)=\"getCommunicationDetails(item.id)\"\n (keydown.enter)=\"getCommunicationDetails(item.id)\"\n aria-hidden=\"true\"\n ></i>\n </li>\n <li ngbTooltip=\"Delete\"\n class=\"me-2 me-sm-3\">\n <i\n class=\"fa fa-trash delete-icon\"\n (keydown.enter)=\"onDelete(item.id)\"\n (keydown.space)=\"onDelete(item.id)\"\n (click)=\"onDelete(item.id)\"\n aria-hidden=\"true\"\n ></i>\n </li>\n <li ngbTooltip=\"See Communication\"\n class=\"me-2 me-sm-3 see-icon\"\n [routerLink]=\"[item.id]\">\n <i class=\"fa fa-eye eye-icon \" aria-hidden=\"true\"></i>\n </li>\n </ul>\n </td>\n </tr>\n </ng-template>\n </p-table>\n <div *ngIf=\"totalRecords === 0 && totalRecordsUnFiltered !== 0 && !groupId\">\n <pw-no-data [withImage]=\"true\" [message]=\"'Search.NoDataMessage'| transloco\" [description]=\"'Search.NoDataDescription' | transloco\" >\n </pw-no-data>\n </div>\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]=\"'Enterprise.Documentation.NoDocumentation' | transloco\">\n </pw-no-data>\n </div>\n</ng-container>\n", styles: [":root{--first: rgb(23 105 225);--second: rgb(54 194 131);--third: rgb(255 171 0);--text: rgb(34 34 34);--tabs_bg: rgb(23 105 225);--tabs_sub_bg: rgb(70, 136, 236);--tabs_text: rgb(255 255 255);--titles: rgb(34 34 34);--sidebar_bg: rgb(0, 48, 63);--sidebar_text: rgb(255 255 255)}.table-row{vertical-align:top}.communication-files{display:flex!important}.search-contact{display:flex;justify-content:space-between}@media (min-width: 320px) and (max-width: 720px){.search-contact{display:block}}a.previous i{top:0}.eye-icon{color:var(--first);font-size:18px;padding-left:3px;padding-right:3px}.title{display:flex}.drag-drop-text{padding:20px;border:2px dashed #ccc;text-align:center;color:#aaa;margin-top:10px}\n"], dependencies: [{ kind: "directive", type: i2$1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i2$1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i2$1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i5.InputText, selector: "[pInputText]", inputs: ["variant", "fluid", "pSize"] }, { kind: "directive", type: i4.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: i1$1.ɵNgNoValidate, selector: "form:not([ngNoForm]):not([ngNativeValidate])" }, { kind: "directive", type: i1$1.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: i1$1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1$1.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { kind: "directive", type: i1$1.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "component", type: i6.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: i7.Select, selector: "p-select", 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", "size", "overlayOptions", "ariaFilterLabel", "ariaLabel", "ariaLabelledBy", "filterMatchMode", "maxlength", "tooltip", "tooltipPosition", "tooltipPositionStyle", "tooltipStyleClass", "focusOnHover", "selectOnFocus", "autoOptionFocus", "autofocusFilter", "fluid", "disabled", "itemSize", "autoZIndex", "baseZIndex", "showTransitionOptions", "hideTransitionOptions", "filterValue", "options"], outputs: ["onChange", "onFilter", "onFocus", "onBlur", "onClick", "onShow", "onHide", "onClear", "onLazyLoad"] }, { kind: "directive", type: i7$1.PrimeTemplate, selector: "[pTemplate]", inputs: ["type", "pTemplate"] }, { kind: "component", type: i9.FileUpload, selector: "p-fileupload, p-fileUpload", inputs: ["name", "url", "method", "multiple", "accept", "disabled", "auto", "withCredentials", "maxFileSize", "invalidFileSizeMessageSummary", "invalidFileSizeMessageDetail", "invalidFileTypeMessageSummary", "invalidFileTypeMessageDetail", "invalidFileLimitMessageDetail", "invalidFileLimitMessageSummary", "style", "styleClass", "previewWidth", "chooseLabel", "uploadLabel", "cancelLabel", "chooseIcon", "uploadIcon", "cancelIcon", "showUploadButton", "showCancelButton", "mode", "headers", "customUpload", "fileLimit", "uploadStyleClass", "cancelStyleClass", "removeStyleClass", "chooseStyleClass", "chooseButtonProps", "uploadButtonProps", "cancelButtonProps", "files"], outputs: ["onBeforeUpload", "onSend", "onUpload", "onError", "onClear", "onRemove", "onSelect", "onProgress", "uploadHandler", "onImageError", "onRemoveUploadedFile"] }, { kind: "directive", type: i1$1.FormGroupDirective, selector: "[formGroup]", inputs: ["formGroup"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { kind: "directive", type: i1$1.FormControlName, selector: "[formControlName]", inputs: ["formControlName", "disabled", "ngModel"], outputs: ["ngModelChange"] }, { kind: "directive", type: i8.ButtonBusyDirective, selector: "[buttonBusy]", inputs: ["buttonBusy", "busyText"] }, { kind: "component", type: i9$1.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", "size", "showGridlines", "stripedRows", "groupRowsByOrder", "responsiveLayout", "breakpoint", "paginatorLocale", "value", "columns", "first", "rows", "totalRecords", "sortField", "sortOrder", "multiSortMeta", "selection", "virtualRowHeight", "selectAll"], outputs: ["contextMenuSelectionChange", "selectAllChange", "selectionChange", "onRowSelect", "onRowUnselect", "onPage", "onSort", "onFilter", "onLazyLoad", "onRowExpand", "onRowCollapse", "onContextMenuSelect", "onColResize", "onColReorder", "onRowReorder", "onEditInit", "onEditComplete", "onEditCancel", "onHeaderCheckboxToggle", "sortFunction", "firstChange", "rowsChange", "onStateSave", "onStateRestore"] }, { kind: "component", type: i12.ProgressSpinner, selector: "p-progressSpinner, p-progress-spinner, p-progressspinner", inputs: ["styleClass", "style", "strokeWidth", "fill", "animationDuration", "ariaLabel"] }, { kind: "component", type: i13.InputContainerComponent, selector: "pw-input-container", inputs: ["name", "controlId", "useAriaLabelledbyOnly", "label", "labelClass", "tooltipPosition", "required", "errorMsg", "isReadOnly", "showTooltip", "tooltipText", "showTriangle", "afterLabel", "showAfterLabel", "showTriangleText", "isLeftTooltip"] }, { kind: "component", type: i13.NoDataComponent, selector: "pw-no-data", inputs: ["message", "description", "withImage"] }, { kind: "directive", type: i14.RouterLink, selector: "[routerLink]", inputs: ["target", "queryParams", "fragment", "queryParamsHandling", "state", "info", "relativeTo", "preserveFragment", "skipLocationChange", "replaceUrl", "routerLink"] }, { kind: "component", type: i15.QuillEditorComponent, selector: "quill-editor" }, { kind: "pipe", type: i16.TranslocoPipe, name: "transloco" }, { kind: "pipe", type: i17.DateFormatPipe, name: "dateFormat" }, { kind: "pipe", type: i17.IfNameNullShowEmailPipe, name: "ifNameNullShowEmail" }] }); }
1547
+ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.6", ngImport: i0, type: EnterpriseWikiComponent, deps: [{ token: i1.GroupService }, { token: i0.Injector }, { token: i0.ChangeDetectorRef }, { token: i0.Renderer2 }, { token: i0.ElementRef }], target: i0.ɵɵFactoryTarget.Component }); }
1548
+ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.6", type: EnterpriseWikiComponent, isStandalone: false, selector: "pw-enterprise-wiki", usesInheritance: true, ngImport: i0, template: "<section>\n <div class=\"row\">\n <div class=\"col-12\" [ngClass]=\"{'mb-3': !isEdit}\">\n <div class=\"title\">\n @if (isEdit) {\n <a\n aria-label=\"Navigate to Target\"\n (click)=\"onCancel()\"\n (keydown.enter)=\"onCancel()\"\n class=\"previous\"><i class=\"fa fa-arrow-alt-circle-left\" aria-hidden=\"true\"></i></a>\n }\n @if (isEdit) {\n <h3 class=\"m-subheader__title m-subheader__title--separator mt-1\">\n <span>{{ !isAdd ? 'Edit' : 'Create a new' }} documentation page</span>\n </h3>\n }\n @if (!isEdit) {\n <h2 [ngClass]=\"{ 'mt-2': isEdit }\">Documentation @if (groupId) {\n <span>for {{ groupName }}</span>\n }</h2>\n }\n </div>\n @if (!isEdit) {\n <p>\n Here you can write the documentation for your organization's members. Documentation\n pages are visible based on the teams the subscription's members are part of.\n </p>\n }\n </div>\n </div>\n </section>\n @if (!isLoaded && isEdit) {\n <div class=\"w-100 text-center mt-3\"\n >\n <p-progressSpinner strokeWidth=\"2\"> </p-progressSpinner>\n </div>\n }\n @if (isEdit && isLoaded) {\n <div class=\"container-fluid pw-tab overflow-hidden\">\n <div class=\"p-2 mt-1\">\n <form [formGroup]=\"form\"\n (ngSubmit)=\"onSave()\">\n <div class=\"row mb-3\">\n <div class=\"col-12 col-md-12\">\n <pw-input-container [label]=\"'Enterprise.Documentation.Title' | transloco\"\n [errorMsg]=\"'Enterprise.Documentation.Validation.Title' | transloco\"\n name=\"title\" controlId=\"enterprise-wiki-title\">\n <input type=\"text\"\n id=\"enterprise-wiki-title\"\n class=\"form-control\"\n formControlName=\"title\"\n [ngClass]=\"{ 'is-invalid': submitted && f.title.errors }\" />\n </pw-input-container>\n </div>\n <pw-input-container [label]=\"'Enterprise.Documentation.Body' | transloco\"\n class=\"col-12\"\n name=\"body\" controlId=\"enterprise-wiki-body\" [useAriaLabelledbyOnly]=\"true\"\n [errorMsg]=\"'Enterprise.Documentation.Validation.Body' | transloco\">\n <quill-editor [styles]=\"{ height: '220px' }\"\n [attr.aria-labelledby]=\"'enterprise-wiki-body-label'\"\n class=\"quillEditor quill-container\" [modules]=\"editorConfig\"\n formControlName=\"body\"\n [ngClass]=\"{ 'is-invalid': submitted && f.body.errors }\">\n </quill-editor>\n </pw-input-container>\n <div class=\"col-12 col-md-6\">\n <pw-input-container [showTooltip]=\"true\"\n [tooltipText]=\"'Enterprise.Tooltip.Group' | transloco\"\n [label]=\"'Enterprise.Documentation.Team' | transloco\"\n [isLeftTooltip]=\"true\"\n [errorMsg]=\"'Enterprise.Documentation.Validation.Team' | transloco\"\n name=\"group_id\" controlId=\"enterprise-wiki-group_id\" [useAriaLabelledbyOnly]=\"true\">\n <p-select\n [attr.aria-labelledby]=\"'enterprise-wiki-group_id-label'\"\n [options]=\"allGroups\"\n formControlName=\"group_id\"\n [ngClass]=\"{ 'is-invalid': submitted && f['group_id'].errors }\"\n [placeholder]=\"'Select Team'\"\n optionValue=\"id\"\n optionLabel=\"name\">\n </p-select>\n </pw-input-container>\n </div>\n <div class=\"col-12 col-md-2\">\n <pw-input-container [showTooltip]=\"true\"\n [tooltipText]=\"'Enterprise.Tooltip.VisibleGlobally' | transloco\"\n [label]=\"'Enterprise.Documentation.VisibleGlobally' | transloco\"\n name=\"visible_globally\" controlId=\"enterprise-wiki-visible_globally\" [useAriaLabelledbyOnly]=\"true\">\n <ui-switch class=\"d-block\"\n [attr.aria-labelledby]=\"'enterprise-wiki-visible_globally-label'\"\n formControlName=\"visible_globally\"\n (change)=\"onChange($event, 'visible_globally')\"\n name=\"visible_globally\">\n </ui-switch>\n </pw-input-container>\n </div>\n <div class=\"col-12 col-md-2\">\n <pw-input-container [showTooltip]=\"true\"\n [tooltipText]=\"'Enterprise.Tooltip.Published' | transloco\"\n [label]=\"'Enterprise.Documentation.Published' | transloco\"\n name=\"published\" controlId=\"enterprise-wiki-published\" [useAriaLabelledbyOnly]=\"true\">\n <ui-switch class=\"d-block\"\n [attr.aria-labelledby]=\"'enterprise-wiki-published-label'\"\n formControlName=\"published\"\n (change)=\"onChange($event, 'published')\"\n name=\"published\">\n </ui-switch>\n </pw-input-container>\n </div>\n <div class=\"col-12 col-md-2\">\n <pw-input-container [showTooltip]=\"true\"\n [tooltipText]=\"'Enterprise.Tooltip.Pushed' | transloco\"\n [label]=\"'Enterprise.Documentation.Pushed' | transloco\"\n name=\"pushed\" controlId=\"enterprise-wiki-pushed\" [useAriaLabelledbyOnly]=\"true\">\n <ui-switch class=\"d-block\"\n [attr.aria-labelledby]=\"'enterprise-wiki-pushed-label'\"\n formControlName=\"pushed\"\n (change)=\"onChange($event, 'pushed')\"\n name=\"pushed\">\n </ui-switch>\n </pw-input-container>\n </div>\n <div class=\"col-12 col-md-6\">\n <h4 class=\"mt-4\">You can add files to your documentation page here</h4>\n <div class=\"mb-3\">\n <span id=\"enterprise-wiki-file-label\" class=\"pw-label-style\">Upload File</span>\n <p-fileUpload #forms\n [attr.aria-labelledby]=\"'enterprise-wiki-file-label'\"\n name=\"myfile[]\"\n [customUpload]=\"true\"\n [showUploadButton]=\"false\"\n accept=\"\"\n [disabled]=\"uploadedFiles && uploadedFiles.length > 0\"\n (onSelect)=\"onSelect($event)\"\n (onRemove)=\"onRemove($event)\"\n (onError)=\"onUploadError($event)\">\n @if (uploadedFiles?.length) {\n <ng-template pTemplate=\"content\"\n >\n @if (!filesUploaded && (!uploadedFiles || uploadedFiles.length === 0)) {\n <div class=\"drag-drop-text\">\n <p>You can drag and drop your file here</p>\n </div>\n }\n </ng-template>\n }\n </p-fileUpload>\n </div>\n </div>\n </div>\n <div class=\"row\">\n <div class=\"col-12 text-end mt-3\">\n <button type=\"button\"\n class=\"btn btn-outline-default me-2\"\n (click)=\"onCancel()\"\n (keydown.enter)=\"onCancel()\" >\n {{ 'Button.Cancel' | transloco }}\n </button>\n <button type=\"submit\"\n [buttonBusy]=\"buttonBusy\"\n class=\"btn btn-primary\" [disabled]=\"invalidFile\">\n {{ 'Button.Submit' | transloco }}\n </button>\n </div>\n </div>\n </form>\n @if (filesData?.length) {\n <div\n class=\"mt-5\">\n <h2>Files attached to this documentation page</h2>\n @for (files of filesData; track files; let i = $index) {\n <div class=\"communication-files\"\n >\n <p>\n <a target=\"blank\"\n [href]=\"files.name.url\">\n {{\n files.name.url.split('?')[0].split('/')[\n files.name?.url?.split('?')[0].split('/').length - 1\n ]\n }}\n </a>\n </p>\n <p ngbTooltip=\"Delete\"\n class=\"ms-3\">\n <i\n class=\"fa fa-trash delete-icon\"\n (keydown.enter)=\"deleteCommunicationFiles(files.id, i)\"\n (keydown.space)=\"deleteCommunicationFiles(files.id, i)\"\n (click)=\"deleteCommunicationFiles(files.id, i)\"\n aria-hidden=\"true\"\n ></i>\n </p>\n </div>\n }\n </div>\n }\n </div>\n </div>\n }\n @if (!isEdit) {\n <div class=\"row\">\n <div class=\"col-12 text-end mb-3\">\n <button class=\"btn btn-sm btn-outline-primary\"\n (click)=\"showEditForm()\">\n <i class=\"fa fa-plus-circle\" aria-hidden=\"true\"></i> {{ 'Add documentation' }}\n </button>\n </div>\n </div>\n @if (!isLoaded) {\n <div class=\"w-100 text-center mt-3\"\n >\n <p-progressSpinner strokeWidth=\"2\"> </p-progressSpinner>\n </div>\n }\n <div class=\"primeng-datatable-container actions-collapsed mt-0 table-responsive\"\n [class.hideTable]=\"totalRecordsUnFiltered === 0\">\n <p-table #dt\n [value]=\"allCommunication\"\n [paginator]=\"totalRecords !== 0\"\n [lazy]=\"true\"\n [rows]=\"PAGE_SIZE\"\n [totalRecords]=\"totalRecords\"\n [loading]=\"loading\"\n (onLazyLoad)=\"onLazyLoad($event)\">\n <ng-template pTemplate=\"caption\">\n <div class=\"search-contact\">\n <div class=\"col-sm-3 mb-2 mb-md-0 filter-domain-list\">\n <p-select\n [options]=\"allDocumentationGroups\"\n optionLabel=\"name\"\n optionValue=\"id\"\n [(ngModel)]=\"groupId\"\n placeholder=\"Select Documentation Team\"\n [appendTo]=\"'body'\"\n (onChange)=\"filterDomainsList()\">\n </p-select>\n </div>\n <div class=\"text-end\">\n <label for=\"enterprise-wiki-search\" class=\"visually-hidden\">Search Documentation</label>\n <p-iconfield iconPosition=\"left\">\n <p-inputicon><i class=\"fa fa-search\" aria-hidden=\"true\"></i></p-inputicon>\n <input type=\"text\"\n id=\"enterprise-wiki-search\"\n name=\"enterprise-wiki-search\"\n [(ngModel)]=\"searchText\"\n pInputText\n placeholder=\"Search Documentation...\"\n (input)=\"dt.filterGlobal($event.target.value, 'contains')\" />\n </p-iconfield>\n </div>\n </div>\n </ng-template>\n <ng-template pTemplate=\"header\">\n <tr>\n <th scope=\"true\">{{ 'Enterprise.Documentation.Title' | transloco }}</th>\n <th scope=\"true\">{{ 'Enterprise.Documentation.Sender' | transloco }}</th>\n <th scope=\"true\">{{ 'Enterprise.Documentation.Team' | transloco }}</th>\n <th scope=\"true\">{{ 'Enterprise.Documentation.Files' | transloco }}</th>\n <th scope=\"true\">{{ 'Enterprise.Documentation.Date' | transloco }}</th>\n <th scope=\"true\">{{ 'Enterprise.Documentation.Status' | transloco }}</th>\n <th scope=\"true\"\n class=\"actions-column\">{{ 'Label.Actions' | transloco }}</th>\n </tr>\n </ng-template>\n <ng-template pTemplate=\"body\"\n let-item>\n <tr class=\"table-row\">\n <td data-head=\"Title\">\n <a [routerLink]=\"[item.id]\">{{ item.title }}</a>\n </td>\n <td data-head=\"Sender\">{{ item.author | ifNameNullShowEmail }}</td>\n <td data-head=\"Team\">{{ item.group?.name }}</td>\n <td data-head=\"Files\">\n @for (files of item.group_communication_files; track files) {\n <span>\n <a target=\"blank\"\n [href]=\"files.name.url\">\n {{\n files.name.url.split('?')[0].split('/')[\n files.name.url.split('?')[0].split('/').length - 1\n ]\n }}\n </a>\n </span>\n }\n </td>\n <td data-head=\"Date\">{{ item.created_at | dateFormat: 'datetime' }}</td>\n <td data-head=\"Status\">\n @if (item.visible_globally) {\n <span\n class=\"badge bg-warning ms-2\">{{\n 'Enterprise.Documentation.Global' | transloco\n }}</span>\n }@if (item.published) {\n <span\n class=\"badge bg-info ms-2\">{{\n 'Enterprise.Documentation.Published' | transloco\n }}</span>\n }@if (item.pushed) {\n <span\n class=\"badge bg-success ms-2\">{{\n 'Enterprise.Documentation.Pushed' | transloco\n }}</span>\n }\n </td>\n <td data-head=\"Action\">\n <ul class=\"list-unstyled list-inline list-action\">\n <li ngbTooltip=\"Edit\"\n class=\"me-2 me-sm-3\">\n <i\n class=\"fa fa-edit edit-icon\"\n (click)=\"getCommunicationDetails(item.id)\"\n (keydown.enter)=\"getCommunicationDetails(item.id)\"\n aria-hidden=\"true\"\n ></i>\n </li>\n <li ngbTooltip=\"Delete\"\n class=\"me-2 me-sm-3\">\n <i\n class=\"fa fa-trash delete-icon\"\n (keydown.enter)=\"onDelete(item.id)\"\n (keydown.space)=\"onDelete(item.id)\"\n (click)=\"onDelete(item.id)\"\n aria-hidden=\"true\"\n ></i>\n </li>\n <li ngbTooltip=\"See Communication\"\n class=\"me-2 me-sm-3 see-icon\"\n [routerLink]=\"[item.id]\">\n <i class=\"fa fa-eye eye-icon \" aria-hidden=\"true\"></i>\n </li>\n </ul>\n </td>\n </tr>\n </ng-template>\n </p-table>\n @if (totalRecords === 0 && totalRecordsUnFiltered !== 0 && !groupId) {\n <div>\n <pw-no-data [withImage]=\"true\" [message]=\"'Search.NoDataMessage'| transloco\" [description]=\"'Search.NoDataDescription' | transloco\" >\n </pw-no-data>\n </div>\n }\n @if (totalRecords !== 0) {\n <pw-records-summary [showing]=\"dt?.value?.length ?? 0\" [total]=\"totalRecords\" />\n }\n </div>\n @if (totalRecordsUnFiltered === 0 && isLoaded) {\n <div>\n <pw-no-data [withImage]=\"true\" [message]=\"'Enterprise.Documentation.NoDocumentation' | transloco\">\n </pw-no-data>\n </div>\n }\n }\n", styles: ["@charset \"UTF-8\";:root{--first: rgb(23 105 225);--second: rgb(54 194 131);--third: rgb(255 171 0);--text: rgb(34 34 34);--tabs_bg: rgb(23 105 225);--tabs_sub_bg: rgb(70, 136, 236);--tabs_text: rgb(255 255 255);--titles: rgb(34 34 34);--sidebar_bg: rgb(0, 48, 63);--sidebar_text: rgb(255 255 255)}.table-row{vertical-align:top}.communication-files{display:flex!important}.search-contact{display:flex;justify-content:space-between}@media(min-width:320px)and (max-width:720px){.search-contact{display:block}}a.previous i{top:0}.eye-icon{color:var(--first);font-size:18px;padding-left:3px;padding-right:3px}.title{display:flex}.drag-drop-text{padding:20px;border:2px dashed #ccc;text-align:center;color:#aaa;margin-top:10px}\n"], dependencies: [{ kind: "directive", type: i3.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i3$1.InputText, selector: "[pInputText]", inputs: ["hostName", "ptInputText", "pInputTextPT", "pInputTextUnstyled", "pSize", "variant", "fluid", "invalid"] }, { kind: "component", type: i4.IconField, selector: "p-iconfield, p-iconField, p-icon-field", inputs: ["hostName", "iconPosition", "styleClass"] }, { kind: "component", type: i5.InputIcon, selector: "p-inputicon, p-inputIcon", inputs: ["hostName", "styleClass"] }, { kind: "directive", type: i6.PrimeTemplate, selector: "[pTemplate]", inputs: ["type", "pTemplate"] }, { kind: "directive", type: i7.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: i1$1.ɵNgNoValidate, selector: "form:not([ngNoForm]):not([ngNativeValidate])" }, { kind: "directive", type: i1$1.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: i1$1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1$1.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],[formArray],form:not([ngNoForm]),[ngForm]" }, { kind: "directive", type: i1$1.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "component", type: i9$1.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: i10.Select, selector: "p-select", inputs: ["id", "scrollHeight", "filter", "panelStyle", "styleClass", "panelStyleClass", "readonly", "editable", "tabindex", "placeholder", "loadingIcon", "filterPlaceholder", "filterLocale", "inputId", "dataKey", "filterBy", "filterFields", "autofocus", "resetFilterOnHide", "checkmark", "dropdownIcon", "loading", "optionLabel", "optionValue", "optionDisabled", "optionGroupLabel", "optionGroupChildren", "group", "showClear", "emptyFilterMessage", "emptyMessage", "lazy", "virtualScroll", "virtualScrollItemSize", "virtualScrollOptions", "overlayOptions", "ariaFilterLabel", "ariaLabel", "ariaLabelledBy", "filterMatchMode", "tooltip", "tooltipPosition", "tooltipPositionStyle", "tooltipStyleClass", "focusOnHover", "selectOnFocus", "autoOptionFocus", "autofocusFilter", "filterValue", "options", "appendTo", "motionOptions"], outputs: ["onChange", "onFilter", "onFocus", "onBlur", "onClick", "onShow", "onHide", "onClear", "onLazyLoad"] }, { kind: "component", type: i11.FileUpload, selector: "p-fileupload, p-fileUpload", inputs: ["name", "url", "method", "multiple", "accept", "disabled", "auto", "withCredentials", "maxFileSize", "invalidFileSizeMessageSummary", "invalidFileSizeMessageDetail", "invalidFileTypeMessageSummary", "invalidFileTypeMessageDetail", "invalidFileLimitMessageDetail", "invalidFileLimitMessageSummary", "style", "styleClass", "previewWidth", "chooseLabel", "uploadLabel", "cancelLabel", "chooseIcon", "uploadIcon", "cancelIcon", "showUploadButton", "showCancelButton", "mode", "headers", "customUpload", "fileLimit", "uploadStyleClass", "cancelStyleClass", "removeStyleClass", "chooseStyleClass", "chooseButtonProps", "uploadButtonProps", "cancelButtonProps", "files"], outputs: ["onBeforeUpload", "onSend", "onUpload", "onError", "onClear", "onRemove", "onSelect", "onProgress", "uploadHandler", "onImageError", "onRemoveUploadedFile"] }, { kind: "directive", type: i1$1.FormGroupDirective, selector: "[formGroup]", inputs: ["formGroup"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { kind: "directive", type: i1$1.FormControlName, selector: "[formControlName]", inputs: ["formControlName", "disabled", "ngModel"], outputs: ["ngModelChange"] }, { kind: "directive", type: i9.ButtonBusyDirective, selector: "[buttonBusy]", inputs: ["buttonBusy", "busyText"] }, { kind: "component", type: i13.Table, selector: "p-table", inputs: ["frozenColumns", "frozenValue", "styleClass", "tableStyle", "tableStyleClass", "paginator", "pageLinks", "rowsPerPageOptions", "alwaysShowPaginator", "paginatorPosition", "paginatorStyleClass", "paginatorDropdownAppendTo", "paginatorDropdownScrollHeight", "currentPageReportTemplate", "showCurrentPageReport", "showJumpToPageDropdown", "showJumpToPageInput", "showFirstLastIcon", "showPageLinks", "defaultSortOrder", "sortMode", "resetPageOnSort", "selectionMode", "selectionPageOnly", "contextMenuSelection", "contextMenuSelectionMode", "dataKey", "metaKeySelection", "rowSelectable", "rowTrackBy", "lazy", "lazyLoadOnInit", "compareSelectionBy", "csvSeparator", "exportFilename", "filters", "globalFilterFields", "filterDelay", "filterLocale", "expandedRowKeys", "editingRowKeys", "rowExpandMode", "scrollable", "rowGroupMode", "scrollHeight", "virtualScroll", "virtualScrollItemSize", "virtualScrollOptions", "virtualScrollDelay", "frozenWidth", "contextMenu", "resizableColumns", "columnResizeMode", "reorderableColumns", "loading", "loadingIcon", "showLoader", "rowHover", "customSort", "showInitialSortBadge", "exportFunction", "exportHeader", "stateKey", "stateStorage", "editMode", "groupRowsBy", "size", "showGridlines", "stripedRows", "groupRowsByOrder", "responsiveLayout", "breakpoint", "paginatorLocale", "value", "columns", "first", "rows", "totalRecords", "sortField", "sortOrder", "multiSortMeta", "selection", "selectAll"], outputs: ["contextMenuSelectionChange", "selectAllChange", "selectionChange", "onRowSelect", "onRowUnselect", "onPage", "onSort", "onFilter", "onLazyLoad", "onRowExpand", "onRowCollapse", "onContextMenuSelect", "onColResize", "onColReorder", "onRowReorder", "onEditInit", "onEditComplete", "onEditCancel", "onHeaderCheckboxToggle", "sortFunction", "firstChange", "rowsChange", "onStateSave", "onStateRestore"] }, { kind: "component", type: i12.ProgressSpinner, selector: "p-progressSpinner, p-progress-spinner, p-progressspinner", inputs: ["styleClass", "strokeWidth", "fill", "animationDuration", "ariaLabel"] }, { kind: "component", type: i15.InputContainerComponent, selector: "pw-input-container", inputs: ["name", "controlId", "useAriaLabelledbyOnly", "label", "labelClass", "tooltipPosition", "required", "errorMsg", "isReadOnly", "showTooltip", "tooltipText", "showTriangle", "afterLabel", "showAfterLabel", "showTriangleText", "isLeftTooltip"] }, { kind: "component", type: i15.NoDataComponent, selector: "pw-no-data", inputs: ["message", "description", "withImage"] }, { kind: "component", type: i15.RecordsSummaryComponent, selector: "pw-records-summary", inputs: ["showing", "total"] }, { kind: "directive", type: i16.RouterLink, selector: "[routerLink]", inputs: ["target", "queryParams", "fragment", "queryParamsHandling", "state", "info", "relativeTo", "preserveFragment", "skipLocationChange", "replaceUrl", "routerLink"] }, { kind: "component", type: i17.QuillEditorComponent, selector: "quill-editor" }, { kind: "pipe", type: i18.TranslocoPipe, name: "transloco" }, { kind: "pipe", type: i19.DateFormatPipe, name: "dateFormat" }, { kind: "pipe", type: i19.IfNameNullShowEmailPipe, name: "ifNameNullShowEmail" }] }); }
1488
1549
  }
1489
1550
  __decorate([
1490
1551
  ValidateForm('form'),
@@ -1492,24 +1553,27 @@ __decorate([
1492
1553
  __metadata("design:paramtypes", []),
1493
1554
  __metadata("design:returntype", void 0)
1494
1555
  ], EnterpriseWikiComponent.prototype, "onSave", null);
1495
- i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.19", ngImport: i0, type: EnterpriseWikiComponent, decorators: [{
1556
+ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.6", ngImport: i0, type: EnterpriseWikiComponent, decorators: [{
1496
1557
  type: Component,
1497
- args: [{ selector: 'pw-enterprise-wiki', standalone: false, template: "<section>\n <div class=\"row\">\n <div class=\"col-12\" [ngClass]=\"{'mb-3': !isEdit}\">\n <div class=\"title\">\n <a *ngIf=\"isEdit\"\n aria-label=\"Navigate to Target\"\n (click)=\"onCancel()\"\n (keydown.enter)=\"onCancel()\"\n class=\"previous\"><i class=\"fa fa-arrow-alt-circle-left\" aria-hidden=\"true\"></i></a>\n <h3 *ngIf=\"isEdit\" class=\"m-subheader__title m-subheader__title--separator mt-1\">\n <span>{{ !isAdd ? 'Edit' : 'Create a new' }} documentation page</span>\n </h3>\n <h2 *ngIf=\"!isEdit\" [ngClass]=\"{ 'mt-2': isEdit }\">Documentation <span *ngIf=\"groupId\">for {{ groupName }}</span></h2>\n </div>\n <p *ngIf=\"!isEdit\">\n Here you can write the documentation for your organization's members. Documentation\n pages are visible based on the teams the subscription's members are part of.\n </p>\n </div>\n </div>\n</section>\n<div class=\"w-100 text-center mt-3\"\n *ngIf=\"!isLoaded && isEdit\">\n <p-progressSpinner strokeWidth=\"2\"> </p-progressSpinner>\n</div>\n<ng-container *ngIf=\"isEdit && isLoaded\">\n <div class=\"container-fluid pw-tab overflow-hidden\">\n <div class=\"p-2 mt-1\">\n <form [formGroup]=\"form\"\n (ngSubmit)=\"onSave()\">\n <div class=\"row mb-3\">\n <div class=\"col-12 col-md-12\">\n <pw-input-container [label]=\"'Enterprise.Documentation.Title' | transloco\"\n [errorMsg]=\"'Enterprise.Documentation.Validation.Title' | transloco\"\n name=\"title\" controlId=\"enterprise-wiki-title\">\n <input type=\"text\"\n id=\"enterprise-wiki-title\"\n class=\"form-control\"\n formControlName=\"title\"\n [ngClass]=\"{ 'is-invalid': submitted && f.title.errors }\" />\n </pw-input-container>\n </div>\n\n <pw-input-container [label]=\"'Enterprise.Documentation.Body' | transloco\"\n class=\"col-12\"\n name=\"body\" controlId=\"enterprise-wiki-body\" [useAriaLabelledbyOnly]=\"true\"\n [errorMsg]=\"'Enterprise.Documentation.Validation.Body' | transloco\">\n <quill-editor [styles]=\"{ height: '220px' }\"\n [attr.aria-labelledby]=\"'enterprise-wiki-body-label'\"\n class=\"quillEditor quill-container\" [modules]=\"editorConfig\"\n formControlName=\"body\"\n [ngClass]=\"{ 'is-invalid': submitted && f.body.errors }\">\n </quill-editor>\n </pw-input-container>\n <div class=\"col-12 col-md-6\">\n <pw-input-container [showTooltip]=\"true\"\n [tooltipText]=\"'Enterprise.Tooltip.Group' | transloco\"\n [label]=\"'Enterprise.Documentation.Team' | transloco\"\n [isLeftTooltip]=\"true\"\n [errorMsg]=\"'Enterprise.Documentation.Validation.Team' | transloco\"\n name=\"group_id\" controlId=\"enterprise-wiki-group_id\" [useAriaLabelledbyOnly]=\"true\">\n <p-select\n [attr.aria-labelledby]=\"'enterprise-wiki-group_id-label'\"\n [options]=\"allGroups\"\n formControlName=\"group_id\"\n [ngClass]=\"{ 'is-invalid': submitted && f['group_id'].errors }\"\n [placeholder]=\"'Select Team'\"\n optionValue=\"id\"\n optionLabel=\"name\">\n </p-select>\n </pw-input-container>\n </div>\n\n <div class=\"col-12 col-md-2\">\n <pw-input-container [showTooltip]=\"true\"\n [tooltipText]=\"'Enterprise.Tooltip.VisibleGlobally' | transloco\"\n [label]=\"'Enterprise.Documentation.VisibleGlobally' | transloco\"\n name=\"visible_globally\" controlId=\"enterprise-wiki-visible_globally\" [useAriaLabelledbyOnly]=\"true\">\n <ui-switch class=\"d-block\"\n [attr.aria-labelledby]=\"'enterprise-wiki-visible_globally-label'\"\n formControlName=\"visible_globally\"\n (change)=\"onChange($event, 'visible_globally')\"\n name=\"visible_globally\">\n </ui-switch>\n </pw-input-container>\n </div>\n\n <div class=\"col-12 col-md-2\">\n <pw-input-container [showTooltip]=\"true\"\n [tooltipText]=\"'Enterprise.Tooltip.Published' | transloco\"\n [label]=\"'Enterprise.Documentation.Published' | transloco\"\n name=\"published\" controlId=\"enterprise-wiki-published\" [useAriaLabelledbyOnly]=\"true\">\n <ui-switch class=\"d-block\"\n [attr.aria-labelledby]=\"'enterprise-wiki-published-label'\"\n formControlName=\"published\"\n (change)=\"onChange($event, 'published')\"\n name=\"published\">\n </ui-switch>\n </pw-input-container>\n </div>\n\n <div class=\"col-12 col-md-2\">\n <pw-input-container [showTooltip]=\"true\"\n [tooltipText]=\"'Enterprise.Tooltip.Pushed' | transloco\"\n [label]=\"'Enterprise.Documentation.Pushed' | transloco\"\n name=\"pushed\" controlId=\"enterprise-wiki-pushed\" [useAriaLabelledbyOnly]=\"true\">\n <ui-switch class=\"d-block\"\n [attr.aria-labelledby]=\"'enterprise-wiki-pushed-label'\"\n formControlName=\"pushed\"\n (change)=\"onChange($event, 'pushed')\"\n name=\"pushed\">\n </ui-switch>\n </pw-input-container>\n </div>\n\n <div class=\"col-12 col-md-6\">\n <h4 class=\"mt-4\">You can add files to your documentation page here</h4>\n <div class=\"mb-3\">\n <span id=\"enterprise-wiki-file-label\" class=\"pw-label-style\">Upload File</span>\n <p-fileUpload #forms\n [attr.aria-labelledby]=\"'enterprise-wiki-file-label'\"\n name=\"myfile[]\"\n [customUpload]=\"true\"\n [showUploadButton]=\"false\"\n accept=\"\"\n [disabled]=\"uploadedFiles && uploadedFiles.length > 0\"\n (onSelect)=\"onSelect($event)\"\n (onRemove)=\"onRemove($event)\"\n (onError)=\"onUploadError($event)\">\n <ng-template pTemplate=\"content\"\n [ngIf]=\"uploadedFiles?.length\">\n <div class=\"drag-drop-text\" *ngIf=\"!filesUploaded && (!uploadedFiles || uploadedFiles.length === 0)\">\n <p>You can drag and drop your file here</p>\n </div>\n </ng-template>\n </p-fileUpload>\n </div>\n </div>\n </div>\n <div class=\"row\">\n <div class=\"col-12 text-end mt-3\">\n <button type=\"button\"\n class=\"btn btn-outline-default me-2\"\n (click)=\"onCancel()\"\n (keydown.enter)=\"onCancel()\" >\n {{ 'Button.Cancel' | transloco }}\n </button>\n <button type=\"submit\"\n [buttonBusy]=\"buttonBusy\"\n class=\"btn btn-primary\" [disabled]=\"invalidFile\">\n {{ 'Button.Submit' | transloco }}\n </button>\n </div>\n </div>\n </form>\n <div *ngIf=\"filesData?.length\"\n class=\"mt-5\">\n <h2>Files attached to this documentation page</h2>\n <div class=\"communication-files\"\n *ngFor=\"let files of filesData; let i = index\">\n <p>\n <a target=\"blank\"\n [href]=\"files.name.url\">\n {{\n files.name.url.split('?')[0].split('/')[\n files.name?.url?.split('?')[0].split('/').length - 1\n ]\n }}\n </a>\n </p>\n <p ngbTooltip=\"Delete\"\n class=\"ms-3\">\n <i\n class=\"fa fa-trash delete-icon\"\n (keydown.enter)=\"deleteCommunicationFiles(files.id, i)\"\n (keydown.space)=\"deleteCommunicationFiles(files.id, i)\"\n (click)=\"deleteCommunicationFiles(files.id, i)\"\n aria-hidden=\"true\"\n ></i>\n </p>\n </div>\n </div>\n </div>\n </div>\n</ng-container>\n<ng-container *ngIf=\"!isEdit\">\n <div class=\"row\">\n <div class=\"col-12 text-end mb-3\">\n <button class=\"btn btn-sm btn-outline-primary\"\n (click)=\"showEditForm()\">\n <i class=\"fa fa-plus-circle\" aria-hidden=\"true\"></i> {{ 'Add documentation' }}\n </button>\n </div>\n </div>\n <div class=\"w-100 text-center mt-3\"\n *ngIf=\"!isLoaded\">\n <p-progressSpinner strokeWidth=\"2\"> </p-progressSpinner>\n </div>\n\n <div class=\"primeng-datatable-container mt-0 table-responsive\"\n [class.hideTable]=\"totalRecordsUnFiltered === 0\">\n <p-table #dt\n [value]=\"allCommunication\"\n [paginator]=\"totalRecords !== 0\"\n [lazy]=\"true\"\n [rows]=\"PAGE_SIZE\"\n [totalRecords]=\"totalRecords\"\n [loading]=\"loading\"\n (onLazyLoad)=\"onLazyLoad($event)\">\n <ng-template pTemplate=\"caption\">\n <div class=\"search-contact\">\n <div class=\"col-sm-3 mb-2 mb-md-0 filter-domain-list\">\n <p-select\n [options]=\"allDocumentationGroups\"\n optionLabel=\"name\"\n optionValue=\"id\"\n [(ngModel)]=\"groupId\"\n placeholder=\"Select Documentation Team\"\n [appendTo]=\"'body'\"\n (onChange)=\"filterDomainsList()\">\n </p-select>\n </div>\n <div class=\"text-end\">\n <label for=\"enterprise-wiki-search\" class=\"visually-hidden\">Search Documentation</label>\n <i class=\"fa fa-search mt-2 me-2\" aria-hidden=\"true\"></i>\n <input type=\"text\"\n id=\"enterprise-wiki-search\"\n name=\"enterprise-wiki-search\"\n [(ngModel)]=\"searchText\"\n pInputText\n size=\"50\"\n placeholder=\"Search Documentation...\"\n class=\"mw-90\"\n (input)=\"dt.filterGlobal($event.target.value, 'contains')\" />\n </div>\n </div>\n </ng-template>\n <ng-template pTemplate=\"header\">\n <tr>\n <th scope=\"true\">{{ 'Enterprise.Documentation.Title' | transloco }}</th>\n <th scope=\"true\">{{ 'Enterprise.Documentation.Sender' | transloco }}</th>\n <th scope=\"true\">{{ 'Enterprise.Documentation.Team' | transloco }}</th>\n <th scope=\"true\">{{ 'Enterprise.Documentation.Files' | transloco }}</th>\n <th scope=\"true\">{{ 'Enterprise.Documentation.Date' | transloco }}</th>\n <th scope=\"true\">{{ 'Enterprise.Documentation.Status' | transloco }}</th>\n <th scope=\"true\"\n class=\"actions-column\">{{ 'Label.Actions' | transloco }}</th>\n </tr>\n </ng-template>\n <ng-template pTemplate=\"body\"\n let-item>\n <tr class=\"table-row\">\n <td data-head=\"Title\">\n <a [routerLink]=\"[item.id]\">{{ item.title }}</a>\n </td>\n <td data-head=\"Sender\">{{ item.author | ifNameNullShowEmail }}</td>\n <td data-head=\"Team\">{{ item.group?.name }}</td>\n <td data-head=\"Files\">\n <span *ngFor=\"let files of item.group_communication_files\">\n <a target=\"blank\"\n [href]=\"files.name.url\">\n {{\n files.name.url.split('?')[0].split('/')[\n files.name.url.split('?')[0].split('/').length - 1\n ]\n }}\n </a>\n </span>\n </td>\n <td data-head=\"Date\">{{ item.created_at | dateFormat: 'datetime' }}</td>\n <td data-head=\"Status\">\n <span *ngIf=\"item.visible_globally\"\n class=\"badge bg-warning ms-2\">{{\n 'Enterprise.Documentation.Global' | transloco\n }}</span><span *ngIf=\"item.published\"\n class=\"badge bg-info ms-2\">{{\n 'Enterprise.Documentation.Published' | transloco\n }}</span><span *ngIf=\"item.pushed\"\n class=\"badge bg-success ms-2\">{{\n 'Enterprise.Documentation.Pushed' | transloco\n }}</span>\n </td>\n <td data-head=\"Action\">\n <ul class=\"list-unstyled list-inline list-action\">\n <li ngbTooltip=\"Edit\"\n class=\"me-2 me-sm-3\">\n <i\n class=\"fa fa-edit edit-icon\"\n (click)=\"getCommunicationDetails(item.id)\"\n (keydown.enter)=\"getCommunicationDetails(item.id)\"\n aria-hidden=\"true\"\n ></i>\n </li>\n <li ngbTooltip=\"Delete\"\n class=\"me-2 me-sm-3\">\n <i\n class=\"fa fa-trash delete-icon\"\n (keydown.enter)=\"onDelete(item.id)\"\n (keydown.space)=\"onDelete(item.id)\"\n (click)=\"onDelete(item.id)\"\n aria-hidden=\"true\"\n ></i>\n </li>\n <li ngbTooltip=\"See Communication\"\n class=\"me-2 me-sm-3 see-icon\"\n [routerLink]=\"[item.id]\">\n <i class=\"fa fa-eye eye-icon \" aria-hidden=\"true\"></i>\n </li>\n </ul>\n </td>\n </tr>\n </ng-template>\n </p-table>\n <div *ngIf=\"totalRecords === 0 && totalRecordsUnFiltered !== 0 && !groupId\">\n <pw-no-data [withImage]=\"true\" [message]=\"'Search.NoDataMessage'| transloco\" [description]=\"'Search.NoDataDescription' | transloco\" >\n </pw-no-data>\n </div>\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]=\"'Enterprise.Documentation.NoDocumentation' | transloco\">\n </pw-no-data>\n </div>\n</ng-container>\n", styles: [":root{--first: rgb(23 105 225);--second: rgb(54 194 131);--third: rgb(255 171 0);--text: rgb(34 34 34);--tabs_bg: rgb(23 105 225);--tabs_sub_bg: rgb(70, 136, 236);--tabs_text: rgb(255 255 255);--titles: rgb(34 34 34);--sidebar_bg: rgb(0, 48, 63);--sidebar_text: rgb(255 255 255)}.table-row{vertical-align:top}.communication-files{display:flex!important}.search-contact{display:flex;justify-content:space-between}@media (min-width: 320px) and (max-width: 720px){.search-contact{display:block}}a.previous i{top:0}.eye-icon{color:var(--first);font-size:18px;padding-left:3px;padding-right:3px}.title{display:flex}.drag-drop-text{padding:20px;border:2px dashed #ccc;text-align:center;color:#aaa;margin-top:10px}\n"] }]
1558
+ args: [{ selector: 'pw-enterprise-wiki', standalone: false, template: "<section>\n <div class=\"row\">\n <div class=\"col-12\" [ngClass]=\"{'mb-3': !isEdit}\">\n <div class=\"title\">\n @if (isEdit) {\n <a\n aria-label=\"Navigate to Target\"\n (click)=\"onCancel()\"\n (keydown.enter)=\"onCancel()\"\n class=\"previous\"><i class=\"fa fa-arrow-alt-circle-left\" aria-hidden=\"true\"></i></a>\n }\n @if (isEdit) {\n <h3 class=\"m-subheader__title m-subheader__title--separator mt-1\">\n <span>{{ !isAdd ? 'Edit' : 'Create a new' }} documentation page</span>\n </h3>\n }\n @if (!isEdit) {\n <h2 [ngClass]=\"{ 'mt-2': isEdit }\">Documentation @if (groupId) {\n <span>for {{ groupName }}</span>\n }</h2>\n }\n </div>\n @if (!isEdit) {\n <p>\n Here you can write the documentation for your organization's members. Documentation\n pages are visible based on the teams the subscription's members are part of.\n </p>\n }\n </div>\n </div>\n </section>\n @if (!isLoaded && isEdit) {\n <div class=\"w-100 text-center mt-3\"\n >\n <p-progressSpinner strokeWidth=\"2\"> </p-progressSpinner>\n </div>\n }\n @if (isEdit && isLoaded) {\n <div class=\"container-fluid pw-tab overflow-hidden\">\n <div class=\"p-2 mt-1\">\n <form [formGroup]=\"form\"\n (ngSubmit)=\"onSave()\">\n <div class=\"row mb-3\">\n <div class=\"col-12 col-md-12\">\n <pw-input-container [label]=\"'Enterprise.Documentation.Title' | transloco\"\n [errorMsg]=\"'Enterprise.Documentation.Validation.Title' | transloco\"\n name=\"title\" controlId=\"enterprise-wiki-title\">\n <input type=\"text\"\n id=\"enterprise-wiki-title\"\n class=\"form-control\"\n formControlName=\"title\"\n [ngClass]=\"{ 'is-invalid': submitted && f.title.errors }\" />\n </pw-input-container>\n </div>\n <pw-input-container [label]=\"'Enterprise.Documentation.Body' | transloco\"\n class=\"col-12\"\n name=\"body\" controlId=\"enterprise-wiki-body\" [useAriaLabelledbyOnly]=\"true\"\n [errorMsg]=\"'Enterprise.Documentation.Validation.Body' | transloco\">\n <quill-editor [styles]=\"{ height: '220px' }\"\n [attr.aria-labelledby]=\"'enterprise-wiki-body-label'\"\n class=\"quillEditor quill-container\" [modules]=\"editorConfig\"\n formControlName=\"body\"\n [ngClass]=\"{ 'is-invalid': submitted && f.body.errors }\">\n </quill-editor>\n </pw-input-container>\n <div class=\"col-12 col-md-6\">\n <pw-input-container [showTooltip]=\"true\"\n [tooltipText]=\"'Enterprise.Tooltip.Group' | transloco\"\n [label]=\"'Enterprise.Documentation.Team' | transloco\"\n [isLeftTooltip]=\"true\"\n [errorMsg]=\"'Enterprise.Documentation.Validation.Team' | transloco\"\n name=\"group_id\" controlId=\"enterprise-wiki-group_id\" [useAriaLabelledbyOnly]=\"true\">\n <p-select\n [attr.aria-labelledby]=\"'enterprise-wiki-group_id-label'\"\n [options]=\"allGroups\"\n formControlName=\"group_id\"\n [ngClass]=\"{ 'is-invalid': submitted && f['group_id'].errors }\"\n [placeholder]=\"'Select Team'\"\n optionValue=\"id\"\n optionLabel=\"name\">\n </p-select>\n </pw-input-container>\n </div>\n <div class=\"col-12 col-md-2\">\n <pw-input-container [showTooltip]=\"true\"\n [tooltipText]=\"'Enterprise.Tooltip.VisibleGlobally' | transloco\"\n [label]=\"'Enterprise.Documentation.VisibleGlobally' | transloco\"\n name=\"visible_globally\" controlId=\"enterprise-wiki-visible_globally\" [useAriaLabelledbyOnly]=\"true\">\n <ui-switch class=\"d-block\"\n [attr.aria-labelledby]=\"'enterprise-wiki-visible_globally-label'\"\n formControlName=\"visible_globally\"\n (change)=\"onChange($event, 'visible_globally')\"\n name=\"visible_globally\">\n </ui-switch>\n </pw-input-container>\n </div>\n <div class=\"col-12 col-md-2\">\n <pw-input-container [showTooltip]=\"true\"\n [tooltipText]=\"'Enterprise.Tooltip.Published' | transloco\"\n [label]=\"'Enterprise.Documentation.Published' | transloco\"\n name=\"published\" controlId=\"enterprise-wiki-published\" [useAriaLabelledbyOnly]=\"true\">\n <ui-switch class=\"d-block\"\n [attr.aria-labelledby]=\"'enterprise-wiki-published-label'\"\n formControlName=\"published\"\n (change)=\"onChange($event, 'published')\"\n name=\"published\">\n </ui-switch>\n </pw-input-container>\n </div>\n <div class=\"col-12 col-md-2\">\n <pw-input-container [showTooltip]=\"true\"\n [tooltipText]=\"'Enterprise.Tooltip.Pushed' | transloco\"\n [label]=\"'Enterprise.Documentation.Pushed' | transloco\"\n name=\"pushed\" controlId=\"enterprise-wiki-pushed\" [useAriaLabelledbyOnly]=\"true\">\n <ui-switch class=\"d-block\"\n [attr.aria-labelledby]=\"'enterprise-wiki-pushed-label'\"\n formControlName=\"pushed\"\n (change)=\"onChange($event, 'pushed')\"\n name=\"pushed\">\n </ui-switch>\n </pw-input-container>\n </div>\n <div class=\"col-12 col-md-6\">\n <h4 class=\"mt-4\">You can add files to your documentation page here</h4>\n <div class=\"mb-3\">\n <span id=\"enterprise-wiki-file-label\" class=\"pw-label-style\">Upload File</span>\n <p-fileUpload #forms\n [attr.aria-labelledby]=\"'enterprise-wiki-file-label'\"\n name=\"myfile[]\"\n [customUpload]=\"true\"\n [showUploadButton]=\"false\"\n accept=\"\"\n [disabled]=\"uploadedFiles && uploadedFiles.length > 0\"\n (onSelect)=\"onSelect($event)\"\n (onRemove)=\"onRemove($event)\"\n (onError)=\"onUploadError($event)\">\n @if (uploadedFiles?.length) {\n <ng-template pTemplate=\"content\"\n >\n @if (!filesUploaded && (!uploadedFiles || uploadedFiles.length === 0)) {\n <div class=\"drag-drop-text\">\n <p>You can drag and drop your file here</p>\n </div>\n }\n </ng-template>\n }\n </p-fileUpload>\n </div>\n </div>\n </div>\n <div class=\"row\">\n <div class=\"col-12 text-end mt-3\">\n <button type=\"button\"\n class=\"btn btn-outline-default me-2\"\n (click)=\"onCancel()\"\n (keydown.enter)=\"onCancel()\" >\n {{ 'Button.Cancel' | transloco }}\n </button>\n <button type=\"submit\"\n [buttonBusy]=\"buttonBusy\"\n class=\"btn btn-primary\" [disabled]=\"invalidFile\">\n {{ 'Button.Submit' | transloco }}\n </button>\n </div>\n </div>\n </form>\n @if (filesData?.length) {\n <div\n class=\"mt-5\">\n <h2>Files attached to this documentation page</h2>\n @for (files of filesData; track files; let i = $index) {\n <div class=\"communication-files\"\n >\n <p>\n <a target=\"blank\"\n [href]=\"files.name.url\">\n {{\n files.name.url.split('?')[0].split('/')[\n files.name?.url?.split('?')[0].split('/').length - 1\n ]\n }}\n </a>\n </p>\n <p ngbTooltip=\"Delete\"\n class=\"ms-3\">\n <i\n class=\"fa fa-trash delete-icon\"\n (keydown.enter)=\"deleteCommunicationFiles(files.id, i)\"\n (keydown.space)=\"deleteCommunicationFiles(files.id, i)\"\n (click)=\"deleteCommunicationFiles(files.id, i)\"\n aria-hidden=\"true\"\n ></i>\n </p>\n </div>\n }\n </div>\n }\n </div>\n </div>\n }\n @if (!isEdit) {\n <div class=\"row\">\n <div class=\"col-12 text-end mb-3\">\n <button class=\"btn btn-sm btn-outline-primary\"\n (click)=\"showEditForm()\">\n <i class=\"fa fa-plus-circle\" aria-hidden=\"true\"></i> {{ 'Add documentation' }}\n </button>\n </div>\n </div>\n @if (!isLoaded) {\n <div class=\"w-100 text-center mt-3\"\n >\n <p-progressSpinner strokeWidth=\"2\"> </p-progressSpinner>\n </div>\n }\n <div class=\"primeng-datatable-container actions-collapsed mt-0 table-responsive\"\n [class.hideTable]=\"totalRecordsUnFiltered === 0\">\n <p-table #dt\n [value]=\"allCommunication\"\n [paginator]=\"totalRecords !== 0\"\n [lazy]=\"true\"\n [rows]=\"PAGE_SIZE\"\n [totalRecords]=\"totalRecords\"\n [loading]=\"loading\"\n (onLazyLoad)=\"onLazyLoad($event)\">\n <ng-template pTemplate=\"caption\">\n <div class=\"search-contact\">\n <div class=\"col-sm-3 mb-2 mb-md-0 filter-domain-list\">\n <p-select\n [options]=\"allDocumentationGroups\"\n optionLabel=\"name\"\n optionValue=\"id\"\n [(ngModel)]=\"groupId\"\n placeholder=\"Select Documentation Team\"\n [appendTo]=\"'body'\"\n (onChange)=\"filterDomainsList()\">\n </p-select>\n </div>\n <div class=\"text-end\">\n <label for=\"enterprise-wiki-search\" class=\"visually-hidden\">Search Documentation</label>\n <p-iconfield iconPosition=\"left\">\n <p-inputicon><i class=\"fa fa-search\" aria-hidden=\"true\"></i></p-inputicon>\n <input type=\"text\"\n id=\"enterprise-wiki-search\"\n name=\"enterprise-wiki-search\"\n [(ngModel)]=\"searchText\"\n pInputText\n placeholder=\"Search Documentation...\"\n (input)=\"dt.filterGlobal($event.target.value, 'contains')\" />\n </p-iconfield>\n </div>\n </div>\n </ng-template>\n <ng-template pTemplate=\"header\">\n <tr>\n <th scope=\"true\">{{ 'Enterprise.Documentation.Title' | transloco }}</th>\n <th scope=\"true\">{{ 'Enterprise.Documentation.Sender' | transloco }}</th>\n <th scope=\"true\">{{ 'Enterprise.Documentation.Team' | transloco }}</th>\n <th scope=\"true\">{{ 'Enterprise.Documentation.Files' | transloco }}</th>\n <th scope=\"true\">{{ 'Enterprise.Documentation.Date' | transloco }}</th>\n <th scope=\"true\">{{ 'Enterprise.Documentation.Status' | transloco }}</th>\n <th scope=\"true\"\n class=\"actions-column\">{{ 'Label.Actions' | transloco }}</th>\n </tr>\n </ng-template>\n <ng-template pTemplate=\"body\"\n let-item>\n <tr class=\"table-row\">\n <td data-head=\"Title\">\n <a [routerLink]=\"[item.id]\">{{ item.title }}</a>\n </td>\n <td data-head=\"Sender\">{{ item.author | ifNameNullShowEmail }}</td>\n <td data-head=\"Team\">{{ item.group?.name }}</td>\n <td data-head=\"Files\">\n @for (files of item.group_communication_files; track files) {\n <span>\n <a target=\"blank\"\n [href]=\"files.name.url\">\n {{\n files.name.url.split('?')[0].split('/')[\n files.name.url.split('?')[0].split('/').length - 1\n ]\n }}\n </a>\n </span>\n }\n </td>\n <td data-head=\"Date\">{{ item.created_at | dateFormat: 'datetime' }}</td>\n <td data-head=\"Status\">\n @if (item.visible_globally) {\n <span\n class=\"badge bg-warning ms-2\">{{\n 'Enterprise.Documentation.Global' | transloco\n }}</span>\n }@if (item.published) {\n <span\n class=\"badge bg-info ms-2\">{{\n 'Enterprise.Documentation.Published' | transloco\n }}</span>\n }@if (item.pushed) {\n <span\n class=\"badge bg-success ms-2\">{{\n 'Enterprise.Documentation.Pushed' | transloco\n }}</span>\n }\n </td>\n <td data-head=\"Action\">\n <ul class=\"list-unstyled list-inline list-action\">\n <li ngbTooltip=\"Edit\"\n class=\"me-2 me-sm-3\">\n <i\n class=\"fa fa-edit edit-icon\"\n (click)=\"getCommunicationDetails(item.id)\"\n (keydown.enter)=\"getCommunicationDetails(item.id)\"\n aria-hidden=\"true\"\n ></i>\n </li>\n <li ngbTooltip=\"Delete\"\n class=\"me-2 me-sm-3\">\n <i\n class=\"fa fa-trash delete-icon\"\n (keydown.enter)=\"onDelete(item.id)\"\n (keydown.space)=\"onDelete(item.id)\"\n (click)=\"onDelete(item.id)\"\n aria-hidden=\"true\"\n ></i>\n </li>\n <li ngbTooltip=\"See Communication\"\n class=\"me-2 me-sm-3 see-icon\"\n [routerLink]=\"[item.id]\">\n <i class=\"fa fa-eye eye-icon \" aria-hidden=\"true\"></i>\n </li>\n </ul>\n </td>\n </tr>\n </ng-template>\n </p-table>\n @if (totalRecords === 0 && totalRecordsUnFiltered !== 0 && !groupId) {\n <div>\n <pw-no-data [withImage]=\"true\" [message]=\"'Search.NoDataMessage'| transloco\" [description]=\"'Search.NoDataDescription' | transloco\" >\n </pw-no-data>\n </div>\n }\n @if (totalRecords !== 0) {\n <pw-records-summary [showing]=\"dt?.value?.length ?? 0\" [total]=\"totalRecords\" />\n }\n </div>\n @if (totalRecordsUnFiltered === 0 && isLoaded) {\n <div>\n <pw-no-data [withImage]=\"true\" [message]=\"'Enterprise.Documentation.NoDocumentation' | transloco\">\n </pw-no-data>\n </div>\n }\n }\n", styles: ["@charset \"UTF-8\";:root{--first: rgb(23 105 225);--second: rgb(54 194 131);--third: rgb(255 171 0);--text: rgb(34 34 34);--tabs_bg: rgb(23 105 225);--tabs_sub_bg: rgb(70, 136, 236);--tabs_text: rgb(255 255 255);--titles: rgb(34 34 34);--sidebar_bg: rgb(0, 48, 63);--sidebar_text: rgb(255 255 255)}.table-row{vertical-align:top}.communication-files{display:flex!important}.search-contact{display:flex;justify-content:space-between}@media(min-width:320px)and (max-width:720px){.search-contact{display:block}}a.previous i{top:0}.eye-icon{color:var(--first);font-size:18px;padding-left:3px;padding-right:3px}.title{display:flex}.drag-drop-text{padding:20px;border:2px dashed #ccc;text-align:center;color:#aaa;margin-top:10px}\n"] }]
1498
1559
  }], ctorParameters: () => [{ type: i1.GroupService }, { type: i0.Injector }, { type: i0.ChangeDetectorRef }, { type: i0.Renderer2 }, { type: i0.ElementRef }], propDecorators: { onSave: [] } });
1499
1560
 
1500
1561
  class EnterpriseWikiDetailsComponent extends AppBaseComponent {
1501
- constructor(injector, groupService, sanitizer) {
1562
+ constructor(injector, groupService, sanitizer, cdr) {
1502
1563
  super(injector);
1503
1564
  this.groupService = groupService;
1504
1565
  this.sanitizer = sanitizer;
1566
+ this.cdr = cdr;
1505
1567
  this.isLoaded = false;
1506
1568
  }
1507
1569
  ngOnInit() {
1508
1570
  this.getUserSubscriptionId().subscribe(id => {
1509
1571
  this.id = id;
1572
+ this.cdr.markForCheck();
1510
1573
  });
1511
1574
  this.route.params.subscribe(param => {
1512
1575
  this.communicationId = Number(param['wikiId']);
1576
+ this.cdr.markForCheck();
1513
1577
  });
1514
1578
  this.getCommunication();
1515
1579
  this.chatPermission = `${PermissionService.selectedProduct?.permission}.${PermissionService.selectedProduct?.feature_key}`;
@@ -1524,9 +1588,11 @@ class EnterpriseWikiDetailsComponent extends AppBaseComponent {
1524
1588
  blogBody = HelperService.sanitizeQuillBody(response.body, this.sanitizer);
1525
1589
  }
1526
1590
  this.communicationDetails = { ...response, body: blogBody };
1591
+ this.cdr.markForCheck();
1527
1592
  })
1528
1593
  .add(() => {
1529
1594
  this.isLoaded = true;
1595
+ this.cdr.markForCheck();
1530
1596
  });
1531
1597
  }
1532
1598
  onCancel() {
@@ -1538,13 +1604,13 @@ class EnterpriseWikiDetailsComponent extends AppBaseComponent {
1538
1604
  ngOnDestroy() {
1539
1605
  super.ngOnDestroy();
1540
1606
  }
1541
- static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.19", ngImport: i0, type: EnterpriseWikiDetailsComponent, deps: [{ token: i0.Injector }, { token: i1.GroupService }, { token: i2.DomSanitizer }], target: i0.ɵɵFactoryTarget.Component }); }
1542
- static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.2.19", type: EnterpriseWikiDetailsComponent, isStandalone: false, selector: "pw-enterprise-wiki-details", usesInheritance: true, ngImport: i0, template: "<div class=\"row\">\n <div class=\"col-12 d-flex\">\n <a aria-label=\"Navigate to Target\"\n (click)=\"onCancel()\"\n (keydown.enter)=\"onCancel()\"\n class=\"previous\"><i class=\"fa fa-arrow-alt-circle-left\" aria-hidden=\"true\"></i></a>\n <h2 class=\"mt-0 mb-0\">Documentation</h2>\n </div>\n</div>\n<div class=\"w-100 text-center mt-3\"\n *ngIf=\"!isLoaded\">\n <p-progressSpinner strokeWidth=\"2\"> </p-progressSpinner>\n</div>\n<div *ngIf=\"isLoaded\">\n <div class=\"content-quill-wrapper container-fluid pw-tab overflow-hidden mt-3\" *ngIf=\"communicationDetails\">\n <div class=\"pb-0\">\n <div class=\"card-body p-4\">\n <div class=\"row mb-3\">\n <div class=\"col-12 d-flex flex-wrap justify-content-between align-items-center mb-md-2\">\n <div class=\"d-flex flex-wrap mb-3 mb-md-0\">\n <span [ngClass]=\"communicationDetails?.pushed ? 'badge bg-success' : 'badge bg-danger'\" class=\"me-2 mb-2 mb-md-0\">\n {{ communicationDetails?.pushed ? 'Pushed' : 'Not Pushed' }}\n </span>\n <span [ngClass]=\"communicationDetails?.published? 'badge bg-success' : 'badge bg-danger'\" class=\"me-2 mb-2 mb-md-0\">\n {{ communicationDetails?.published ? 'Published' : 'Not Published' }}\n </span>\n <span [ngClass]=\"communicationDetails?.published ? 'badge bg-success' : 'badge bg-danger'\" class=\"me-2 mb-2 mb-md-0\">\n {{ communicationDetails?.visible_globally ? 'Visible Globally' : 'Not Visible Globally' }}\n </span>\n </div>\n <div class=\"d-flex flex-wrap mb-3 mb-md-0\">\n <span class=\"badge bg-cyan mb-2 me-2 mb-md-0\">{{communicationDetails?.group?.name}}</span>\n <span class=\"badge bg-blue-grey mb-2 me-2 mb-md-0\">{{ 'Created At (' + (communicationDetails?.created_at | date: 'dd-MMM-YYYY') + ')' }}</span>\n <span *ngIf=\"communicationDetails?.pushed_at\" class=\"badge bg-grey mb-2 mb-md-0\">{{ 'Pushed At (' + (communicationDetails?.pushed_at | date: 'dd-MMM-YYYY') + ')' }}</span>\n </div>\n </div>\n </div>\n <div class=\"row\">\n <div class=\"col-12 mb-3 ms-2\">\n <h5>{{ communicationDetails?.title }}</h5>\n </div>\n <div class=\"col-12 mb-3 ms-2 message-icon\">\n <a [routerLink]=\"['/members', communicationDetails?.author?.slug]\">{{\n communicationDetails?.author | ifNameNullShowEmail\n }}</a>\n <div class=\"ms-2\"\n ngbTooltip=\"Message\"\n *rbacAllow=\"chatPermission\">\n <i\n [routerLink]=\"['/message']\"\n [fragment]=\"communicationDetails?.author?.slug\"\n class=\"fa fa-comments cta1-icon\"\n aria-hidden=\"true\"\n ></i>\n </div>\n </div>\n\n <div class=\"col-12 ms-2\">\n <div class=\"ql-container ql-snow body-quill\">\n <div class=\"ql-editor\"\n [innerHTML]=\"communicationDetails?.body\">\n </div>\n </div>\n </div>\n <div class=\"col-12 col-sm-10\">\n <p *ngFor=\"\n let files of communicationDetails?.group_communication_files;\n trackBy: trackByFileId\n \">\n <a [href]=\"files?.name?.url\"\n target=\"blank\">{{\n files?.name?.url?.split('?')[0]?.split('/')[\n files?.name?.url.split('?')[0]?.split('/')?.length - 1\n ]\n }}</a>\n </p>\n </div>\n </div>\n </div>\n </div>\n </div>\n\n</div>\n\n", styles: [".badge-success,.badge-danger{padding:.5rem 1rem;border:1px solid black;font-size:1rem;display:inline-block;text-align:center}.badge-success{background-color:green;color:#fff}.badge-danger{background-color:red;color:#fff}.message-icon{display:flex}.ql-container{resize:none!important}.date-span{padding:.5rem 1rem;font-size:1rem;border:1px solid black;display:inline-block;text-align:center}.light-gray{background-color:#d3d3d3;color:#fff}.gray{background-color:gray;color:#fff}.card-body{padding:1.5rem}h4,h5{font-weight:700;margin-bottom:.5rem}p{margin-bottom:1rem}.d-flex{display:flex;align-items:center}.me-3{margin-right:1rem}.container-fluid{padding:0}.mb-3{margin-bottom:1rem}.mb-2{margin-bottom:.5rem}.justify-content-between{justify-content:space-between}.align-items-center{align-items:center}.button-width{width:100px}\n"], dependencies: [{ kind: "directive", type: i2$1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i2$1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i2$1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i4.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: i8.RbacAllowDirective, selector: "[rbacAllow]", inputs: ["rbacAllow"] }, { kind: "component", type: i12.ProgressSpinner, selector: "p-progressSpinner, p-progress-spinner, p-progressspinner", inputs: ["styleClass", "style", "strokeWidth", "fill", "animationDuration", "ariaLabel"] }, { kind: "directive", type: i14.RouterLink, selector: "[routerLink]", inputs: ["target", "queryParams", "fragment", "queryParamsHandling", "state", "info", "relativeTo", "preserveFragment", "skipLocationChange", "replaceUrl", "routerLink"] }, { kind: "pipe", type: i2$1.DatePipe, name: "date" }, { kind: "pipe", type: i17.IfNameNullShowEmailPipe, name: "ifNameNullShowEmail" }] }); }
1607
+ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.6", ngImport: i0, type: EnterpriseWikiDetailsComponent, deps: [{ token: i0.Injector }, { token: i1.GroupService }, { token: i2.DomSanitizer }, { token: i0.ChangeDetectorRef }], target: i0.ɵɵFactoryTarget.Component }); }
1608
+ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.6", type: EnterpriseWikiDetailsComponent, isStandalone: false, selector: "pw-enterprise-wiki-details", usesInheritance: true, ngImport: i0, template: "<div class=\"row\">\n <div class=\"col-12 d-flex\">\n <a aria-label=\"Navigate to Target\"\n (click)=\"onCancel()\"\n (keydown.enter)=\"onCancel()\"\n class=\"previous\"><i class=\"fa fa-arrow-alt-circle-left\" aria-hidden=\"true\"></i></a>\n <h2 class=\"mt-0 mb-0\">Documentation</h2>\n </div>\n </div>\n @if (!isLoaded) {\n <div class=\"w-100 text-center mt-3\"\n >\n <p-progressSpinner strokeWidth=\"2\"> </p-progressSpinner>\n </div>\n }\n @if (isLoaded) {\n <div>\n @if (communicationDetails) {\n <div class=\"content-quill-wrapper container-fluid pw-tab overflow-hidden mt-3\">\n <div class=\"pb-0\">\n <div class=\"card-body p-4\">\n <div class=\"row mb-3\">\n <div class=\"col-12 d-flex flex-wrap justify-content-between align-items-center mb-md-2\">\n <div class=\"d-flex flex-wrap mb-3 mb-md-0\">\n <span [ngClass]=\"communicationDetails?.pushed ? 'badge bg-success' : 'badge bg-danger'\" class=\"me-2 mb-2 mb-md-0\">\n {{ communicationDetails?.pushed ? 'Pushed' : 'Not Pushed' }}\n </span>\n <span [ngClass]=\"communicationDetails?.published? 'badge bg-success' : 'badge bg-danger'\" class=\"me-2 mb-2 mb-md-0\">\n {{ communicationDetails?.published ? 'Published' : 'Not Published' }}\n </span>\n <span [ngClass]=\"communicationDetails?.published ? 'badge bg-success' : 'badge bg-danger'\" class=\"me-2 mb-2 mb-md-0\">\n {{ communicationDetails?.visible_globally ? 'Visible Globally' : 'Not Visible Globally' }}\n </span>\n </div>\n <div class=\"d-flex flex-wrap mb-3 mb-md-0\">\n <span class=\"badge bg-cyan mb-2 me-2 mb-md-0\">{{communicationDetails?.group?.name}}</span>\n <span class=\"badge bg-blue-grey mb-2 me-2 mb-md-0\">{{ 'Created At (' + (communicationDetails?.created_at | date: 'dd-MMM-yyyy') + ')' }}</span>\n @if (communicationDetails?.pushed_at) {\n <span class=\"badge bg-grey mb-2 mb-md-0\">{{ 'Pushed At (' + (communicationDetails?.pushed_at | date: 'dd-MMM-yyyy') + ')' }}</span>\n }\n </div>\n </div>\n </div>\n <div class=\"row\">\n <div class=\"col-12 mb-3 ms-2\">\n <h5>{{ communicationDetails?.title }}</h5>\n </div>\n <div class=\"col-12 mb-3 ms-2 message-icon\">\n <a [routerLink]=\"['/members', communicationDetails?.author?.slug]\">{{\n communicationDetails?.author | ifNameNullShowEmail\n }}</a>\n <div class=\"ms-2\"\n ngbTooltip=\"Message\"\n *rbacAllow=\"chatPermission\">\n <i\n [routerLink]=\"['/message']\"\n [fragment]=\"communicationDetails?.author?.slug\"\n class=\"fa fa-comments cta1-icon\"\n aria-hidden=\"true\"\n ></i>\n </div>\n </div>\n <div class=\"col-12 ms-2\">\n <div class=\"ql-container ql-snow body-quill\">\n <div class=\"ql-editor\"\n [innerHTML]=\"communicationDetails?.body\">\n </div>\n </div>\n </div>\n <div class=\"col-12 col-sm-10\">\n @for (\n files of communicationDetails?.group_communication_files; track trackByFileId($index,\n files)) {\n <p>\n <a [href]=\"files?.name?.url\"\n target=\"blank\">{{\n files?.name?.url?.split('?')[0]?.split('/')[\n files?.name?.url.split('?')[0]?.split('/')?.length - 1\n ]\n }}</a>\n </p>\n }\n </div>\n </div>\n </div>\n </div>\n </div>\n }\n </div>\n }\n\n", styles: [".badge-success,.badge-danger{padding:.5rem 1rem;border:1px solid black;font-size:1rem;display:inline-block;text-align:center}.badge-success{background-color:green;color:#fff}.badge-danger{background-color:red;color:#fff}.message-icon{display:flex}.ql-container{resize:none!important}.date-span{padding:.5rem 1rem;font-size:1rem;border:1px solid black;display:inline-block;text-align:center}.light-gray{background-color:#d3d3d3;color:#fff}.gray{background-color:gray;color:#fff}.card-body{padding:1.5rem}h4,h5{font-weight:700;margin-bottom:.5rem}p{margin-bottom:1rem}.d-flex{display:flex;align-items:center}.me-3{margin-right:1rem}.container-fluid{padding:0}.mb-3{margin-bottom:1rem}.mb-2{margin-bottom:.5rem}.justify-content-between{justify-content:space-between}.align-items-center{align-items:center}.button-width{width:100px}\n"], dependencies: [{ kind: "directive", type: i3.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i7.NgbTooltip, selector: "[ngbTooltip]", inputs: ["animation", "autoClose", "placement", "popperOptions", "triggers", "positionTarget", "container", "disableTooltip", "tooltipClass", "tooltipContext", "openDelay", "closeDelay", "ngbTooltip"], outputs: ["shown", "hidden"], exportAs: ["ngbTooltip"] }, { kind: "directive", type: i9.RbacAllowDirective, selector: "[rbacAllow]", inputs: ["rbacAllow"] }, { kind: "component", type: i12.ProgressSpinner, selector: "p-progressSpinner, p-progress-spinner, p-progressspinner", inputs: ["styleClass", "strokeWidth", "fill", "animationDuration", "ariaLabel"] }, { kind: "directive", type: i16.RouterLink, selector: "[routerLink]", inputs: ["target", "queryParams", "fragment", "queryParamsHandling", "state", "info", "relativeTo", "preserveFragment", "skipLocationChange", "replaceUrl", "routerLink"] }, { kind: "pipe", type: i3.DatePipe, name: "date" }, { kind: "pipe", type: i19.IfNameNullShowEmailPipe, name: "ifNameNullShowEmail" }] }); }
1543
1609
  }
1544
- i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.19", ngImport: i0, type: EnterpriseWikiDetailsComponent, decorators: [{
1610
+ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.6", ngImport: i0, type: EnterpriseWikiDetailsComponent, decorators: [{
1545
1611
  type: Component,
1546
- args: [{ selector: 'pw-enterprise-wiki-details', standalone: false, template: "<div class=\"row\">\n <div class=\"col-12 d-flex\">\n <a aria-label=\"Navigate to Target\"\n (click)=\"onCancel()\"\n (keydown.enter)=\"onCancel()\"\n class=\"previous\"><i class=\"fa fa-arrow-alt-circle-left\" aria-hidden=\"true\"></i></a>\n <h2 class=\"mt-0 mb-0\">Documentation</h2>\n </div>\n</div>\n<div class=\"w-100 text-center mt-3\"\n *ngIf=\"!isLoaded\">\n <p-progressSpinner strokeWidth=\"2\"> </p-progressSpinner>\n</div>\n<div *ngIf=\"isLoaded\">\n <div class=\"content-quill-wrapper container-fluid pw-tab overflow-hidden mt-3\" *ngIf=\"communicationDetails\">\n <div class=\"pb-0\">\n <div class=\"card-body p-4\">\n <div class=\"row mb-3\">\n <div class=\"col-12 d-flex flex-wrap justify-content-between align-items-center mb-md-2\">\n <div class=\"d-flex flex-wrap mb-3 mb-md-0\">\n <span [ngClass]=\"communicationDetails?.pushed ? 'badge bg-success' : 'badge bg-danger'\" class=\"me-2 mb-2 mb-md-0\">\n {{ communicationDetails?.pushed ? 'Pushed' : 'Not Pushed' }}\n </span>\n <span [ngClass]=\"communicationDetails?.published? 'badge bg-success' : 'badge bg-danger'\" class=\"me-2 mb-2 mb-md-0\">\n {{ communicationDetails?.published ? 'Published' : 'Not Published' }}\n </span>\n <span [ngClass]=\"communicationDetails?.published ? 'badge bg-success' : 'badge bg-danger'\" class=\"me-2 mb-2 mb-md-0\">\n {{ communicationDetails?.visible_globally ? 'Visible Globally' : 'Not Visible Globally' }}\n </span>\n </div>\n <div class=\"d-flex flex-wrap mb-3 mb-md-0\">\n <span class=\"badge bg-cyan mb-2 me-2 mb-md-0\">{{communicationDetails?.group?.name}}</span>\n <span class=\"badge bg-blue-grey mb-2 me-2 mb-md-0\">{{ 'Created At (' + (communicationDetails?.created_at | date: 'dd-MMM-YYYY') + ')' }}</span>\n <span *ngIf=\"communicationDetails?.pushed_at\" class=\"badge bg-grey mb-2 mb-md-0\">{{ 'Pushed At (' + (communicationDetails?.pushed_at | date: 'dd-MMM-YYYY') + ')' }}</span>\n </div>\n </div>\n </div>\n <div class=\"row\">\n <div class=\"col-12 mb-3 ms-2\">\n <h5>{{ communicationDetails?.title }}</h5>\n </div>\n <div class=\"col-12 mb-3 ms-2 message-icon\">\n <a [routerLink]=\"['/members', communicationDetails?.author?.slug]\">{{\n communicationDetails?.author | ifNameNullShowEmail\n }}</a>\n <div class=\"ms-2\"\n ngbTooltip=\"Message\"\n *rbacAllow=\"chatPermission\">\n <i\n [routerLink]=\"['/message']\"\n [fragment]=\"communicationDetails?.author?.slug\"\n class=\"fa fa-comments cta1-icon\"\n aria-hidden=\"true\"\n ></i>\n </div>\n </div>\n\n <div class=\"col-12 ms-2\">\n <div class=\"ql-container ql-snow body-quill\">\n <div class=\"ql-editor\"\n [innerHTML]=\"communicationDetails?.body\">\n </div>\n </div>\n </div>\n <div class=\"col-12 col-sm-10\">\n <p *ngFor=\"\n let files of communicationDetails?.group_communication_files;\n trackBy: trackByFileId\n \">\n <a [href]=\"files?.name?.url\"\n target=\"blank\">{{\n files?.name?.url?.split('?')[0]?.split('/')[\n files?.name?.url.split('?')[0]?.split('/')?.length - 1\n ]\n }}</a>\n </p>\n </div>\n </div>\n </div>\n </div>\n </div>\n\n</div>\n\n", styles: [".badge-success,.badge-danger{padding:.5rem 1rem;border:1px solid black;font-size:1rem;display:inline-block;text-align:center}.badge-success{background-color:green;color:#fff}.badge-danger{background-color:red;color:#fff}.message-icon{display:flex}.ql-container{resize:none!important}.date-span{padding:.5rem 1rem;font-size:1rem;border:1px solid black;display:inline-block;text-align:center}.light-gray{background-color:#d3d3d3;color:#fff}.gray{background-color:gray;color:#fff}.card-body{padding:1.5rem}h4,h5{font-weight:700;margin-bottom:.5rem}p{margin-bottom:1rem}.d-flex{display:flex;align-items:center}.me-3{margin-right:1rem}.container-fluid{padding:0}.mb-3{margin-bottom:1rem}.mb-2{margin-bottom:.5rem}.justify-content-between{justify-content:space-between}.align-items-center{align-items:center}.button-width{width:100px}\n"] }]
1547
- }], ctorParameters: () => [{ type: i0.Injector }, { type: i1.GroupService }, { type: i2.DomSanitizer }] });
1612
+ args: [{ selector: 'pw-enterprise-wiki-details', standalone: false, template: "<div class=\"row\">\n <div class=\"col-12 d-flex\">\n <a aria-label=\"Navigate to Target\"\n (click)=\"onCancel()\"\n (keydown.enter)=\"onCancel()\"\n class=\"previous\"><i class=\"fa fa-arrow-alt-circle-left\" aria-hidden=\"true\"></i></a>\n <h2 class=\"mt-0 mb-0\">Documentation</h2>\n </div>\n </div>\n @if (!isLoaded) {\n <div class=\"w-100 text-center mt-3\"\n >\n <p-progressSpinner strokeWidth=\"2\"> </p-progressSpinner>\n </div>\n }\n @if (isLoaded) {\n <div>\n @if (communicationDetails) {\n <div class=\"content-quill-wrapper container-fluid pw-tab overflow-hidden mt-3\">\n <div class=\"pb-0\">\n <div class=\"card-body p-4\">\n <div class=\"row mb-3\">\n <div class=\"col-12 d-flex flex-wrap justify-content-between align-items-center mb-md-2\">\n <div class=\"d-flex flex-wrap mb-3 mb-md-0\">\n <span [ngClass]=\"communicationDetails?.pushed ? 'badge bg-success' : 'badge bg-danger'\" class=\"me-2 mb-2 mb-md-0\">\n {{ communicationDetails?.pushed ? 'Pushed' : 'Not Pushed' }}\n </span>\n <span [ngClass]=\"communicationDetails?.published? 'badge bg-success' : 'badge bg-danger'\" class=\"me-2 mb-2 mb-md-0\">\n {{ communicationDetails?.published ? 'Published' : 'Not Published' }}\n </span>\n <span [ngClass]=\"communicationDetails?.published ? 'badge bg-success' : 'badge bg-danger'\" class=\"me-2 mb-2 mb-md-0\">\n {{ communicationDetails?.visible_globally ? 'Visible Globally' : 'Not Visible Globally' }}\n </span>\n </div>\n <div class=\"d-flex flex-wrap mb-3 mb-md-0\">\n <span class=\"badge bg-cyan mb-2 me-2 mb-md-0\">{{communicationDetails?.group?.name}}</span>\n <span class=\"badge bg-blue-grey mb-2 me-2 mb-md-0\">{{ 'Created At (' + (communicationDetails?.created_at | date: 'dd-MMM-yyyy') + ')' }}</span>\n @if (communicationDetails?.pushed_at) {\n <span class=\"badge bg-grey mb-2 mb-md-0\">{{ 'Pushed At (' + (communicationDetails?.pushed_at | date: 'dd-MMM-yyyy') + ')' }}</span>\n }\n </div>\n </div>\n </div>\n <div class=\"row\">\n <div class=\"col-12 mb-3 ms-2\">\n <h5>{{ communicationDetails?.title }}</h5>\n </div>\n <div class=\"col-12 mb-3 ms-2 message-icon\">\n <a [routerLink]=\"['/members', communicationDetails?.author?.slug]\">{{\n communicationDetails?.author | ifNameNullShowEmail\n }}</a>\n <div class=\"ms-2\"\n ngbTooltip=\"Message\"\n *rbacAllow=\"chatPermission\">\n <i\n [routerLink]=\"['/message']\"\n [fragment]=\"communicationDetails?.author?.slug\"\n class=\"fa fa-comments cta1-icon\"\n aria-hidden=\"true\"\n ></i>\n </div>\n </div>\n <div class=\"col-12 ms-2\">\n <div class=\"ql-container ql-snow body-quill\">\n <div class=\"ql-editor\"\n [innerHTML]=\"communicationDetails?.body\">\n </div>\n </div>\n </div>\n <div class=\"col-12 col-sm-10\">\n @for (\n files of communicationDetails?.group_communication_files; track trackByFileId($index,\n files)) {\n <p>\n <a [href]=\"files?.name?.url\"\n target=\"blank\">{{\n files?.name?.url?.split('?')[0]?.split('/')[\n files?.name?.url.split('?')[0]?.split('/')?.length - 1\n ]\n }}</a>\n </p>\n }\n </div>\n </div>\n </div>\n </div>\n </div>\n }\n </div>\n }\n\n", styles: [".badge-success,.badge-danger{padding:.5rem 1rem;border:1px solid black;font-size:1rem;display:inline-block;text-align:center}.badge-success{background-color:green;color:#fff}.badge-danger{background-color:red;color:#fff}.message-icon{display:flex}.ql-container{resize:none!important}.date-span{padding:.5rem 1rem;font-size:1rem;border:1px solid black;display:inline-block;text-align:center}.light-gray{background-color:#d3d3d3;color:#fff}.gray{background-color:gray;color:#fff}.card-body{padding:1.5rem}h4,h5{font-weight:700;margin-bottom:.5rem}p{margin-bottom:1rem}.d-flex{display:flex;align-items:center}.me-3{margin-right:1rem}.container-fluid{padding:0}.mb-3{margin-bottom:1rem}.mb-2{margin-bottom:.5rem}.justify-content-between{justify-content:space-between}.align-items-center{align-items:center}.button-width{width:100px}\n"] }]
1613
+ }], ctorParameters: () => [{ type: i0.Injector }, { type: i1.GroupService }, { type: i2.DomSanitizer }, { type: i0.ChangeDetectorRef }] });
1548
1614
 
1549
1615
  PlotlyViaCDNModule.setPlotlyVersion('2.33.0', 'custom', 'https://cdn.jsdelivr.net/npm/plotly.js-strict-dist-min@2.33.0/plotly-strict.min.js');
1550
1616
  const routes = [
@@ -1640,8 +1706,8 @@ const routes = [
1640
1706
  }
1641
1707
  ];
1642
1708
  class EnterpriseModule {
1643
- static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.19", ngImport: i0, type: EnterpriseModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule }); }
1644
- static { this.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "19.2.19", ngImport: i0, type: EnterpriseModule, declarations: [EnterpriseSubscriptionsComponent,
1709
+ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.6", ngImport: i0, type: EnterpriseModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule }); }
1710
+ static { this.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "21.2.6", ngImport: i0, type: EnterpriseModule, declarations: [EnterpriseSubscriptionsComponent,
1645
1711
  EnterpriseMembersComponent,
1646
1712
  EnterprisePartnersComponent,
1647
1713
  EnterpriseTabsComponent,
@@ -1651,6 +1717,8 @@ class EnterpriseModule {
1651
1717
  EnterpriseWikiComponent,
1652
1718
  EnterpriseWikiDetailsComponent], imports: [CommonModule,
1653
1719
  InputTextModule,
1720
+ IconFieldModule,
1721
+ InputIconModule,
1654
1722
  CoreTranslocoModule,
1655
1723
  PlotlyViaCDNModule,
1656
1724
  NgbTooltipModule,
@@ -1661,10 +1729,12 @@ class EnterpriseModule {
1661
1729
  ReactiveFormsModule,
1662
1730
  PipesModule,
1663
1731
  DirectivesModule,
1664
- SharedComponentsModule, i14.RouterModule, NgxUploaderModule,
1665
- MultiSelectModule, i15.QuillModule] }); }
1666
- static { this.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "19.2.19", ngImport: i0, type: EnterpriseModule, imports: [CommonModule,
1732
+ SharedComponentsModule, i16.RouterModule, NgxUploaderModule,
1733
+ MultiSelectModule, i17.QuillModule] }); }
1734
+ static { this.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "21.2.6", ngImport: i0, type: EnterpriseModule, imports: [CommonModule,
1667
1735
  InputTextModule,
1736
+ IconFieldModule,
1737
+ InputIconModule,
1668
1738
  CoreTranslocoModule,
1669
1739
  PlotlyViaCDNModule,
1670
1740
  NgbTooltipModule,
@@ -1684,7 +1754,7 @@ class EnterpriseModule {
1684
1754
  // LazyLoadModules
1685
1755
  ] }); }
1686
1756
  }
1687
- i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.19", ngImport: i0, type: EnterpriseModule, decorators: [{
1757
+ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.6", ngImport: i0, type: EnterpriseModule, decorators: [{
1688
1758
  type: NgModule,
1689
1759
  args: [{
1690
1760
  declarations: [
@@ -1701,6 +1771,8 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.19", ngImpo
1701
1771
  imports: [
1702
1772
  CommonModule,
1703
1773
  InputTextModule,
1774
+ IconFieldModule,
1775
+ InputIconModule,
1704
1776
  CoreTranslocoModule,
1705
1777
  PlotlyViaCDNModule,
1706
1778
  NgbTooltipModule,