@seniorsistemas/exclusion-process-component 0.1.0 → 0.2.1-534b2cd2-c9f9-432d-af2e-5630b05ee46f

package/bundles/seniorsistemas-exclusion-process-component.umd.js

@@ -1,8 +1,8 @@
 (function (global, factory) {
-    typeof exports === 'object' && typeof module !== 'undefined' ? factory(exports, require('@angular/common'), require('@angular/core'), require('primeng/panel'), require('primeng/table'), require('@seniorsistemas/angular-components'), require('moment'), require('@angular/router'), require('rxjs'), require('rxjs/operators'), require('@angular/common/http'), require('@ngx-translate/core'), require('primeng/api'), require('@angular/forms'), require('primeng/dialog'), require('primeng/confirmdialog'), require('primeng/inputtext'), require('@seniorsistemas/platform-components')) :
-    typeof define === 'function' && define.amd ? define('@seniorsistemas/exclusion-process-component', ['exports', '@angular/common', '@angular/core', 'primeng/panel', 'primeng/table', '@seniorsistemas/angular-components', 'moment', '@angular/router', 'rxjs', 'rxjs/operators', '@angular/common/http', '@ngx-translate/core', 'primeng/api', '@angular/forms', 'primeng/dialog', 'primeng/confirmdialog', 'primeng/inputtext', '@seniorsistemas/platform-components'], factory) :
-    (global = global || self, factory((global.seniorsistemas = global.seniorsistemas || {}, global.seniorsistemas['exclusion-process-component'] = {}), global.ng.common, global.ng.core, global.panel, global.table, global.angularComponents, global.moment, global.ng.router, global.rxjs, global.rxjs.operators, global.ng.common.http, global.core$1, global.api, global.ng.forms, global.dialog, global.confirmdialog, global.inputtext, global.platformComponents));
-}(this, (function (exports, common, core, panel, table, angularComponents, moment, router, rxjs, operators, http, core$1, api, forms, dialog, confirmdialog, inputtext, platformComponents) { 'use strict';
+    typeof exports === 'object' && typeof module !== 'undefined' ? factory(exports, require('@angular/common'), require('@angular/core'), require('primeng/panel'), require('primeng/table'), require('@seniorsistemas/angular-components'), require('moment'), require('@angular/router'), require('@ngx-translate/core'), require('rxjs'), require('rxjs/operators'), require('@senior-gestao-empresarial/angular-components'), require('@angular/common/http'), require('primeng/api'), require('@angular/forms'), require('primeng/dialog'), require('primeng/confirmdialog'), require('primeng/inputtext'), require('@seniorsistemas/platform-components')) :
+    typeof define === 'function' && define.amd ? define('@seniorsistemas/exclusion-process-component', ['exports', '@angular/common', '@angular/core', 'primeng/panel', 'primeng/table', '@seniorsistemas/angular-components', 'moment', '@angular/router', '@ngx-translate/core', 'rxjs', 'rxjs/operators', '@senior-gestao-empresarial/angular-components', '@angular/common/http', 'primeng/api', '@angular/forms', 'primeng/dialog', 'primeng/confirmdialog', 'primeng/inputtext', '@seniorsistemas/platform-components'], factory) :
+    (global = global || self, factory((global.seniorsistemas = global.seniorsistemas || {}, global.seniorsistemas['exclusion-process-component'] = {}), global.ng.common, global.ng.core, global.panel, global.table, global.angularComponents, global.moment, global.ng.router, global.core$1, global.rxjs, global.rxjs.operators, global.angularComponents$1, global.ng.common.http, global.api, global.ng.forms, global.dialog, global.confirmdialog, global.inputtext, global.platformComponents));
+}(this, (function (exports, common, core, panel, table, angularComponents, moment, router, core$1, rxjs, operators, angularComponents$1, http, api, forms, dialog, confirmdialog, inputtext, platformComponents) { 'use strict';
 
     /*! *****************************************************************************
     Copyright (c) Microsoft Corporation.
@@ -269,7 +269,6 @@
             this.projectConfigs = projectConfigs;
             var entityUrl = projectConfigs.getDomain() + "/" + projectConfigs.getService();
             this.exclusionProcessUrl = entityUrl + "/entities/exclusionProcess";
-            this.listExclusionsUrl = entityUrl + "/entities/exclusionProcess";
             this.defaultCatch = this.defaultCatch.bind(this);
         }
         LogicalDeleteService.prototype.defaultCatch = function () {
@@ -332,6 +331,7 @@
             });
         };
         LogicalDeleteService.prototype.doGetProcessDetails = function (filterParams) {
+            var _this = this;
             return this.http.get(this.exclusionProcessUrl, { params: filterParams })
                 .pipe(this.defaultCatch())
                 .pipe(operators.map(function (value) {
@@ -339,10 +339,18 @@
                 if (!((_a = value.contents) === null || _a === void 0 ? void 0 : _a.length)) {
                     return null;
                 }
-                return value.contents[0];
+                return _this.mapExclusionsDates(value.contents[0]);
             }));
         };
+        LogicalDeleteService.prototype.mapExclusionsDates = function (exclusionProcess) {
+            var _a;
+            return __assign(__assign({}, exclusionProcess), { startDate: exclusionProcess.startDate ? moment(exclusionProcess.startDate).toDate() : null, finishDate: exclusionProcess.finishDate ? moment(exclusionProcess.finishDate).toDate() : null, groups: (_a = exclusionProcess.groups) === null || _a === void 0 ? void 0 : _a.map(function (group) {
+                    var _a;
+                    return (__assign(__assign({}, group), { startDate: group.startDate ? moment(group.startDate).toDate() : null, finishDate: group.finishDate ? moment(group.finishDate).toDate() : null, steps: (_a = group.steps) === null || _a === void 0 ? void 0 : _a.map(function (step) { return (__assign(__assign({}, step), { startDate: step.startDate ? moment(step.startDate).toDate() : null, finishDate: step.finishDate ? moment(step.finishDate).toDate() : null })); }) }));
+                }) });
+        };
         LogicalDeleteService.prototype.listExclusions = function (entityName, params) {
+            var _this = this;
             if (params === void 0) { params = {}; }
             if (params.filterQuery) {
                 params.filterQuery += " and lower(entityName) eq lower('" + entityName + "')";
@@ -353,14 +361,7 @@
             return this.http.get(this.exclusionProcessUrl, { params: this.getListQueryParams(params) })
                 .pipe(this.defaultCatch())
                 .pipe(operators.map(function (value) {
-                value.contents.forEach(function (p) {
-                    if (p.startDate) {
-                        p.startDate = moment(p.startDate).toDate();
-                    }
-                    if (p.finishDate) {
-                        p.finishDate = moment(p.finishDate).toDate();
-                    }
-                });
+                value.contents = value.contents.map(_this.mapExclusionsDates);
                 return value;
             }));
         };
@@ -430,17 +431,26 @@
         ExclusionDetailsComponent.prototype.ngOnDestroy = function () {
             this.ngUnsubscribe.next();
             this.ngUnsubscribe.complete();
+            this.disconnectWebSocket();
         };
         ExclusionDetailsComponent.prototype.showDetails = function (details) {
-            this.processDetails = null;
+            this._exclusionDetails = details;
             this._entityName = details.entityName;
             this._isVisible = true;
             this._processSummaryData = [];
+            this.processDetails = null;
             this.entityDescription = details.entityDescription;
             this.loadProcessDetails(details);
+            this.connectWebSocket();
+        };
+        ExclusionDetailsComponent.prototype.onVisibilityChanged = function (event) {
+            this.closeDetails();
         };
         ExclusionDetailsComponent.prototype.closeDetails = function () {
             this._isVisible = false;
+            this._exclusionDetails = null;
+            this._processSummaryData = [];
+            this.disconnectWebSocket();
         };
         ExclusionDetailsComponent.prototype.openExclusions = function () {
             this.closeDetails();
@@ -462,14 +472,14 @@
             if (!((_a = this.processDetails) === null || _a === void 0 ? void 0 : _a.startDate)) {
                 return "";
             }
-            return moment(this.processDetails.startDate).format("DD/MM/YYYY HH:mm");
+            return moment(this.processDetails.startDate).format("DD/MM/YYYY HH:mm:ss");
         };
         ExclusionDetailsComponent.prototype.getFinishDate = function () {
             var _a;
             if (!((_a = this.processDetails) === null || _a === void 0 ? void 0 : _a.finishDate)) {
                 return "";
             }
-            return moment(this.processDetails.finishDate).format("DD/MM/YYYY HH:mm");
+            return moment(this.processDetails.finishDate).format("DD/MM/YYYY HH:mm:ss");
         };
         ExclusionDetailsComponent.prototype.isFinished = function () {
             var _a;
@@ -557,14 +567,37 @@
                 .pipe(operators.takeUntil(this.ngUnsubscribe))
                 .pipe(operators.finalize(function () { return _this._isLoading = false; }))
                 .subscribe(function (process) {
+                if (!process) {
+                    return;
+                }
                 _this.processDetails = process;
                 _this.loadProcessSummary(process);
             });
         };
+        ExclusionDetailsComponent.prototype.sortByDate = function (startDate, finishDate) {
+            if (startDate.getTime() > finishDate.getTime()) {
+                return 1;
+            }
+            if (startDate.getTime() < finishDate.getTime()) {
+                return -1;
+            }
+            return 0;
+        };
+        ExclusionDetailsComponent.prototype.sortGroupsByStartDate = function (groups) {
+            var _this = this;
+            return groups.sort(function (a, b) { return _this.sortByDate(a.startDate, b.finishDate); });
+        };
+        ExclusionDetailsComponent.prototype.sortStepsByStartDate = function (steps) {
+            var _this = this;
+            return steps.sort(function (a, b) { return _this.sortByDate(a.startDate, b.finishDate); });
+        };
         ExclusionDetailsComponent.prototype.loadProcessSummary = function (process) {
+            var _this = this;
             var stepLogs = [];
-            process.groups.forEach(function (group) {
-                var steps = group.steps.map(function (step) { return ({
+            this.sortGroupsByStartDate(process.groups)
+                .forEach(function (group) {
+                var steps = _this.sortStepsByStartDate(group.steps)
+                    .map(function (step) { return ({
                     description: step.description,
                     status: step.status,
                     errorMessage: step.errorMessage
@@ -573,6 +606,55 @@
             });
             this._processSummaryData = stepLogs;
         };
+        ExclusionDetailsComponent.prototype.disconnectWebSocket = function () {
+            if (this._exclusionProcessStatusChangedSubscribe) {
+                this._exclusionProcessStatusChangedSubscribe.unsubscribe();
+                this._exclusionProcessStatusChangedSubscribe = null;
+            }
+            if (this._websocketService) {
+                this._websocketService.disconnect();
+                this._websocketService = null;
+            }
+        };
+        ExclusionDetailsComponent.prototype.connectWebSocket = function () {
+            var _this = this;
+            if (this._websocketService) {
+                this.disconnectWebSocket();
+            }
+            this._websocketService = new angularComponents$1.WebsocketService();
+            this._websocketService
+                .onConnect()
+                .pipe(operators.takeUntil(this.ngUnsubscribe))
+                .subscribe(function () {
+                _this.startListeningWebhookEvents();
+            });
+        };
+        ExclusionDetailsComponent.prototype.startListeningWebhookEvents = function () {
+            var _this = this;
+            this._websocketService
+                .onError()
+                .pipe(operators.takeUntil(this.ngUnsubscribe))
+                .subscribe(function (data) {
+                console.error('onError', data);
+            });
+            this._exclusionProcessStatusChangedSubscribe = this._websocketService
+                .onEvent({
+                domain: this.projectConfigs.getDomain(),
+                service: this.projectConfigs.getService(),
+                primitive: "exclusionProcessStatusChanged"
+            })
+                .pipe(operators.takeUntil(this.ngUnsubscribe))
+                .subscribe(function (event) {
+                var data = event.data;
+                if (_this._exclusionDetails.processId && data.pid === _this._exclusionDetails.processId) {
+                    _this.loadProcessDetails(_this._exclusionDetails);
+                    return;
+                }
+                if (_this._exclusionDetails.recordId && data.recordId === _this._exclusionDetails.recordId) {
+                    _this.loadProcessDetails(_this._exclusionDetails);
+                }
+            });
+        };
         ExclusionDetailsComponent.ctorParameters = function () { return [
             { type: router.Router },
             { type: router.ActivatedRoute },
@@ -601,7 +683,7 @@
         ExclusionDetailsComponent = __decorate([
             core.Component({
                 selector: "s-exclusion-details",
-                template: "<s-sidebar [visible]=\"isVisible\" (visibleChange)=\"closeDetails()\" [header]=\"getSidebarTitle()\">\n    <s-loading-state [loading]=\"isLoading\">\n        <p-panel [showHeader]=\"false\" styleClass=\"s-exclusion-details-record-details-panel\">\n            <div class=\"s-exclusion-details-record-details-container\">\n                <div class=\"s-exclusion-details-record-icon-background\">\n                    <em class=\"far fa-file-alt s-exclusion-details-record-icon\"></em>\n                </div>\n\n                <div class=\"s-exclusion-details-record-details-recordinfo\">\n                    <span class=\"s-exclusion-details-record-details-type\">\n                        {{entityDescription}}\n                    </span>\n                    <span>\n                        {{getRecordDescription()}}\n                    </span>\n                </div>\n\n                <div class=\"s-exclusion-details-record-details-dateinfo\">\n                    <span>\n                        {{getStartDateLabel()}}: {{getInicialDate()}}\n                    </span>\n                    <span *ngIf=\"isFinished()\">\n                        {{getFinishDateLabel()}}: {{getFinishDate()}}\n                    </span>\n                </div>\n            </div>\n        </p-panel>\n\n        <p-panel>\n            <p-header>\n                {{getSummaryLabel()}}\n            </p-header>\n\n            <s-empty-state\n                *ngIf=\"processSummaryData && !processSummaryData.length\"\n                [title]=\"getEmptyStateTitle()\"\n                [description]=\"getEmptyStateDescription()\">\n                [showPrimaryAction]=\"false\"\n            </s-empty-state>\n\n            <p-table\n                [value]=\"processSummaryData\"\n                [columns]=\"processSummaryColumns\"\n                dataKey=\"id\"\n                [lazy]=\"false\"\n                [scrollable]=\"false\"\n                [paginator]=\"false\"\n                *ngIf=\"processSummaryData && processSummaryData.length\">\n\n                <ng-template pTemplate=\"colgroup\" let-columns>\n                    <colgroup>\n                        <col *ngFor=\"let col of columns\"\n                            [style.width]=\"col.width\"\n                        />\n                    </colgroup>\n                </ng-template>\n\n                <ng-template pTemplate=\"header\" let-columns>\n                    <tr>\n                        <th *ngFor=\"let col of columns\"\n                            [id]=\"col.field\"\n                            [ngStyle]=\"col.style\"\n                            [pSortableColumn]=\"col.field\">\n                            <div class=\"senior-header\">\n                                <span class=\"senior-header-title\">{{ col.header }}</span>\n                                <p-sortIcon [field]=\"col.field\" ></p-sortIcon>\n                            </div>\n                        </th>\n                    </tr>\n                </ng-template>\n\n                <ng-template pTemplate=\"body\" let-rowData let-columns=\"columns\">\n                    <tr>\n                        <s-table-columns\n                            [columns]=\"columns\"\n                            [rowValue]=\"rowData\"\n                            [locale]=\"locale\">\n                        </s-table-columns>\n                    </tr>\n                </ng-template>\n            </p-table>\n        </p-panel>\n    </s-loading-state>\n\n    <s-footer>\n        <div class=\"ui-fluid\">\n            <div class=\"ui-g\">\n                <s-button [label]=\"getShowExclusionsButtonLabel()\" (onClick)=\"openExclusions()\"></s-button>\n                <s-button [label]=\"getCloseButtonLabel()\" priority=\"link\" (onClick)=\"closeDetails()\"></s-button>\n            </div>\n        </div>\n    </s-footer>\n</s-sidebar>\n",
+                template: "<s-sidebar [visible]=\"isVisible\" (visibleChange)=\"onVisibilityChanged($event)\" [header]=\"getSidebarTitle()\">\n    <s-loading-state [loading]=\"isLoading\">\n        <p-panel [showHeader]=\"false\" styleClass=\"s-exclusion-details-record-details-panel\">\n            <div class=\"s-exclusion-details-record-details-container\">\n                <div class=\"s-exclusion-details-record-icon-background\">\n                    <em class=\"far fa-file-alt s-exclusion-details-record-icon\"></em>\n                </div>\n\n                <div class=\"s-exclusion-details-record-details-recordinfo\">\n                    <span class=\"s-exclusion-details-record-details-type\">\n                        {{entityDescription}}\n                    </span>\n                    <span>\n                        {{getRecordDescription()}}\n                    </span>\n                </div>\n\n                <div class=\"s-exclusion-details-record-details-dateinfo\">\n                    <span>\n                        {{getStartDateLabel()}}: {{getInicialDate()}}\n                    </span>\n                    <span *ngIf=\"isFinished()\">\n                        {{getFinishDateLabel()}}: {{getFinishDate()}}\n                    </span>\n                </div>\n            </div>\n        </p-panel>\n\n        <p-panel>\n            <p-header>\n                {{getSummaryLabel()}}\n            </p-header>\n\n            <s-empty-state\n                *ngIf=\"processSummaryData && !processSummaryData.length\"\n                [title]=\"getEmptyStateTitle()\"\n                [description]=\"getEmptyStateDescription()\">\n                [showPrimaryAction]=\"false\"\n            </s-empty-state>\n\n            <p-table\n                [value]=\"processSummaryData\"\n                [columns]=\"processSummaryColumns\"\n                dataKey=\"id\"\n                [lazy]=\"false\"\n                [scrollable]=\"false\"\n                [paginator]=\"false\"\n                *ngIf=\"processSummaryData && processSummaryData.length\">\n\n                <ng-template pTemplate=\"colgroup\" let-columns>\n                    <colgroup>\n                        <col *ngFor=\"let col of columns\"\n                            [style.width]=\"col.width\"\n                        />\n                    </colgroup>\n                </ng-template>\n\n                <ng-template pTemplate=\"header\" let-columns>\n                    <tr>\n                        <th *ngFor=\"let col of columns\"\n                            [id]=\"col.field\"\n                            [ngStyle]=\"col.style\"\n                            [pSortableColumn]=\"col.field\">\n                            <div class=\"senior-header\">\n                                <span class=\"senior-header-title\">{{ col.header }}</span>\n                                <p-sortIcon [field]=\"col.field\" ></p-sortIcon>\n                            </div>\n                        </th>\n                    </tr>\n                </ng-template>\n\n                <ng-template pTemplate=\"body\" let-rowData let-columns=\"columns\">\n                    <tr>\n                        <s-table-columns\n                            [columns]=\"columns\"\n                            [rowValue]=\"rowData\"\n                            [locale]=\"locale\">\n                        </s-table-columns>\n                    </tr>\n                </ng-template>\n            </p-table>\n        </p-panel>\n    </s-loading-state>\n\n    <s-footer>\n        <div class=\"ui-fluid\">\n            <div class=\"ui-g\">\n                <s-button [label]=\"getShowExclusionsButtonLabel()\" (onClick)=\"openExclusions()\"></s-button>\n                <s-button [label]=\"getCloseButtonLabel()\" priority=\"link\" (onClick)=\"closeDetails()\"></s-button>\n            </div>\n        </div>\n    </s-footer>\n</s-sidebar>\n",
                 encapsulation: core.ViewEncapsulation.None,
                 styles: [".s-exclusion-details-record-details-panel{margin-bottom:10px}.s-exclusion-details-record-details-container{display:-ms-flexbox;display:flex;-ms-flex-direction:row;flex-direction:row;-ms-flex-align:center;align-items:center}.s-exclusion-details-record-details-recordinfo{display:-ms-flexbox;display:flex;-ms-flex-direction:column;flex-direction:column;margin-left:10px;-ms-flex:1;flex:1}.s-exclusion-details-record-details-dateinfo{display:-ms-flexbox;display:flex;-ms-flex-direction:column;flex-direction:column;margin-left:10px;-ms-flex-align:end;align-items:flex-end;font-size:12px}.s-exclusion-details-record-details-type{color:#999}.s-exclusion-details-record-icon{font-size:22pt;color:#7e8d95}.s-exclusion-details-record-icon-background{display:-ms-flexbox;display:flex;-ms-flex-direction:column;flex-direction:column;-ms-flex-align:center;align-items:center;-ms-flex-pack:center;justify-content:center;padding:16px;background-color:#c1cad1;border-radius:50%;height:60px;width:60px}"]
             })
@@ -741,7 +823,7 @@
     var HTTP_CODE_SERVER_ERROR_START = 500;
     var HTTP_CODE_SERVER_ERROR_END = 600;
     var ExclusionsListComponent = /** @class */ (function () {
-        function ExclusionsListComponent(route, translate, formBuilder, changeDetectorRef, logicalDeleteService, filterService, projectConfigs) {
+        function ExclusionsListComponent(route, translate, formBuilder, changeDetectorRef, logicalDeleteService, filterService, projectConfigs, cdr) {
             this.route = route;
             this.translate = translate;
             this.formBuilder = formBuilder;
@@ -749,6 +831,7 @@
             this.logicalDeleteService = logicalDeleteService;
             this.filterService = filterService;
             this.projectConfigs = projectConfigs;
+            this.cdr = cdr;
             this.currentListParams = { page: 0, size: 10, sort: [], filterData: {} };
             this.showLoader = false;
             this.totalRecords = 0;
@@ -768,27 +851,22 @@
                 .subscribe(function (data) {
                 _this.locale = data.localeConfig;
             });
-            this.route.params
-                .pipe(operators.takeUntil(this.ngUnsubscribe))
-                .subscribe(function (params) {
-                _this.entityName = params.entityName;
-                _this.showBasedOnRoute();
-            });
             this.route.queryParams
                 .pipe(operators.takeUntil(this.ngUnsubscribe))
                 .subscribe(function (queryParams) {
+                _this.entityName = queryParams.entityName;
                 _this.entityDescription = queryParams.entityDescription;
                 _this.processId = queryParams.processId;
-                _this.showBasedOnRoute();
             });
         };
-        ExclusionsListComponent.prototype.showBasedOnRoute = function () {
+        ExclusionsListComponent.prototype.ngAfterViewInit = function () {
             if (this.entityName && this.entityDescription && this.processId) {
                 this.exclusionDetailsComponent.showDetails({
                     processId: this.processId,
                     entityDescription: this.entityDescription,
                     entityName: this.entityName
                 });
+                this.cdr.detectChanges();
             }
         };
         ExclusionsListComponent.prototype.ngOnDestroy = function () {
@@ -823,6 +901,7 @@
                     style: {
                         width: "100px"
                     },
+                    tooltip: this.getColumnStatusTooltip,
                     badgeConfigs: [
                         {
                             enumValue: EnumExclusionProcessStatus.ERROR,
@@ -847,7 +926,7 @@
                     attributes: ["startDate"],
                     header: this.translate.instant(this.projectConfigs.getTranslationPrefix() + ".logical_delete_start"),
                     type: angularComponents.EnumColumnFieldType.DATE,
-                    dateFormat: "DD/MM/YYYY HH:mm",
+                    dateFormat: "DD/MM/YYYY HH:mm:ss",
                     style: {
                         width: "100px"
                     }
@@ -857,13 +936,19 @@
                     attributes: ["finishDate"],
                     header: this.translate.instant(this.projectConfigs.getTranslationPrefix() + ".logical_delete_finish"),
                     type: angularComponents.EnumColumnFieldType.DATE,
-                    dateFormat: "DD/MM/YYYY HH:mm",
+                    dateFormat: "DD/MM/YYYY HH:mm:ss",
                     style: {
                         width: "100px"
                     }
                 }
             ];
         };
+        ExclusionsListComponent.prototype.getColumnStatusTooltip = function (rowValue) {
+            if (rowValue.errorMessage) {
+                return rowValue.errorMessage;
+            }
+            return null;
+        };
         ExclusionsListComponent.prototype.getFilterFields = function () {
             var translationPrefix = this.projectConfigs.getTranslationPrefix();
             return [
@@ -1017,8 +1102,12 @@
             this.searchTokens = this.getFilterTokens();
             var filterQuery = this.getFilterQuery();
             var displayFields = __spread([
-                "recordId"
+                "recordId",
+                "errorMessage"
             ], this.gridColumns.map(function (column) { return column.field; }));
+            if (!sort.length) {
+                sort.push({ field: 'startDate', order: -1 });
+            }
             this.listExclusions({ page: page, size: size, sort: sort, filterQuery: filterQuery, displayFields: displayFields });
         };
         ExclusionsListComponent.prototype.listExclusions = function (params) {
@@ -1068,7 +1157,8 @@
             { type: core.ChangeDetectorRef },
             { type: LogicalDeleteService },
             { type: FilterService },
-            { type: LogicalDeleteConfigService }
+            { type: LogicalDeleteConfigService },
+            { type: core.ChangeDetectorRef }
         ]; };
         __decorate([
             core.ViewChild("exclusionsTable")
@@ -1078,7 +1168,7 @@
         ], ExclusionsListComponent.prototype, "exclusionDetailsComponent", void 0);
         ExclusionsListComponent = ExclusionsListComponent_1 = __decorate([
             core.Component({
-                template: "<div>\n    <form [formGroup]=\"filterFormGroup\" autocomplete=\"off\">\n        <p-panel\n            *sLoadingState=\"showLoader\"\n            styleClass=\"form-group\"\n            [toggleable]=\"true\"\n            [(collapsed)]=\"filtersPanelCollapsed\"\n            (onAfterToggle)=\"focusInput('description')\"\n        >\n            <p-header>\n                {{ getFiltersTitle() }}\n                <s-token-list\n                    [tokens]=\"searchTokens\"\n                    (tokenRemoved)=\"onRemoveToken($event)\"\n                    [removableTokens]=\"true\"\n                ></s-token-list>\n            </p-header>\n            <div>\n                <s-dynamic-form\n                    [fields]=\"filterFields\"\n                    [form]=\"filterFormGroup\"\n                    [errorMessages]=\"{ pattern: getErrorInvalid() }\"\n                ></s-dynamic-form>\n            </div>\n            <p-footer>\n                <div class=\"ui-g\">\n                    <div class=\"ui-g-12\">\n                        <button\n                            id=\"filter-button\"\n                            class=\"ui-button\"\n                            type=\"submit\"\n                            pButton\n                            [label]=\"getFilterButtonTitle()\"\n                            (click)=\"onSearch()\"\n                        ></button>\n                        <button\n                            id=\"clear-button\"\n                            class=\"ui-button ui-button-link\"\n                            type=\"button\"\n                            pButton\n                            [label]=\"getClearButtonTitle()\"\n                            (click)=\"onClear()\"\n                        ></button>\n                    </div>\n                </div>\n            </p-footer>\n        </p-panel>\n    </form>\n    <p-panel *sLoadingState=\"showLoader\">\n        <p-header>\n            {{ getTitle() }}\n        </p-header>\n        <ng-container>\n            <s-empty-state\n                *ngIf=\"serverError && !showLoader\"\n                iconClass=\"fa fa-exclamation-triangle\"\n                title=\"{{ getErrorServerTitle() | translate }}\"\n                primaryActionLabel=\"{{ 'error_server_try_again' | translate }}\"\n                (primaryAction)=\"resetGrid()\"\n                description=\"{{ getErrorServerDescription() | translate }}\"\n            ></s-empty-state>\n\n            <s-empty-state\n                *ngIf=\"!showLoader && !serverError && totalRecords === 0\"\n                [title]=\"getEmptyStateTitle()\"\n                [showPrimaryAction]=\"false\"\n                [description]=\"getEmptyStateDescription()\"\n            ></s-empty-state>\n\n            <div class=\"ui-g\">\n                <div class=\"ui-g-12\">\n                    <p-table\n                        #exclusionsTable\n                        id=\"exclusionsTable\"\n                        [hidden]=\"totalRecords === 0 || serverError\"\n                        [value]=\"gridData\"\n                        [columns]=\"gridColumns\"\n                        dataKey=\"id\"\n                        [lazy]=\"true\"\n                        [scrollable]=\"true\"\n                        [resizableColumns]=\"true\"\n                        sortMode=\"multiple\"\n                        [paginator]=\"true\"\n                        [totalRecords]=\"totalRecords\"\n                        [rows]=\"10\"\n                        rows=\"10\"\n                        [rowsPerPageOptions]=\"[10, 20, 50, 100]\"\n                        (onLazyLoad)=\"onGridChange($event)\"\n                    >\n                        <ng-template pTemplate=\"colgroup\" let-columns>\n                            <colgroup>\n                                <col\n                                    *ngFor=\"let col of columns\"\n                                    [style.width]=\"col.width\"\n                                />\n                            </colgroup>\n                        </ng-template>\n\n                        <ng-template\n                            pTemplate=\"header\"\n                            let-columns\n                        >\n                            <tr>\n                                <th *ngFor=\"let col of columns\"\n                                    [id]=\"col.field\"\n                                    [pSortableColumn]=\"col.field\"\n                                    [ngStyle]=\"col.style\"\n                                    pResizableColumn\n                                >\n                                    <div class=\"senior-header\">\n                                        <span class=\"senior-header-title\">\n                                            {{ col.header }}\n                                        </span>\n                                        <p-sortIcon [field]=\"col.field\"></p-sortIcon>\n                                    </div>\n                                </th>\n                                <th id=\"action-column\" style=\"width: 100px\">\n                                    <div class=\"senior-header\">\n                                        <span class=\"senior-header-title\">{{ getActionsColumnLabel() }}</span>\n                                    </div>\n                                </th>\n                            </tr>\n                        </ng-template>\n\n                        <ng-template pTemplate=\"body\" let-rowData let-columns=\"columns\">\n                            <tr [pSelectableRow]=\"rowData\">\n                                <s-table-columns\n                                    [columns]=\"columns\"\n                                    [rowValue]=\"rowData\"\n                                    [locale]=\"locale\">\n                                </s-table-columns>\n                                <td style=\"width: 100px\">\n                                    <s-button\n                                        id=\"details-button\"\n                                        priority=\"default\"\n                                        [label]=\"getDetailsButtonTitle()\"\n                                        [auxiliary]=\"true\"\n                                        (onClick)=\"onClickDetails(rowData)\">\n                                    </s-button>\n                                </td>\n                            </tr>\n                        </ng-template>\n\n                        <ng-template pTemplate=\"paginatorright\">\n                            <s-table-paging\n                                [table]=\"exclusionsTable\"\n                                [totalRecords]=\"totalRecords\"\n                            ></s-table-paging>\n                        </ng-template>\n                    </p-table>\n                </div>\n            </div>\n        </ng-container>\n    </p-panel>\n</div>\n\n<s-exclusion-details></s-exclusion-details>\n",
+                template: "<div>\n    <form [formGroup]=\"filterFormGroup\" autocomplete=\"off\">\n        <p-panel\n            *sLoadingState=\"showLoader\"\n            styleClass=\"form-group\"\n            [toggleable]=\"true\"\n            [(collapsed)]=\"filtersPanelCollapsed\"\n            (onAfterToggle)=\"focusInput('description')\"\n        >\n            <p-header>\n                {{ getFiltersTitle() }}\n                <s-token-list\n                    [tokens]=\"searchTokens\"\n                    (tokenRemoved)=\"onRemoveToken($event)\"\n                    [removableTokens]=\"true\"\n                ></s-token-list>\n            </p-header>\n            <div>\n                <s-dynamic-form\n                    [fields]=\"filterFields\"\n                    [form]=\"filterFormGroup\"\n                    [errorMessages]=\"{ pattern: getErrorInvalid() }\"\n                ></s-dynamic-form>\n            </div>\n            <p-footer>\n                <div class=\"ui-g\">\n                    <div class=\"ui-g-12\">\n                        <button\n                            id=\"filter-button\"\n                            class=\"ui-button\"\n                            type=\"submit\"\n                            pButton\n                            [label]=\"getFilterButtonTitle()\"\n                            (click)=\"onSearch()\"\n                        ></button>\n                        <button\n                            id=\"clear-button\"\n                            class=\"ui-button ui-button-link\"\n                            type=\"button\"\n                            pButton\n                            [label]=\"getClearButtonTitle()\"\n                            (click)=\"onClear()\"\n                        ></button>\n                    </div>\n                </div>\n            </p-footer>\n        </p-panel>\n    </form>\n    <p-panel *sLoadingState=\"showLoader\">\n        <p-header>\n            {{ getTitle() }}\n        </p-header>\n        <ng-container>\n            <s-empty-state\n                *ngIf=\"serverError && !showLoader\"\n                iconClass=\"fa fa-exclamation-triangle\"\n                title=\"{{ getErrorServerTitle() | translate }}\"\n                primaryActionLabel=\"{{ 'error_server_try_again' | translate }}\"\n                (primaryAction)=\"resetGrid()\"\n                description=\"{{ getErrorServerDescription() | translate }}\"\n            ></s-empty-state>\n\n            <s-empty-state\n                *ngIf=\"!showLoader && !serverError && totalRecords === 0\"\n                [title]=\"getEmptyStateTitle()\"\n                [showPrimaryAction]=\"false\"\n                [description]=\"getEmptyStateDescription()\"\n            ></s-empty-state>\n\n            <div class=\"ui-g\">\n                <div class=\"ui-g-12\">\n                    <p-table\n                        #exclusionsTable\n                        id=\"exclusionsTable\"\n                        [hidden]=\"totalRecords === 0 || serverError\"\n                        [value]=\"gridData\"\n                        [columns]=\"gridColumns\"\n                        dataKey=\"id\"\n                        [lazy]=\"true\"\n                        [scrollable]=\"true\"\n                        [resizableColumns]=\"true\"\n                        sortMode=\"multiple\"\n                        [paginator]=\"true\"\n                        [totalRecords]=\"totalRecords\"\n                        [rows]=\"10\"\n                        sortField=\"startDate\"\n                        sortOrder=\"-1\"\n                        rows=\"10\"\n                        [rowsPerPageOptions]=\"[10, 20, 50, 100]\"\n                        (onLazyLoad)=\"onGridChange($event)\"\n                    >\n                        <ng-template pTemplate=\"colgroup\" let-columns>\n                            <colgroup>\n                                <col\n                                    *ngFor=\"let col of columns\"\n                                    [style.width]=\"col.width\"\n                                />\n                            </colgroup>\n                        </ng-template>\n\n                        <ng-template\n                            pTemplate=\"header\"\n                            let-columns\n                        >\n                            <tr>\n                                <th *ngFor=\"let col of columns\"\n                                    [id]=\"col.field\"\n                                    [pSortableColumn]=\"col.field\"\n                                    [ngStyle]=\"col.style\"\n                                    pResizableColumn\n                                >\n                                    <div class=\"senior-header\">\n                                        <span class=\"senior-header-title\">\n                                            {{ col.header }}\n                                        </span>\n                                        <p-sortIcon [field]=\"col.field\"></p-sortIcon>\n                                    </div>\n                                </th>\n                                <th id=\"action-column\" style=\"width: 100px\">\n                                    <div class=\"senior-header\">\n                                        <span class=\"senior-header-title\">{{ getActionsColumnLabel() }}</span>\n                                    </div>\n                                </th>\n                            </tr>\n                        </ng-template>\n\n                        <ng-template pTemplate=\"body\" let-rowData let-columns=\"columns\">\n                            <tr [pSelectableRow]=\"rowData\">\n                                <s-table-columns\n                                    [columns]=\"columns\"\n                                    [rowValue]=\"rowData\"\n                                    [locale]=\"locale\">\n                                </s-table-columns>\n                                <td style=\"width: 100px\">\n                                    <s-button\n                                        id=\"details-button\"\n                                        priority=\"default\"\n                                        [label]=\"getDetailsButtonTitle()\"\n                                        [auxiliary]=\"true\"\n                                        (onClick)=\"onClickDetails(rowData)\">\n                                    </s-button>\n                                </td>\n                            </tr>\n                        </ng-template>\n\n                        <ng-template pTemplate=\"paginatorright\">\n                            <s-table-paging\n                                [table]=\"exclusionsTable\"\n                                [totalRecords]=\"totalRecords\"\n                            ></s-table-paging>\n                        </ng-template>\n                    </p-table>\n                </div>\n            </div>\n        </ng-container>\n    </p-panel>\n</div>\n\n<s-exclusion-details></s-exclusion-details>\n",
                 providers: []
             })
         ], ExclusionsListComponent);
@@ -1167,7 +1257,7 @@
             },
             children: [
                 {
-                    path: ":entityName",
+                    path: "",
                     component: ExclusionsListComponent
                 }
             ]