@c8y/ngx-components 1017.0.78 → 1017.0.80

package/fesm2020/c8y-ngx-components-register-device.mjs

@@ -1,15 +1,15 @@
 import * as i0 from '@angular/core';
 import { Injectable, Component, ChangeDetectionStrategy, InjectionToken, InjectFlags, ViewChild, Input, NgModule } from '@angular/core';
-import * as i1$1 from 'ngx-bootstrap/modal';
+import * as i1$2 from 'ngx-bootstrap/modal';
 import { __decorate, __metadata } from 'tslib';
-import * as i2$1 from '@c8y/ngx-components';
+import * as i2 from '@c8y/ngx-components';
 import { gettext, memoize, hookGeneric, fromTriggerOnce, Status, NavigatorNode, C8yStepper, CommonModule, CoreModule, StepperModule, DynamicFormsModule, hookNavigator, DeviceBootstrapRealtimeService } from '@c8y/ngx-components';
 import * as i6$1 from '@angular/forms';
 import { FormGroup } from '@angular/forms';
 import { Subject, BehaviorSubject, from, forkJoin, defer, Observable } from 'rxjs';
 import { takeUntil, finalize, mergeMap, takeLast, map, filter, switchMap, tap, shareReplay, startWith } from 'rxjs/operators';
-import * as i2 from '@c8y/client';
-import { DeviceRegistrationStatus, DeviceRegistrationSecurityMode } from '@c8y/client';
+import * as i1$1 from '@c8y/client';
+import { DeviceRegistrationStatus, DeviceRegistrationSecurityMode, ApplicationType } from '@c8y/client';
 import * as i1 from '@angular/router';
 import { RouterModule } from '@angular/router';
 import { get, pick, sortBy, flatMap } from 'lodash-es';
@@ -197,14 +197,14 @@ class RegisterDeviceService {
         return items;
     }
 }
-RegisterDeviceService.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.0.6", ngImport: i0, type: RegisterDeviceService, deps: [{ token: i1.Router }, { token: i2.DeviceRegistrationService }, { token: i2$1.AlertService }], target: i0.ɵɵFactoryTarget.Injectable });
+RegisterDeviceService.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.0.6", ngImport: i0, type: RegisterDeviceService, deps: [{ token: i1.Router }, { token: i1$1.DeviceRegistrationService }, { token: i2.AlertService }], target: i0.ɵɵFactoryTarget.Injectable });
 RegisterDeviceService.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "14.0.6", ngImport: i0, type: RegisterDeviceService, providedIn: 'root' });
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.0.6", ngImport: i0, type: RegisterDeviceService, decorators: [{
             type: Injectable,
             args: [{
                     providedIn: 'root'
                 }]
-        }], ctorParameters: function () { return [{ type: i1.Router }, { type: i2.DeviceRegistrationService }, { type: i2$1.AlertService }]; } });
+        }], ctorParameters: function () { return [{ type: i1.Router }, { type: i1$1.DeviceRegistrationService }, { type: i2.AlertService }]; } });
 
 class GeneralDeviceRegistrationComponent {
     constructor(tenantUIService, tenantService, registerDeviceService, inventoryService, cd, bsModalRef, gainsightService) {
@@ -390,8 +390,8 @@ class GeneralDeviceRegistrationComponent {
         return defer(() => from(this.inventoryService.listQuery({ __filter: { __has: 'c8y_IsDeviceGroup' }, __orderby: [{ name: 1 }] }, { ...this.FILTER }))).pipe(shareReplay(1));
     }
 }
-GeneralDeviceRegistrationComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.0.6", ngImport: i0, type: GeneralDeviceRegistrationComponent, deps: [{ token: i2$1.TenantUiService }, { token: i2.TenantService }, { token: RegisterDeviceService }, { token: i2.InventoryService }, { token: i0.ChangeDetectorRef }, { token: i1$1.BsModalRef }, { token: i2$1.GainsightService }], target: i0.ɵɵFactoryTarget.Component });
-GeneralDeviceRegistrationComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.0.6", type: GeneralDeviceRegistrationComponent, selector: "c8y-general-device-registration", ngImport: i0, template: "<c8y-modal\n  [title]=\"'Register devices' | translate\"\n  [headerClasses]=\"'dialog-header'\"\n  [customFooter]=\"true\"\n>\n  <ng-container c8y-modal-title>\n    <span [c8yIcon]=\"'c8y-device-connect'\"></span>\n  </ng-container>\n  <c8y-stepper [hideStepProgress]=\"true\" linear c8y-modal-body>\n    <cdk-step [stepControl]=\"form\">\n      <div class=\"p-16 text-center sticky-top separator-bottom bg-component\">\n        <p class=\"text-medium text-16\" translate>Register a general device</p>\n      </div>\n      <div>\n        <formly-form\n          [form]=\"form\"\n          [fields]=\"fields\"\n          [model]=\"model\"\n          [options]=\"options\"\n          class=\"formly-group-array-cols d-block p-24 min-height-fit p-r-8\"\n        ></formly-form>\n      </div>\n      <c8y-stepper-buttons\n        (onNext)=\"create($event)\"\n        (onCancel)=\"bsModalRef.hide()\"\n        [showButtons]=\"{ cancel: true, next: true }\"\n        [disabled]=\"!form?.valid\"\n        [pending]=\"isLoading$ | async\"\n        class=\"sticky-bottom d-block p-t-16 p-b-16 separator-top bg-level-0\"\n      ></c8y-stepper-buttons>\n    </cdk-step>\n    <cdk-step state=\"final\">\n      <div class=\"p-24 min-height-fit\">\n        <c8y-operation-result\n          *ngIf=\"success.length === 1 && failed.length === 0\"\n          text=\"{{ 'Device registered' | translate }}\"\n          [size]=\"84\"\n          [vertical]=\"true\"\n          type=\"success\"\n          class=\"lead\"\n        ></c8y-operation-result>\n        <c8y-operation-result\n          *ngIf=\"success.length === 0 && failed.length === 1\"\n          text=\"{{ 'Failed to register device' | translate }}\"\n          [size]=\"84\"\n          [vertical]=\"true\"\n          type=\"error\"\n          class=\"lead\"\n        ></c8y-operation-result>\n\n        <ng-container *ngIf=\"success.length > 1 || failed.length > 1\">\n          <c8y-operation-result\n            *ngIf=\"failed.length === 0\"\n            [text]=\"\n              '{{ successfulDevicesCount }} devices registered'\n                | translate: { successfulDevicesCount: success.length }\n            \"\n            [size]=\"84\"\n            [vertical]=\"true\"\n            type=\"success\"\n            class=\"lead\"\n          ></c8y-operation-result>\n          <c8y-operation-result\n            *ngIf=\"success.length === 0\"\n            [text]=\"\n              '{{ failedDevicesCount }} devices failed to register'\n                | translate: { failedDevicesCount: failed.length }\n            \"\n            [size]=\"84\"\n            [vertical]=\"true\"\n            type=\"error\"\n            class=\"lead\"\n          ></c8y-operation-result>\n        </ng-container>\n\n        <div *ngIf=\"success.length > 0 && failed.length > 0\" class=\"p-l-24 p-r-24 text-center\">\n          <c8y-operation-result\n            text=\"{{ 'Several devices failed to register' | translate }}\"\n            [size]=\"84\"\n            [vertical]=\"true\"\n            type=\"error\"\n            class=\"lead\"\n          ></c8y-operation-result>\n          <p\n            ngNonBindable\n            translate\n            [translateParams]=\"{ count: failed.length, total: failed.length + success.length }\"\n            class=\"p-b-16 text-danger\"\n          >\n            Registration failed for {{ count }} devices out of {{ total }}.\n          </p>\n        </div>\n\n        <div class=\"m-b-8 p-l-24 p-r-24\" *ngIf=\"success.length > 0\" translate>\n          Turn on the registered device(s) and wait for connection(s) to be established. Once a\n          device is connected, its status will change to \"Pending acceptance\". You will need to\n          approve it by clicking on the \"Accept\" button.\n        </div>\n\n        <c8y-list-group class=\"separator-top m-t-16\">\n          <c8y-li *ngFor=\"let fail of failed\">\n            <c8y-li-icon class=\"text-danger\" [icon]=\"'ban'\"></c8y-li-icon>\n            <p>{{ fail?.id }}</p>\n            <small>{{ fail?.message | translate }}</small>\n            <c8y-li-collapse>\n              <pre><code>{{ fail?.details | json }}</code></pre>\n            </c8y-li-collapse>\n          </c8y-li>\n\n          <c8y-li *ngFor=\"let s of success\">\n            <c8y-li-icon class=\"text-success\" [icon]=\"'check-circle'\"></c8y-li-icon>\n            {{ s?.id }}\n          </c8y-li>\n        </c8y-list-group>\n      </div>\n      <c8y-stepper-buttons\n        class=\"sticky-bottom d-block p-t-16 p-b-16 separator-top bg-level-0\"\n        (onCustom)=\"bsModalRef.hide()\"\n        (onBack)=\"fixErrors($event, failed)\"\n        [showButtons]=\"{ back: failed.length > 0, custom: true }\"\n        [labels]=\"{ back: 'Fix errors', custom: 'Close' }\"\n      ></c8y-stepper-buttons>\n    </cdk-step>\n  </c8y-stepper>\n</c8y-modal>\n", dependencies: [{ kind: "directive", type: i2$1.IconDirective, selector: "[c8yIcon]", inputs: ["c8yIcon"] }, { kind: "directive", type: i2$1.C8yTranslateDirective, selector: "[translate],[ngx-translate]" }, { kind: "directive", type: i5.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i5.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: i2$1.OperationResultComponent, selector: "c8y-operation-result", inputs: ["text", "vertical", "size", "type"] }, { kind: "component", type: i2$1.ModalComponent, selector: "c8y-modal", inputs: ["disabled", "close", "dismiss", "title", "body", "customFooter", "headerClasses", "labels"], outputs: ["onDismiss", "onClose"] }, { kind: "component", type: i2$1.C8yStepper, selector: "c8y-stepper", inputs: ["disableDefaultIcons", "disableProgressButtons", "customClasses", "hideStepProgress", "useStepLabelsAsTitlesOnly"], outputs: ["onStepChange"] }, { kind: "component", type: i6.CdkStep, selector: "cdk-step", inputs: ["stepControl", "label", "errorMessage", "aria-label", "aria-labelledby", "state", "editable", "optional", "completed", "hasError"], outputs: ["interacted"], exportAs: ["cdkStep"] }, { kind: "component", type: i2$1.C8yStepperButtons, selector: "c8y-stepper-buttons", inputs: ["labels", "pending", "disabled", "showButtons"], outputs: ["onCancel", "onNext", "onBack", "onCustom"] }, { kind: "component", type: i2$1.ListGroupComponent, selector: "c8y-list-group" }, { kind: "component", type: i2$1.ListItemComponent, selector: "c8y-list-item, c8y-li", inputs: ["active", "emptyActions", "collapsed", "selectable"], outputs: ["collapsedChange"] }, { kind: "component", type: i2$1.ListItemIconComponent, selector: "c8y-list-item-icon, c8y-li-icon", inputs: ["icon", "status"] }, { kind: "component", type: i2$1.ListItemCollapseComponent, selector: "c8y-list-item-collapse, c8y-li-collapse", inputs: ["collapseWay"] }, { kind: "component", type: i7.FormlyForm, selector: "formly-form", inputs: ["model", "fields", "options", "form"], outputs: ["modelChange"] }, { kind: "pipe", type: i2$1.C8yTranslatePipe, name: "translate" }, { kind: "pipe", type: i5.AsyncPipe, name: "async" }, { kind: "pipe", type: i5.JsonPipe, name: "json" }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
+GeneralDeviceRegistrationComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.0.6", ngImport: i0, type: GeneralDeviceRegistrationComponent, deps: [{ token: i2.TenantUiService }, { token: i1$1.TenantService }, { token: RegisterDeviceService }, { token: i1$1.InventoryService }, { token: i0.ChangeDetectorRef }, { token: i1$2.BsModalRef }, { token: i2.GainsightService }], target: i0.ɵɵFactoryTarget.Component });
+GeneralDeviceRegistrationComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.0.6", type: GeneralDeviceRegistrationComponent, selector: "c8y-general-device-registration", ngImport: i0, template: "<c8y-modal\n  [title]=\"'Register devices' | translate\"\n  [headerClasses]=\"'dialog-header'\"\n  [customFooter]=\"true\"\n>\n  <ng-container c8y-modal-title>\n    <span [c8yIcon]=\"'c8y-device-connect'\"></span>\n  </ng-container>\n  <c8y-stepper [hideStepProgress]=\"true\" linear c8y-modal-body>\n    <cdk-step [stepControl]=\"form\">\n      <div class=\"p-16 text-center sticky-top separator-bottom bg-component\">\n        <p class=\"text-medium text-16\" translate>Register a general device</p>\n      </div>\n      <div>\n        <formly-form\n          [form]=\"form\"\n          [fields]=\"fields\"\n          [model]=\"model\"\n          [options]=\"options\"\n          class=\"formly-group-array-cols d-block p-24 min-height-fit p-r-8\"\n        ></formly-form>\n      </div>\n      <c8y-stepper-buttons\n        (onNext)=\"create($event)\"\n        (onCancel)=\"bsModalRef.hide()\"\n        [showButtons]=\"{ cancel: true, next: true }\"\n        [disabled]=\"!form?.valid\"\n        [pending]=\"isLoading$ | async\"\n        class=\"sticky-bottom d-block p-t-16 p-b-16 separator-top bg-level-0\"\n      ></c8y-stepper-buttons>\n    </cdk-step>\n    <cdk-step state=\"final\">\n      <div class=\"p-24 min-height-fit\">\n        <c8y-operation-result\n          *ngIf=\"success.length === 1 && failed.length === 0\"\n          text=\"{{ 'Device registered' | translate }}\"\n          [size]=\"84\"\n          [vertical]=\"true\"\n          type=\"success\"\n          class=\"lead\"\n        ></c8y-operation-result>\n        <c8y-operation-result\n          *ngIf=\"success.length === 0 && failed.length === 1\"\n          text=\"{{ 'Failed to register device' | translate }}\"\n          [size]=\"84\"\n          [vertical]=\"true\"\n          type=\"error\"\n          class=\"lead\"\n        ></c8y-operation-result>\n\n        <ng-container *ngIf=\"success.length > 1 || failed.length > 1\">\n          <c8y-operation-result\n            *ngIf=\"failed.length === 0\"\n            [text]=\"\n              '{{ successfulDevicesCount }} devices registered'\n                | translate: { successfulDevicesCount: success.length }\n            \"\n            [size]=\"84\"\n            [vertical]=\"true\"\n            type=\"success\"\n            class=\"lead\"\n          ></c8y-operation-result>\n          <c8y-operation-result\n            *ngIf=\"success.length === 0\"\n            [text]=\"\n              '{{ failedDevicesCount }} devices failed to register'\n                | translate: { failedDevicesCount: failed.length }\n            \"\n            [size]=\"84\"\n            [vertical]=\"true\"\n            type=\"error\"\n            class=\"lead\"\n          ></c8y-operation-result>\n        </ng-container>\n\n        <div *ngIf=\"success.length > 0 && failed.length > 0\" class=\"p-l-24 p-r-24 text-center\">\n          <c8y-operation-result\n            text=\"{{ 'Several devices failed to register' | translate }}\"\n            [size]=\"84\"\n            [vertical]=\"true\"\n            type=\"error\"\n            class=\"lead\"\n          ></c8y-operation-result>\n          <p\n            ngNonBindable\n            translate\n            [translateParams]=\"{ count: failed.length, total: failed.length + success.length }\"\n            class=\"p-b-16 text-danger\"\n          >\n            Registration failed for {{ count }} devices out of {{ total }}.\n          </p>\n        </div>\n\n        <div class=\"m-b-8 p-l-24 p-r-24\" *ngIf=\"success.length > 0\" translate>\n          Turn on the registered device(s) and wait for connection(s) to be established. Once a\n          device is connected, its status will change to \"Pending acceptance\". You will need to\n          approve it by clicking on the \"Accept\" button.\n        </div>\n\n        <c8y-list-group class=\"separator-top m-t-16\">\n          <c8y-li *ngFor=\"let fail of failed\">\n            <c8y-li-icon class=\"text-danger\" [icon]=\"'ban'\"></c8y-li-icon>\n            <p>{{ fail?.id }}</p>\n            <small>{{ fail?.message | translate }}</small>\n            <c8y-li-collapse>\n              <pre><code>{{ fail?.details | json }}</code></pre>\n            </c8y-li-collapse>\n          </c8y-li>\n\n          <c8y-li *ngFor=\"let s of success\">\n            <c8y-li-icon class=\"text-success\" [icon]=\"'check-circle'\"></c8y-li-icon>\n            {{ s?.id }}\n          </c8y-li>\n        </c8y-list-group>\n      </div>\n      <c8y-stepper-buttons\n        class=\"sticky-bottom d-block p-t-16 p-b-16 separator-top bg-level-0\"\n        (onCustom)=\"bsModalRef.hide()\"\n        (onBack)=\"fixErrors($event, failed)\"\n        [showButtons]=\"{ back: failed.length > 0, custom: true }\"\n        [labels]=\"{ back: 'Fix errors', custom: 'Close' }\"\n      ></c8y-stepper-buttons>\n    </cdk-step>\n  </c8y-stepper>\n</c8y-modal>\n", dependencies: [{ kind: "directive", type: i2.IconDirective, selector: "[c8yIcon]", inputs: ["c8yIcon"] }, { kind: "directive", type: i2.C8yTranslateDirective, selector: "[translate],[ngx-translate]" }, { kind: "directive", type: i5.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i5.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: i2.OperationResultComponent, selector: "c8y-operation-result", inputs: ["text", "vertical", "size", "type"] }, { kind: "component", type: i2.ModalComponent, selector: "c8y-modal", inputs: ["disabled", "close", "dismiss", "title", "body", "customFooter", "headerClasses", "labels"], outputs: ["onDismiss", "onClose"] }, { kind: "component", type: i2.C8yStepper, selector: "c8y-stepper", inputs: ["disableDefaultIcons", "disableProgressButtons", "customClasses", "hideStepProgress", "useStepLabelsAsTitlesOnly"], outputs: ["onStepChange"] }, { kind: "component", type: i6.CdkStep, selector: "cdk-step", inputs: ["stepControl", "label", "errorMessage", "aria-label", "aria-labelledby", "state", "editable", "optional", "completed", "hasError"], outputs: ["interacted"], exportAs: ["cdkStep"] }, { kind: "component", type: i2.C8yStepperButtons, selector: "c8y-stepper-buttons", inputs: ["labels", "pending", "disabled", "showButtons"], outputs: ["onCancel", "onNext", "onBack", "onCustom"] }, { kind: "component", type: i2.ListGroupComponent, selector: "c8y-list-group" }, { kind: "component", type: i2.ListItemComponent, selector: "c8y-list-item, c8y-li", inputs: ["active", "emptyActions", "collapsed", "selectable"], outputs: ["collapsedChange"] }, { kind: "component", type: i2.ListItemIconComponent, selector: "c8y-list-item-icon, c8y-li-icon", inputs: ["icon", "status"] }, { kind: "component", type: i2.ListItemCollapseComponent, selector: "c8y-list-item-collapse, c8y-li-collapse", inputs: ["collapseWay"] }, { kind: "component", type: i7.FormlyForm, selector: "formly-form", inputs: ["model", "fields", "options", "form"], outputs: ["modelChange"] }, { kind: "pipe", type: i2.C8yTranslatePipe, name: "translate" }, { kind: "pipe", type: i5.AsyncPipe, name: "async" }, { kind: "pipe", type: i5.JsonPipe, name: "json" }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
 __decorate([
     memoize(),
     __metadata("design:type", Function),
@@ -413,7 +413,7 @@ __decorate([
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.0.6", ngImport: i0, type: GeneralDeviceRegistrationComponent, decorators: [{
             type: Component,
             args: [{ selector: 'c8y-general-device-registration', changeDetection: ChangeDetectionStrategy.OnPush, template: "<c8y-modal\n  [title]=\"'Register devices' | translate\"\n  [headerClasses]=\"'dialog-header'\"\n  [customFooter]=\"true\"\n>\n  <ng-container c8y-modal-title>\n    <span [c8yIcon]=\"'c8y-device-connect'\"></span>\n  </ng-container>\n  <c8y-stepper [hideStepProgress]=\"true\" linear c8y-modal-body>\n    <cdk-step [stepControl]=\"form\">\n      <div class=\"p-16 text-center sticky-top separator-bottom bg-component\">\n        <p class=\"text-medium text-16\" translate>Register a general device</p>\n      </div>\n      <div>\n        <formly-form\n          [form]=\"form\"\n          [fields]=\"fields\"\n          [model]=\"model\"\n          [options]=\"options\"\n          class=\"formly-group-array-cols d-block p-24 min-height-fit p-r-8\"\n        ></formly-form>\n      </div>\n      <c8y-stepper-buttons\n        (onNext)=\"create($event)\"\n        (onCancel)=\"bsModalRef.hide()\"\n        [showButtons]=\"{ cancel: true, next: true }\"\n        [disabled]=\"!form?.valid\"\n        [pending]=\"isLoading$ | async\"\n        class=\"sticky-bottom d-block p-t-16 p-b-16 separator-top bg-level-0\"\n      ></c8y-stepper-buttons>\n    </cdk-step>\n    <cdk-step state=\"final\">\n      <div class=\"p-24 min-height-fit\">\n        <c8y-operation-result\n          *ngIf=\"success.length === 1 && failed.length === 0\"\n          text=\"{{ 'Device registered' | translate }}\"\n          [size]=\"84\"\n          [vertical]=\"true\"\n          type=\"success\"\n          class=\"lead\"\n        ></c8y-operation-result>\n        <c8y-operation-result\n          *ngIf=\"success.length === 0 && failed.length === 1\"\n          text=\"{{ 'Failed to register device' | translate }}\"\n          [size]=\"84\"\n          [vertical]=\"true\"\n          type=\"error\"\n          class=\"lead\"\n        ></c8y-operation-result>\n\n        <ng-container *ngIf=\"success.length > 1 || failed.length > 1\">\n          <c8y-operation-result\n            *ngIf=\"failed.length === 0\"\n            [text]=\"\n              '{{ successfulDevicesCount }} devices registered'\n                | translate: { successfulDevicesCount: success.length }\n            \"\n            [size]=\"84\"\n            [vertical]=\"true\"\n            type=\"success\"\n            class=\"lead\"\n          ></c8y-operation-result>\n          <c8y-operation-result\n            *ngIf=\"success.length === 0\"\n            [text]=\"\n              '{{ failedDevicesCount }} devices failed to register'\n                | translate: { failedDevicesCount: failed.length }\n            \"\n            [size]=\"84\"\n            [vertical]=\"true\"\n            type=\"error\"\n            class=\"lead\"\n          ></c8y-operation-result>\n        </ng-container>\n\n        <div *ngIf=\"success.length > 0 && failed.length > 0\" class=\"p-l-24 p-r-24 text-center\">\n          <c8y-operation-result\n            text=\"{{ 'Several devices failed to register' | translate }}\"\n            [size]=\"84\"\n            [vertical]=\"true\"\n            type=\"error\"\n            class=\"lead\"\n          ></c8y-operation-result>\n          <p\n            ngNonBindable\n            translate\n            [translateParams]=\"{ count: failed.length, total: failed.length + success.length }\"\n            class=\"p-b-16 text-danger\"\n          >\n            Registration failed for {{ count }} devices out of {{ total }}.\n          </p>\n        </div>\n\n        <div class=\"m-b-8 p-l-24 p-r-24\" *ngIf=\"success.length > 0\" translate>\n          Turn on the registered device(s) and wait for connection(s) to be established. Once a\n          device is connected, its status will change to \"Pending acceptance\". You will need to\n          approve it by clicking on the \"Accept\" button.\n        </div>\n\n        <c8y-list-group class=\"separator-top m-t-16\">\n          <c8y-li *ngFor=\"let fail of failed\">\n            <c8y-li-icon class=\"text-danger\" [icon]=\"'ban'\"></c8y-li-icon>\n            <p>{{ fail?.id }}</p>\n            <small>{{ fail?.message | translate }}</small>\n            <c8y-li-collapse>\n              <pre><code>{{ fail?.details | json }}</code></pre>\n            </c8y-li-collapse>\n          </c8y-li>\n\n          <c8y-li *ngFor=\"let s of success\">\n            <c8y-li-icon class=\"text-success\" [icon]=\"'check-circle'\"></c8y-li-icon>\n            {{ s?.id }}\n          </c8y-li>\n        </c8y-list-group>\n      </div>\n      <c8y-stepper-buttons\n        class=\"sticky-bottom d-block p-t-16 p-b-16 separator-top bg-level-0\"\n        (onCustom)=\"bsModalRef.hide()\"\n        (onBack)=\"fixErrors($event, failed)\"\n        [showButtons]=\"{ back: failed.length > 0, custom: true }\"\n        [labels]=\"{ back: 'Fix errors', custom: 'Close' }\"\n      ></c8y-stepper-buttons>\n    </cdk-step>\n  </c8y-stepper>\n</c8y-modal>\n" }]
-        }], ctorParameters: function () { return [{ type: i2$1.TenantUiService }, { type: i2.TenantService }, { type: RegisterDeviceService }, { type: i2.InventoryService }, { type: i0.ChangeDetectorRef }, { type: i1$1.BsModalRef }, { type: i2$1.GainsightService }]; }, propDecorators: { canLoadTenants$: [], getTenants$: [], getGroups$: [] } });
+        }], ctorParameters: function () { return [{ type: i2.TenantUiService }, { type: i1$1.TenantService }, { type: RegisterDeviceService }, { type: i1$1.InventoryService }, { type: i0.ChangeDetectorRef }, { type: i1$2.BsModalRef }, { type: i2.GainsightService }]; }, propDecorators: { canLoadTenants$: [], getTenants$: [], getGroups$: [] } });
 
 class GeneralDeviceRegistrationButtonComponent {
     constructor(modalService) {
@@ -428,12 +428,12 @@ class GeneralDeviceRegistrationButtonComponent {
         });
     }
 }
-GeneralDeviceRegistrationButtonComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.0.6", ngImport: i0, type: GeneralDeviceRegistrationButtonComponent, deps: [{ token: i1$1.BsModalService }], target: i0.ɵɵFactoryTarget.Component });
-GeneralDeviceRegistrationButtonComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.0.6", type: GeneralDeviceRegistrationButtonComponent, selector: "c8y-general-device-registration-button", ngImport: i0, template: "<button title=\"{{ 'General' | translate }}\" type=\"button\" (click)=\"open()\">\n  <i c8yIcon=\"c8y-device-connect\"></i>\n  {{ 'General' | translate }}\n</button>\n", dependencies: [{ kind: "directive", type: i2$1.IconDirective, selector: "[c8yIcon]", inputs: ["c8yIcon"] }, { kind: "pipe", type: i2$1.C8yTranslatePipe, name: "translate" }] });
+GeneralDeviceRegistrationButtonComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.0.6", ngImport: i0, type: GeneralDeviceRegistrationButtonComponent, deps: [{ token: i1$2.BsModalService }], target: i0.ɵɵFactoryTarget.Component });
+GeneralDeviceRegistrationButtonComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.0.6", type: GeneralDeviceRegistrationButtonComponent, selector: "c8y-general-device-registration-button", ngImport: i0, template: "<button title=\"{{ 'General' | translate }}\" type=\"button\" (click)=\"open()\">\n  <i c8yIcon=\"c8y-device-connect\"></i>\n  {{ 'General' | translate }}\n</button>\n", dependencies: [{ kind: "directive", type: i2.IconDirective, selector: "[c8yIcon]", inputs: ["c8yIcon"] }, { kind: "pipe", type: i2.C8yTranslatePipe, name: "translate" }] });
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.0.6", ngImport: i0, type: GeneralDeviceRegistrationButtonComponent, decorators: [{
             type: Component,
             args: [{ selector: 'c8y-general-device-registration-button', template: "<button title=\"{{ 'General' | translate }}\" type=\"button\" (click)=\"open()\">\n  <i c8yIcon=\"c8y-device-connect\"></i>\n  {{ 'General' | translate }}\n</button>\n" }]
-        }], ctorParameters: function () { return [{ type: i1$1.BsModalService }]; } });
+        }], ctorParameters: function () { return [{ type: i1$2.BsModalService }]; } });
 
 /**
  * A hook to use for Multi Provider extension.
@@ -504,10 +504,10 @@ class RegisterDeviceDropdownComponent {
     }
 }
 RegisterDeviceDropdownComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.0.6", ngImport: i0, type: RegisterDeviceDropdownComponent, deps: [{ token: RegisterDeviceExtensionService }, { token: RegisterDeviceService }], target: i0.ɵɵFactoryTarget.Component });
-RegisterDeviceDropdownComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.0.6", type: RegisterDeviceDropdownComponent, selector: "c8y-register-device-dropdown", ngImport: i0, template: "<div class=\"dropdown\" dropdown>\n  <button\n    *ngIf=\"!(limit$ | async); else disable\"\n    title=\"{{ 'Register device' | translate }}\"\n    type=\"button\"\n    class=\"dropdown-toggle c8y-dropdown d-flex a-i-center\"\n    dropdownToggle\n    aria-haspopup=\"true\"\n  >\n    <span class=\"text-truncate\" translate>Register device</span>\n    <i [c8yIcon]=\"'caret-down'\" class=\"m-l-4 text-primary\"></i>\n  </button>\n  <ng-template #disable>\n    <button\n      title=\"{{ 'Device registration disabled' | translate }}\"\n      type=\"button\"\n      class=\"btn btn-clean d-flex p-l-8\"\n      disabled\n    >\n      <span class=\"text-truncate\" translate>Register device</span>\n      <i [c8yIcon]=\"'caret-down'\"></i>\n    </button>\n  </ng-template>\n\n  <!-- dropdown for normal screen sizes -->\n  <ul class=\"dropdown-menu dropdown-menu-right hidden-xs\" *dropdownMenu>\n    <ng-container *ngTemplateOutlet=\"dropdown\"></ng-container>\n  </ul>\n\n  <!-- fake dropdown for mobile screen sizes. *dropdownMenu is missing by design! -->\n  <ul class=\"dropdown-menu dropdown-menu visible-xs\">\n    <ng-container *ngTemplateOutlet=\"dropdown\"></ng-container>\n  </ul>\n\n  <ng-template #dropdown>\n    <ng-container *ngIf=\"single$ | async as single\">\n      <li class=\"dropdown-header\" *ngIf=\"single.length > 0\" translate data-cy=\"single-group\">Single registration</li>\n      <li *ngFor=\"let item of single\">\n        <ng-container *c8yOutlet=\"item.template\"></ng-container>\n      </li>\n    </ng-container>\n    <ng-container *ngIf=\"bulk$ | async as bulk\">\n      <li class=\"dropdown-header\" *ngIf=\"bulk.length > 0\" translate data-cy=\"bulk-group\">Bulk registration</li>\n      <li *ngFor=\"let item of bulk\">\n        <ng-container *c8yOutlet=\"item.template\"></ng-container>\n      </li>\n    </ng-container>\n  </ng-template>\n</div>\n", dependencies: [{ kind: "directive", type: i3.BsDropdownMenuDirective, selector: "[bsDropdownMenu],[dropdownMenu]", exportAs: ["bs-dropdown-menu"] }, { kind: "directive", type: i3.BsDropdownToggleDirective, selector: "[bsDropdownToggle],[dropdownToggle]", exportAs: ["bs-dropdown-toggle"] }, { kind: "directive", type: i3.BsDropdownDirective, selector: "[bsDropdown], [dropdown]", inputs: ["placement", "triggers", "container", "dropup", "autoClose", "isAnimated", "insideClick", "isDisabled", "isOpen"], outputs: ["isOpenChange", "onShown", "onHidden"], exportAs: ["bs-dropdown"] }, { kind: "directive", type: i2$1.IconDirective, selector: "[c8yIcon]", inputs: ["c8yIcon"] }, { kind: "directive", type: i2$1.OutletDirective, selector: "[c8yOutlet]", inputs: ["c8yOutlet", "c8yOutletProperties", "c8yOutletInjector"] }, { kind: "directive", type: i2$1.C8yTranslateDirective, selector: "[translate],[ngx-translate]" }, { kind: "directive", type: i5.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i5.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i5.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "pipe", type: i2$1.C8yTranslatePipe, name: "translate" }, { kind: "pipe", type: i5.AsyncPipe, name: "async" }] });
+RegisterDeviceDropdownComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.0.6", type: RegisterDeviceDropdownComponent, selector: "c8y-register-device-dropdown", ngImport: i0, template: "<div class=\"dropdown\" dropdown>\n  <button\n    *ngIf=\"!(limit$ | async); else disable\"\n    title=\"{{ 'Register device' | translate }}\"\n    type=\"button\"\n    class=\"dropdown-toggle c8y-dropdown d-flex a-i-center\"\n    dropdownToggle\n    aria-haspopup=\"true\"\n  >\n    <span class=\"text-truncate\" translate>Register device</span>\n    <i [c8yIcon]=\"'caret-down'\" class=\"m-l-4 text-primary\"></i>\n  </button>\n  <ng-template #disable>\n    <button\n      title=\"{{ 'Device registration disabled' | translate }}\"\n      type=\"button\"\n      class=\"btn btn-clean d-flex p-l-8\"\n      disabled\n    >\n      <span class=\"text-truncate\" translate>Register device</span>\n      <i [c8yIcon]=\"'caret-down'\"></i>\n    </button>\n  </ng-template>\n\n  <!-- dropdown for normal screen sizes -->\n  <ul class=\"dropdown-menu dropdown-menu-right hidden-xs\" data-cy=\"register-device--dropdown\" *dropdownMenu>\n    <ng-container *ngTemplateOutlet=\"dropdown\"></ng-container>\n  </ul>\n\n  <!-- fake dropdown for mobile screen sizes. *dropdownMenu is missing by design! -->\n  <ul class=\"dropdown-menu dropdown-menu visible-xs\">\n    <ng-container *ngTemplateOutlet=\"dropdown\"></ng-container>\n  </ul>\n\n  <ng-template #dropdown>\n    <ng-container *ngIf=\"single$ | async as single\">\n      <li class=\"dropdown-header\" *ngIf=\"single.length > 0\" translate data-cy=\"single-group\">Single registration</li>\n      <li *ngFor=\"let item of single\">\n        <ng-container *c8yOutlet=\"item.template\"></ng-container>\n      </li>\n    </ng-container>\n    <ng-container *ngIf=\"bulk$ | async as bulk\">\n      <li class=\"dropdown-header\" *ngIf=\"bulk.length > 0\" translate data-cy=\"bulk-group\">Bulk registration</li>\n      <li *ngFor=\"let item of bulk\">\n        <ng-container *c8yOutlet=\"item.template\"></ng-container>\n      </li>\n    </ng-container>\n  </ng-template>\n</div>\n", dependencies: [{ kind: "directive", type: i3.BsDropdownMenuDirective, selector: "[bsDropdownMenu],[dropdownMenu]", exportAs: ["bs-dropdown-menu"] }, { kind: "directive", type: i3.BsDropdownToggleDirective, selector: "[bsDropdownToggle],[dropdownToggle]", exportAs: ["bs-dropdown-toggle"] }, { kind: "directive", type: i3.BsDropdownDirective, selector: "[bsDropdown], [dropdown]", inputs: ["placement", "triggers", "container", "dropup", "autoClose", "isAnimated", "insideClick", "isDisabled", "isOpen"], outputs: ["isOpenChange", "onShown", "onHidden"], exportAs: ["bs-dropdown"] }, { kind: "directive", type: i2.IconDirective, selector: "[c8yIcon]", inputs: ["c8yIcon"] }, { kind: "directive", type: i2.OutletDirective, selector: "[c8yOutlet]", inputs: ["c8yOutlet", "c8yOutletProperties", "c8yOutletInjector"] }, { kind: "directive", type: i2.C8yTranslateDirective, selector: "[translate],[ngx-translate]" }, { kind: "directive", type: i5.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i5.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i5.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "pipe", type: i2.C8yTranslatePipe, name: "translate" }, { kind: "pipe", type: i5.AsyncPipe, name: "async" }] });
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.0.6", ngImport: i0, type: RegisterDeviceDropdownComponent, decorators: [{
             type: Component,
-            args: [{ selector: 'c8y-register-device-dropdown', template: "<div class=\"dropdown\" dropdown>\n  <button\n    *ngIf=\"!(limit$ | async); else disable\"\n    title=\"{{ 'Register device' | translate }}\"\n    type=\"button\"\n    class=\"dropdown-toggle c8y-dropdown d-flex a-i-center\"\n    dropdownToggle\n    aria-haspopup=\"true\"\n  >\n    <span class=\"text-truncate\" translate>Register device</span>\n    <i [c8yIcon]=\"'caret-down'\" class=\"m-l-4 text-primary\"></i>\n  </button>\n  <ng-template #disable>\n    <button\n      title=\"{{ 'Device registration disabled' | translate }}\"\n      type=\"button\"\n      class=\"btn btn-clean d-flex p-l-8\"\n      disabled\n    >\n      <span class=\"text-truncate\" translate>Register device</span>\n      <i [c8yIcon]=\"'caret-down'\"></i>\n    </button>\n  </ng-template>\n\n  <!-- dropdown for normal screen sizes -->\n  <ul class=\"dropdown-menu dropdown-menu-right hidden-xs\" *dropdownMenu>\n    <ng-container *ngTemplateOutlet=\"dropdown\"></ng-container>\n  </ul>\n\n  <!-- fake dropdown for mobile screen sizes. *dropdownMenu is missing by design! -->\n  <ul class=\"dropdown-menu dropdown-menu visible-xs\">\n    <ng-container *ngTemplateOutlet=\"dropdown\"></ng-container>\n  </ul>\n\n  <ng-template #dropdown>\n    <ng-container *ngIf=\"single$ | async as single\">\n      <li class=\"dropdown-header\" *ngIf=\"single.length > 0\" translate data-cy=\"single-group\">Single registration</li>\n      <li *ngFor=\"let item of single\">\n        <ng-container *c8yOutlet=\"item.template\"></ng-container>\n      </li>\n    </ng-container>\n    <ng-container *ngIf=\"bulk$ | async as bulk\">\n      <li class=\"dropdown-header\" *ngIf=\"bulk.length > 0\" translate data-cy=\"bulk-group\">Bulk registration</li>\n      <li *ngFor=\"let item of bulk\">\n        <ng-container *c8yOutlet=\"item.template\"></ng-container>\n      </li>\n    </ng-container>\n  </ng-template>\n</div>\n" }]
+            args: [{ selector: 'c8y-register-device-dropdown', template: "<div class=\"dropdown\" dropdown>\n  <button\n    *ngIf=\"!(limit$ | async); else disable\"\n    title=\"{{ 'Register device' | translate }}\"\n    type=\"button\"\n    class=\"dropdown-toggle c8y-dropdown d-flex a-i-center\"\n    dropdownToggle\n    aria-haspopup=\"true\"\n  >\n    <span class=\"text-truncate\" translate>Register device</span>\n    <i [c8yIcon]=\"'caret-down'\" class=\"m-l-4 text-primary\"></i>\n  </button>\n  <ng-template #disable>\n    <button\n      title=\"{{ 'Device registration disabled' | translate }}\"\n      type=\"button\"\n      class=\"btn btn-clean d-flex p-l-8\"\n      disabled\n    >\n      <span class=\"text-truncate\" translate>Register device</span>\n      <i [c8yIcon]=\"'caret-down'\"></i>\n    </button>\n  </ng-template>\n\n  <!-- dropdown for normal screen sizes -->\n  <ul class=\"dropdown-menu dropdown-menu-right hidden-xs\" data-cy=\"register-device--dropdown\" *dropdownMenu>\n    <ng-container *ngTemplateOutlet=\"dropdown\"></ng-container>\n  </ul>\n\n  <!-- fake dropdown for mobile screen sizes. *dropdownMenu is missing by design! -->\n  <ul class=\"dropdown-menu dropdown-menu visible-xs\">\n    <ng-container *ngTemplateOutlet=\"dropdown\"></ng-container>\n  </ul>\n\n  <ng-template #dropdown>\n    <ng-container *ngIf=\"single$ | async as single\">\n      <li class=\"dropdown-header\" *ngIf=\"single.length > 0\" translate data-cy=\"single-group\">Single registration</li>\n      <li *ngFor=\"let item of single\">\n        <ng-container *c8yOutlet=\"item.template\"></ng-container>\n      </li>\n    </ng-container>\n    <ng-container *ngIf=\"bulk$ | async as bulk\">\n      <li class=\"dropdown-header\" *ngIf=\"bulk.length > 0\" translate data-cy=\"bulk-group\">Bulk registration</li>\n      <li *ngFor=\"let item of bulk\">\n        <ng-container *c8yOutlet=\"item.template\"></ng-container>\n      </li>\n    </ng-container>\n  </ng-template>\n</div>\n" }]
         }], ctorParameters: function () { return [{ type: RegisterDeviceExtensionService }, { type: RegisterDeviceService }]; } });
 
 class DeviceRegistrationViewComponent {
@@ -620,12 +620,12 @@ class DeviceRegistrationViewComponent {
         return this._securityTokenPolicy.getValue() !== DeviceRegistrationSecurityMode.IGNORED;
     }
 }
-DeviceRegistrationViewComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.0.6", ngImport: i0, type: DeviceRegistrationViewComponent, deps: [{ token: RegisterDeviceService }, { token: i2$1.DeviceBootstrapRealtimeService }, { token: i2$1.TenantUiService }, { token: i2$1.ModalService }, { token: i3$1.TranslateService }, { token: i2$1.OptionsService }], target: i0.ɵɵFactoryTarget.Component });
-DeviceRegistrationViewComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.0.6", type: DeviceRegistrationViewComponent, selector: "c8y-device-registration-view", ngImport: i0, template: "<ng-container *ngIf=\"deviceRequests$ | async as deviceRequestList\">\n  <c8y-title>\n    {{ 'Device registration' | translate }}\n    <small *ngIf=\"deviceRequestList.data.length === 1\">1 {{ 'new device' | translate }}</small>\n    <small *ngIf=\"deviceRequestList.data.length > 1\">\n      {{ deviceRequestList.data.length }} {{ 'new devices' | translate }}\n    </small>\n  </c8y-title>\n\n  <c8y-breadcrumb>\n    <c8y-breadcrumb-item [icon]=\"'exchange'\" [label]=\"'Devices' | translate\"></c8y-breadcrumb-item>\n    <c8y-breadcrumb-item\n      [icon]=\"'c8y-device-connect'\"\n      [label]=\"'Device registration' | translate\"\n    ></c8y-breadcrumb-item>\n  </c8y-breadcrumb>\n\n  <c8y-action-bar-item [placement]=\"'left'\" itemClass=\"navbar-form hidden-xs\">\n    <c8y-list-display-switch (onListClassChange)=\"displayMode($event)\"></c8y-list-display-switch>\n  </c8y-action-bar-item>\n\n  <ng-container *ngIf=\"limit$ | async as limitStatus\">\n    <c8y-action-bar-item [placement]=\"'right'\" [priority]=\"10\">\n      <button\n        *c8yIfAllowed=\"['ROLE_DEVICE_CONTROL_ADMIN']\"\n        class=\"btn btn-link\"\n        title=\"{{ 'Accept all' | translate }}\"\n        (click)=\"acceptAll()\"\n        [disabled]=\"canAcceptAll() || limitStatus?.isReached\"\n      >\n        <i [c8yIcon]=\"'check'\"></i>\n        {{ 'Accept all' | translate }}\n      </button>\n    </c8y-action-bar-item>\n\n    <c8y-action-bar-item [placement]=\"'right'\" [priority]=\"9\">\n      <button\n        class=\"btn btn-link\"\n        title=\"{{ 'Reload' | translate }}\"\n        type=\"button\"\n        (click)=\"loadAll()\"\n        [disabled]=\"isLoading\"\n      >\n        <i [c8yIcon]=\"'refresh'\" [ngClass]=\"{ 'icon-spin': isLoading }\"></i>\n        {{ 'Reload' | translate }}\n      </button>\n    </c8y-action-bar-item>\n\n    <c8y-action-bar-item [placement]=\"'right'\" *c8yIfAllowed=\"['ROLE_DEVICE_CONTROL_ADMIN']\">\n      <c8y-register-device-dropdown></c8y-register-device-dropdown>\n    </c8y-action-bar-item>\n\n    <c8y-help src=\"/users-guide/device-management/#connecting-devices\"></c8y-help>\n\n    <ng-container *ngIf=\"deviceRequestList.data.length > 0; else noData\">\n      <div class=\"card-group\" [ngClass]=\"gridOrList\">\n        <!-- START interact-list sticky header START -->\n        <div *ngIf=\"gridOrList === 'interact-list'\" class=\"page-sticky-header hidden-xs\">\n          <div class=\"d-flex\">\n            <div class=\"card-header p-l-40\">\n              <p translate>Device</p>\n            </div>\n            <div class=\"card-block card-column-30 p-l-0 m-l-8\">\n              <p translate>Status</p>\n            </div>\n            <div class=\"card-block card-column-30 p-0\" *ngIf=\"showTokenInputBasedOnSecurityMode()\">\n              <p translate>Security token</p>\n              <button\n                class=\"btn-help\"\n                type=\"button\"\n                popover=\"{{\n                  'Security token is required if the connected device uses it.' | translate\n                }}\"\n                placement=\"right\"\n                container=\"body\"\n                [attr.aria-label]=\"'Help' | translate\"\n                triggers=\"focus\"\n              >\n                <i [c8yIcon]=\"'question-circle-o'\"></i>\n              </button>\n            </div>\n            <div class=\"card-footer card-column-50\">\n              <div class=\"d-contents\" *ngIf=\"isManagementTenant; else noManagement\">\n                <div class=\"card-column-50\">\n                  {{ 'Created' | translate }}\n                </div>\n                <div class=\"card-column-30\">\n                  {{ 'By`user`' | translate }}\n                </div>\n                <div class=\"card-column-20\">\n                  {{ 'Tenant ID' | translate }}\n                </div>\n              </div>\n              <ng-template #noManagement>\n                <div class=\"d-contents\">\n                  <div class=\"card-column-50\">\n                    {{ 'Created' | translate }}\n                  </div>\n                  <div class=\"card-column-50\">\n                    {{ 'By`user`' | translate }}\n                  </div>\n                </div>\n              </ng-template>\n            </div>\n            <div class=\"card-actions-group\" style=\"min-width: 176px\">\n              <div class=\"btn btn-xs invisible\">\n                <!--EMPTY by design-->\n              </div>\n            </div>\n          </div>\n        </div>\n        <!-- END interact-list sticky header END -->\n\n        <div *ngIf=\"limitStatus?.isReached\" class=\"col-xs-12 col-sm-6 col-md-4 col-lg-3\">\n          <p class=\"alert alert-warning center-block\" role=\"alert\">\n            <strong>\n              {{ limitReachedInfo$ | async }}\n            </strong>\n            <br />\n            <span translate>Please contact your platform administrator.</span>\n          </p>\n        </div>\n\n        <ng-container *ngFor=\"let singleRequest of deviceRequestList.data\">\n          <div class=\"col-xs-12 col-sm-6 col-md-4 col-lg-3\">\n            <div class=\"card\">\n              <div class=\"card-header separator\">\n                <div class=\"card-icon\">\n                  <i\n                    [c8yIcon]=\"statusProps[singleRequest.status].icon\"\n                    [class]=\"statusProps[singleRequest.status].cls\"\n                  ></i>\n                </div>\n                <p class=\"card-title text-truncate\" title=\"{{ singleRequest.id }}\">{{ singleRequest.id }}</p>\n              </div>\n\n              <div class=\"card-block text-center card-column-30\">\n                <span class=\"text-label-small\" translate>Status</span>\n                <p>\n                  <i\n                    *ngIf=\"singleRequest.status === status.WAITING_FOR_CONNECTION\"\n                    c8yIcon=\"refresh\"\n                    class=\"icon-spin text-primary\"\n                  ></i>\n                  {{ statusProps[singleRequest.status].label | translate }}\n                </p>\n              </div>\n\n              <ng-container *c8yIfAllowed=\"['ROLE_DEVICE_CONTROL_ADMIN']\">\n                <div\n                  class=\"card-block text-center card-column-30 p-t-0\"\n                  [ngClass]=\"{ 'p-b-0': !shouldShowSecurityTokenInput(singleRequest) }\"\n                  *ngIf=\"showTokenInputBasedOnSecurityMode()\"\n                >\n                  <ng-container *ngIf=\"shouldShowSecurityTokenInput(singleRequest)\">\n                    <span *ngIf=\"gridOrList !== 'interact-list'\" class=\"text-label-small\" translate>\n                      Security token\n                    </span>\n                    <input\n                      [(ngModel)]=\"singleRequest.securityToken\"\n                      type=\"text\"\n                      class=\"form-control\"\n                      [placeholder]=\"'e.g. {{ example }}' | translate: { example: 'A1e3gh5ds' }\"\n                      [required]=\"requireSecurityToken\"\n                    />\n                  </ng-container>\n                </div>\n\n                <div\n                  class=\"card-actions-group d-flex a-i-center j-c-center\"\n                  style=\"min-width: 176px\"\n                >\n                  <button\n                    class=\"btn btn-sm\"\n                    [ngClass]=\"{\n                      'btn-danger': singleRequest.status === status.PENDING_ACCEPTANCE,\n                      'btn-default': singleRequest.status !== status.PENDING_ACCEPTANCE\n                    }\"\n                    title=\"{{\n                      singleRequest.status === status.PENDING_ACCEPTANCE\n                        ? ('Remove' | translate)\n                        : ('Cancel' | translate)\n                    }}\"\n                    type=\"button\"\n                    (click)=\"delete(singleRequest.id)\"\n                    [disabled]=\"isLoading\"\n                  >\n                    <span *ngIf=\"singleRequest.status === status.PENDING_ACCEPTANCE\">\n                      {{ 'Remove' | translate }}\n                    </span>\n                    <span *ngIf=\"singleRequest.status !== status.PENDING_ACCEPTANCE\">\n                      {{ 'Cancel' | translate }}\n                    </span>\n                  </button>\n                  <button\n                    class=\"btn btn-primary btn-sm\"\n                    title=\"{{ 'Accept' | translate }}\"\n                    type=\"button\"\n                    (click)=\"accept(singleRequest)\"\n                    *ngIf=\"singleRequest.status === status.PENDING_ACCEPTANCE\"\n                    [disabled]=\"\n                      isLoading ||\n                      limitStatus?.isReached ||\n                      (!singleRequest.securityToken && requireSecurityToken)\n                    \"\n                  >\n                    {{ 'Accept' | translate }}\n                  </button>\n                </div>\n              </ng-container>\n\n              <div class=\"card-footer separator text-center card-column-50\">\n                <small *ngIf=\"isManagementTenant; else noManagement\" class=\"d-contents\">\n                  <div class=\"d-contents\" *ngIf=\"singleRequest.creationTime && singleRequest.owner\">\n                    <span class=\"text-label-small\" translate>Created on`date`</span>\n                    <span class=\"card-column-50\">\n                      {{ singleRequest.creationTime | c8yDate }}\n                    </span>\n                    <span class=\"text-label-small m-l-4 m-r-4\" translate>by`user`</span>\n                    <span class=\"card-column-30\">\n                      <span class=\"text-truncate\" title=\"{{ singleRequest.owner }}\">\n                        {{ singleRequest.owner }}\n                      </span>\n                    </span>\n                    <span class=\"text-label-small m-l-4 m-r-4\" translate>in`tenant`</span>\n                    <span class=\"card-column-20\">{{ singleRequest.tenantId }}</span>\n                  </div>\n                  <div\n                    class=\"d-contents\"\n                    *ngIf=\"!singleRequest.creationTime || !singleRequest.owner\"\n                  >\n                    <div class=\"card-column-50\"></div>\n                    <div class=\"card-column-30\"></div>\n                    <span class=\"text-label-small\" translate>Created in`tenant`</span>\n                    <div class=\"card-column-20\">\n                      <span>\n                        {{ singleRequest.tenantId }}\n                      </span>\n                    </div>\n                  </div>\n                </small>\n                <ng-template #noManagement>\n                  <small class=\"d-contents\">\n                    <span class=\"text-label-small m-l-4 m-r-4\" translate>Created on`date`</span>\n                    <span class=\"card-column-50\">\n                      {{ singleRequest.creationTime | c8yDate }}\n                    </span>\n                    <span class=\"text-label-small m-l-4 m-r-4\" translate>by`user`</span>\n                    <span class=\"card-column-50\">\n                      <span class=\"text-truncate\" title=\"{{ singleRequest.owner }}\">\n                        {{ singleRequest.owner }}\n                      </span>\n                    </span>\n                  </small>\n                </ng-template>\n              </div>\n            </div>\n          </div>\n        </ng-container>\n      </div>\n      <c8y-load-more\n        [paging]=\"deviceRequestList.paging\"\n        [hidden]=\"true\"\n        (onLoad)=\"updateList($event)\"\n      ></c8y-load-more>\n    </ng-container>\n\n    <ng-template #noData>\n      <div class=\"c8y-empty-state m-t-40 text-center\">\n        <h1 class=\"c8y-icon c8y-icon-device-connect c8y-icon-duocolor\"></h1>\n        <ng-container *ngIf=\"limitStatus?.isReached; else limitNotReached\">\n          <h3>\n            {{ limitReachedInfo$ | async }}\n          </h3>\n          <p translate>Please contact your platform administrator.</p>\n        </ng-container>\n        <ng-template #limitNotReached>\n          <h3 translate>No pending registrations to display.</h3>\n          <p *c8yIfAllowed=\"['ROLE_DEVICE_CONTROL_ADMIN']\" translate>\n            Use the \"Register device\" dropdown in the top right corner.\n          </p>\n        </ng-template>\n      </div>\n    </ng-template>\n  </ng-container>\n</ng-container>\n", dependencies: [{ kind: "directive", type: i4.PopoverDirective, selector: "[popover]", inputs: ["adaptivePosition", "boundariesElement", "popover", "popoverContext", "popoverTitle", "placement", "outsideClick", "triggers", "container", "containerClass", "isOpen", "delay"], outputs: ["onShown", "onHidden"], exportAs: ["bs-popover"] }, { kind: "directive", type: i2$1.IconDirective, selector: "[c8yIcon]", inputs: ["c8yIcon"] }, { kind: "directive", type: i2$1.C8yTranslateDirective, selector: "[translate],[ngx-translate]" }, { kind: "directive", type: i5.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i5.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i5.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i2$1.IfAllowedDirective, selector: "[c8yIfAllowed]", inputs: ["c8yIfAllowed", "c8yIfAllowedAllowAny"] }, { kind: "component", type: i2$1.LoadMoreComponent, selector: "c8y-load-more", inputs: ["paging", "useIntersection", "hidden", "container", "class", "maxIterations", "noMoreDataHint", "loadingTemplate", "hideNoMoreDataHint", "loadNextLabel", "loadingLabel"], outputs: ["onLoad"] }, { kind: "component", type: i2$1.ActionBarItemComponent, selector: "c8y-action-bar-item", inputs: ["placement", "priority", "itemClass", "injector", "groupId"] }, { kind: "component", type: i2$1.BreadcrumbComponent, selector: "c8y-breadcrumb" }, { kind: "component", type: i2$1.BreadcrumbItemComponent, selector: "c8y-breadcrumb-item", inputs: ["icon", "translate", "label", "path", "injector"] }, { kind: "component", type: i2$1.TitleComponent, selector: "c8y-title", inputs: ["pageTitleUpdate"] }, { kind: "directive", type: i6$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: i6$1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i6$1.RequiredValidator, selector: ":not([type=checkbox])[required][formControlName],:not([type=checkbox])[required][formControl],:not([type=checkbox])[required][ngModel]", inputs: ["required"] }, { kind: "directive", type: i6$1.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "directive", type: i2$1.RequiredInputPlaceholderDirective, selector: "input[required], input[formControlName]" }, { kind: "component", type: i2$1.HelpComponent, selector: "c8y-help", inputs: ["src", "isCollapsed", "priority", "icon"] }, { kind: "component", type: i2$1.ListDisplaySwitchComponent, selector: "c8y-list-display-switch", inputs: ["listKey", "listLength", "filterPipe"], outputs: ["onListClassChange"] }, { kind: "component", type: RegisterDeviceDropdownComponent, selector: "c8y-register-device-dropdown" }, { kind: "pipe", type: i2$1.C8yTranslatePipe, name: "translate" }, { kind: "pipe", type: i5.AsyncPipe, name: "async" }, { kind: "pipe", type: i2$1.DatePipe, name: "c8yDate" }] });
+DeviceRegistrationViewComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.0.6", ngImport: i0, type: DeviceRegistrationViewComponent, deps: [{ token: RegisterDeviceService }, { token: i2.DeviceBootstrapRealtimeService }, { token: i2.TenantUiService }, { token: i2.ModalService }, { token: i3$1.TranslateService }, { token: i2.OptionsService }], target: i0.ɵɵFactoryTarget.Component });
+DeviceRegistrationViewComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.0.6", type: DeviceRegistrationViewComponent, selector: "c8y-device-registration-view", ngImport: i0, template: "<ng-container *ngIf=\"deviceRequests$ | async as deviceRequestList\">\n  <c8y-title>\n    {{ 'Device registration' | translate }}\n    <small *ngIf=\"deviceRequestList.data.length === 1\">1 {{ 'new device' | translate }}</small>\n    <small *ngIf=\"deviceRequestList.data.length > 1\">\n      {{ deviceRequestList.data.length }} {{ 'new devices' | translate }}\n    </small>\n  </c8y-title>\n\n  <c8y-breadcrumb>\n    <c8y-breadcrumb-item [icon]=\"'exchange'\" [label]=\"'Devices' | translate\"></c8y-breadcrumb-item>\n    <c8y-breadcrumb-item\n      [icon]=\"'c8y-device-connect'\"\n      [label]=\"'Device registration' | translate\"\n    ></c8y-breadcrumb-item>\n  </c8y-breadcrumb>\n\n  <c8y-action-bar-item [placement]=\"'left'\" itemClass=\"navbar-form hidden-xs\">\n    <c8y-list-display-switch (onListClassChange)=\"displayMode($event)\"></c8y-list-display-switch>\n  </c8y-action-bar-item>\n\n  <ng-container *ngIf=\"limit$ | async as limitStatus\">\n    <c8y-action-bar-item [placement]=\"'right'\" [priority]=\"10\">\n      <button\n        *c8yIfAllowed=\"['ROLE_DEVICE_CONTROL_ADMIN']\"\n        class=\"btn btn-link\"\n        title=\"{{ 'Accept all' | translate }}\"\n        (click)=\"acceptAll()\"\n        [disabled]=\"canAcceptAll() || limitStatus?.isReached\"\n      >\n        <i [c8yIcon]=\"'check'\"></i>\n        {{ 'Accept all' | translate }}\n      </button>\n    </c8y-action-bar-item>\n\n    <c8y-action-bar-item [placement]=\"'right'\" [priority]=\"9\">\n      <button\n        class=\"btn btn-link\"\n        title=\"{{ 'Reload' | translate }}\"\n        type=\"button\"\n        (click)=\"loadAll()\"\n        [disabled]=\"isLoading\"\n      >\n        <i [c8yIcon]=\"'refresh'\" [ngClass]=\"{ 'icon-spin': isLoading }\"></i>\n        {{ 'Reload' | translate }}\n      </button>\n    </c8y-action-bar-item>\n\n    <c8y-action-bar-item [placement]=\"'right'\" *c8yIfAllowed=\"['ROLE_DEVICE_CONTROL_ADMIN']\">\n      <c8y-register-device-dropdown></c8y-register-device-dropdown>\n    </c8y-action-bar-item>\n\n    <c8y-help src=\"/users-guide/device-management/#connecting-devices\"></c8y-help>\n\n    <ng-container *ngIf=\"deviceRequestList.data.length > 0; else noData\">\n      <div class=\"card-group\" [ngClass]=\"gridOrList\">\n        <!-- START interact-list sticky header START -->\n        <div *ngIf=\"gridOrList === 'interact-list'\" class=\"page-sticky-header hidden-xs\">\n          <div class=\"d-flex\">\n            <div class=\"card-header p-l-40\">\n              <p translate>Device</p>\n            </div>\n            <div class=\"card-block card-column-30 p-l-0 m-l-8\">\n              <p translate>Status</p>\n            </div>\n            <div class=\"card-block card-column-30 p-0\" *ngIf=\"showTokenInputBasedOnSecurityMode()\">\n              <p translate>Security token</p>\n              <button\n                class=\"btn-help\"\n                type=\"button\"\n                popover=\"{{\n                  'Security token is required if the connected device uses it.' | translate\n                }}\"\n                placement=\"right\"\n                container=\"body\"\n                [attr.aria-label]=\"'Help' | translate\"\n                triggers=\"focus\"\n              >\n                <i [c8yIcon]=\"'question-circle-o'\"></i>\n              </button>\n            </div>\n            <div class=\"card-footer card-column-50\">\n              <div class=\"d-contents\" *ngIf=\"isManagementTenant; else noManagement\">\n                <div class=\"card-column-50\">\n                  {{ 'Created' | translate }}\n                </div>\n                <div class=\"card-column-30\">\n                  {{ 'By`user`' | translate }}\n                </div>\n                <div class=\"card-column-20\">\n                  {{ 'Tenant ID' | translate }}\n                </div>\n              </div>\n              <ng-template #noManagement>\n                <div class=\"d-contents\">\n                  <div class=\"card-column-50\">\n                    {{ 'Created' | translate }}\n                  </div>\n                  <div class=\"card-column-50\">\n                    {{ 'By`user`' | translate }}\n                  </div>\n                </div>\n              </ng-template>\n            </div>\n            <div class=\"card-actions-group\" style=\"min-width: 176px\">\n              <div class=\"btn btn-xs invisible\">\n                <!--EMPTY by design-->\n              </div>\n            </div>\n          </div>\n        </div>\n        <!-- END interact-list sticky header END -->\n\n        <div *ngIf=\"limitStatus?.isReached\" class=\"col-xs-12 col-sm-6 col-md-4 col-lg-3\">\n          <p class=\"alert alert-warning center-block\" role=\"alert\">\n            <strong>\n              {{ limitReachedInfo$ | async }}\n            </strong>\n            <br />\n            <span translate>Please contact your platform administrator.</span>\n          </p>\n        </div>\n\n        <ng-container *ngFor=\"let singleRequest of deviceRequestList.data\">\n          <div class=\"col-xs-12 col-sm-6 col-md-4 col-lg-3\">\n            <div class=\"card\">\n              <div class=\"card-header separator\">\n                <div class=\"card-icon\">\n                  <i\n                    [c8yIcon]=\"statusProps[singleRequest.status].icon\"\n                    [class]=\"statusProps[singleRequest.status].cls\"\n                  ></i>\n                </div>\n                <p class=\"card-title text-truncate\" title=\"{{ singleRequest.id }}\">{{ singleRequest.id }}</p>\n              </div>\n\n              <div class=\"card-block text-center card-column-30\">\n                <span class=\"text-label-small\" translate>Status</span>\n                <p>\n                  <i\n                    *ngIf=\"singleRequest.status === status.WAITING_FOR_CONNECTION\"\n                    c8yIcon=\"refresh\"\n                    class=\"icon-spin text-primary\"\n                  ></i>\n                  {{ statusProps[singleRequest.status].label | translate }}\n                </p>\n              </div>\n\n              <ng-container *c8yIfAllowed=\"['ROLE_DEVICE_CONTROL_ADMIN']\">\n                <div\n                  class=\"card-block text-center card-column-30 p-t-0\"\n                  [ngClass]=\"{ 'p-b-0': !shouldShowSecurityTokenInput(singleRequest) }\"\n                  *ngIf=\"showTokenInputBasedOnSecurityMode()\"\n                >\n                  <ng-container *ngIf=\"shouldShowSecurityTokenInput(singleRequest)\">\n                    <span *ngIf=\"gridOrList !== 'interact-list'\" class=\"text-label-small\" translate>\n                      Security token\n                    </span>\n                    <input\n                      [(ngModel)]=\"singleRequest.securityToken\"\n                      type=\"text\"\n                      class=\"form-control\"\n                      [placeholder]=\"'e.g. {{ example }}' | translate: { example: 'A1e3gh5ds' }\"\n                      [required]=\"requireSecurityToken\"\n                    />\n                  </ng-container>\n                </div>\n\n                <div\n                  class=\"card-actions-group d-flex a-i-center j-c-center\"\n                  style=\"min-width: 176px\"\n                >\n                  <button\n                    class=\"btn btn-sm\"\n                    [ngClass]=\"{\n                      'btn-danger': singleRequest.status === status.PENDING_ACCEPTANCE,\n                      'btn-default': singleRequest.status !== status.PENDING_ACCEPTANCE\n                    }\"\n                    title=\"{{\n                      singleRequest.status === status.PENDING_ACCEPTANCE\n                        ? ('Remove' | translate)\n                        : ('Cancel' | translate)\n                    }}\"\n                    type=\"button\"\n                    (click)=\"delete(singleRequest.id)\"\n                    [disabled]=\"isLoading\"\n                  >\n                    <span *ngIf=\"singleRequest.status === status.PENDING_ACCEPTANCE\">\n                      {{ 'Remove' | translate }}\n                    </span>\n                    <span *ngIf=\"singleRequest.status !== status.PENDING_ACCEPTANCE\">\n                      {{ 'Cancel' | translate }}\n                    </span>\n                  </button>\n                  <button\n                    class=\"btn btn-primary btn-sm\"\n                    title=\"{{ 'Accept' | translate }}\"\n                    type=\"button\"\n                    (click)=\"accept(singleRequest)\"\n                    *ngIf=\"singleRequest.status === status.PENDING_ACCEPTANCE\"\n                    [disabled]=\"\n                      isLoading ||\n                      limitStatus?.isReached ||\n                      (!singleRequest.securityToken && requireSecurityToken)\n                    \"\n                  >\n                    {{ 'Accept' | translate }}\n                  </button>\n                </div>\n              </ng-container>\n\n              <div class=\"card-footer separator text-center card-column-50\">\n                <small *ngIf=\"isManagementTenant; else noManagement\" class=\"d-contents\">\n                  <div class=\"d-contents\" *ngIf=\"singleRequest.creationTime && singleRequest.owner\">\n                    <span class=\"text-label-small\" translate>Created on`date`</span>\n                    <span class=\"card-column-50\">\n                      {{ singleRequest.creationTime | c8yDate }}\n                    </span>\n                    <span class=\"text-label-small m-l-4 m-r-4\" translate>by`user`</span>\n                    <span class=\"card-column-30\">\n                      <span class=\"text-truncate\" title=\"{{ singleRequest.owner }}\">\n                        {{ singleRequest.owner }}\n                      </span>\n                    </span>\n                    <span class=\"text-label-small m-l-4 m-r-4\" translate>in`tenant`</span>\n                    <span class=\"card-column-20\">{{ singleRequest.tenantId }}</span>\n                  </div>\n                  <div\n                    class=\"d-contents\"\n                    *ngIf=\"!singleRequest.creationTime || !singleRequest.owner\"\n                  >\n                    <div class=\"card-column-50\"></div>\n                    <div class=\"card-column-30\"></div>\n                    <span class=\"text-label-small\" translate>Created in`tenant`</span>\n                    <div class=\"card-column-20\">\n                      <span>\n                        {{ singleRequest.tenantId }}\n                      </span>\n                    </div>\n                  </div>\n                </small>\n                <ng-template #noManagement>\n                  <small class=\"d-contents\">\n                    <span class=\"text-label-small m-l-4 m-r-4\" translate>Created on`date`</span>\n                    <span class=\"card-column-50\">\n                      {{ singleRequest.creationTime | c8yDate }}\n                    </span>\n                    <span class=\"text-label-small m-l-4 m-r-4\" translate>by`user`</span>\n                    <span class=\"card-column-50\">\n                      <span class=\"text-truncate\" title=\"{{ singleRequest.owner }}\">\n                        {{ singleRequest.owner }}\n                      </span>\n                    </span>\n                  </small>\n                </ng-template>\n              </div>\n            </div>\n          </div>\n        </ng-container>\n      </div>\n      <c8y-load-more\n        [paging]=\"deviceRequestList.paging\"\n        [hidden]=\"true\"\n        (onLoad)=\"updateList($event)\"\n      ></c8y-load-more>\n    </ng-container>\n\n    <ng-template #noData>\n      <div class=\"c8y-empty-state m-t-40 text-center\">\n        <h1 class=\"c8y-icon c8y-icon-device-connect c8y-icon-duocolor\"></h1>\n        <ng-container *ngIf=\"limitStatus?.isReached; else limitNotReached\">\n          <h3>\n            {{ limitReachedInfo$ | async }}\n          </h3>\n          <p translate>Please contact your platform administrator.</p>\n        </ng-container>\n        <ng-template #limitNotReached>\n          <h3 translate>No pending registrations to display.</h3>\n          <p *c8yIfAllowed=\"['ROLE_DEVICE_CONTROL_ADMIN']\" translate>\n            Use the \"Register device\" dropdown in the top right corner.\n          </p>\n        </ng-template>\n      </div>\n    </ng-template>\n  </ng-container>\n</ng-container>\n", dependencies: [{ kind: "directive", type: i4.PopoverDirective, selector: "[popover]", inputs: ["adaptivePosition", "boundariesElement", "popover", "popoverContext", "popoverTitle", "placement", "outsideClick", "triggers", "container", "containerClass", "isOpen", "delay"], outputs: ["onShown", "onHidden"], exportAs: ["bs-popover"] }, { kind: "directive", type: i2.IconDirective, selector: "[c8yIcon]", inputs: ["c8yIcon"] }, { kind: "directive", type: i2.C8yTranslateDirective, selector: "[translate],[ngx-translate]" }, { kind: "directive", type: i5.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i5.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i5.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i2.IfAllowedDirective, selector: "[c8yIfAllowed]", inputs: ["c8yIfAllowed", "c8yIfAllowedAllowAny"] }, { kind: "component", type: i2.LoadMoreComponent, selector: "c8y-load-more", inputs: ["paging", "useIntersection", "hidden", "container", "class", "maxIterations", "noMoreDataHint", "loadingTemplate", "hideNoMoreDataHint", "loadNextLabel", "loadingLabel"], outputs: ["onLoad"] }, { kind: "component", type: i2.ActionBarItemComponent, selector: "c8y-action-bar-item", inputs: ["placement", "priority", "itemClass", "injector", "groupId"] }, { kind: "component", type: i2.BreadcrumbComponent, selector: "c8y-breadcrumb" }, { kind: "component", type: i2.BreadcrumbItemComponent, selector: "c8y-breadcrumb-item", inputs: ["icon", "translate", "label", "path", "injector"] }, { kind: "component", type: i2.TitleComponent, selector: "c8y-title", inputs: ["pageTitleUpdate"] }, { kind: "directive", type: i6$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: i6$1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i6$1.RequiredValidator, selector: ":not([type=checkbox])[required][formControlName],:not([type=checkbox])[required][formControl],:not([type=checkbox])[required][ngModel]", inputs: ["required"] }, { kind: "directive", type: i6$1.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "directive", type: i2.RequiredInputPlaceholderDirective, selector: "input[required], input[formControlName]" }, { kind: "component", type: i2.HelpComponent, selector: "c8y-help", inputs: ["src", "isCollapsed", "priority", "icon"] }, { kind: "component", type: i2.ListDisplaySwitchComponent, selector: "c8y-list-display-switch", inputs: ["listKey", "listLength", "filterPipe"], outputs: ["onListClassChange"] }, { kind: "component", type: RegisterDeviceDropdownComponent, selector: "c8y-register-device-dropdown" }, { kind: "pipe", type: i2.C8yTranslatePipe, name: "translate" }, { kind: "pipe", type: i5.AsyncPipe, name: "async" }, { kind: "pipe", type: i2.DatePipe, name: "c8yDate" }] });
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.0.6", ngImport: i0, type: DeviceRegistrationViewComponent, decorators: [{
             type: Component,
             args: [{ selector: 'c8y-device-registration-view', template: "<ng-container *ngIf=\"deviceRequests$ | async as deviceRequestList\">\n  <c8y-title>\n    {{ 'Device registration' | translate }}\n    <small *ngIf=\"deviceRequestList.data.length === 1\">1 {{ 'new device' | translate }}</small>\n    <small *ngIf=\"deviceRequestList.data.length > 1\">\n      {{ deviceRequestList.data.length }} {{ 'new devices' | translate }}\n    </small>\n  </c8y-title>\n\n  <c8y-breadcrumb>\n    <c8y-breadcrumb-item [icon]=\"'exchange'\" [label]=\"'Devices' | translate\"></c8y-breadcrumb-item>\n    <c8y-breadcrumb-item\n      [icon]=\"'c8y-device-connect'\"\n      [label]=\"'Device registration' | translate\"\n    ></c8y-breadcrumb-item>\n  </c8y-breadcrumb>\n\n  <c8y-action-bar-item [placement]=\"'left'\" itemClass=\"navbar-form hidden-xs\">\n    <c8y-list-display-switch (onListClassChange)=\"displayMode($event)\"></c8y-list-display-switch>\n  </c8y-action-bar-item>\n\n  <ng-container *ngIf=\"limit$ | async as limitStatus\">\n    <c8y-action-bar-item [placement]=\"'right'\" [priority]=\"10\">\n      <button\n        *c8yIfAllowed=\"['ROLE_DEVICE_CONTROL_ADMIN']\"\n        class=\"btn btn-link\"\n        title=\"{{ 'Accept all' | translate }}\"\n        (click)=\"acceptAll()\"\n        [disabled]=\"canAcceptAll() || limitStatus?.isReached\"\n      >\n        <i [c8yIcon]=\"'check'\"></i>\n        {{ 'Accept all' | translate }}\n      </button>\n    </c8y-action-bar-item>\n\n    <c8y-action-bar-item [placement]=\"'right'\" [priority]=\"9\">\n      <button\n        class=\"btn btn-link\"\n        title=\"{{ 'Reload' | translate }}\"\n        type=\"button\"\n        (click)=\"loadAll()\"\n        [disabled]=\"isLoading\"\n      >\n        <i [c8yIcon]=\"'refresh'\" [ngClass]=\"{ 'icon-spin': isLoading }\"></i>\n        {{ 'Reload' | translate }}\n      </button>\n    </c8y-action-bar-item>\n\n    <c8y-action-bar-item [placement]=\"'right'\" *c8yIfAllowed=\"['ROLE_DEVICE_CONTROL_ADMIN']\">\n      <c8y-register-device-dropdown></c8y-register-device-dropdown>\n    </c8y-action-bar-item>\n\n    <c8y-help src=\"/users-guide/device-management/#connecting-devices\"></c8y-help>\n\n    <ng-container *ngIf=\"deviceRequestList.data.length > 0; else noData\">\n      <div class=\"card-group\" [ngClass]=\"gridOrList\">\n        <!-- START interact-list sticky header START -->\n        <div *ngIf=\"gridOrList === 'interact-list'\" class=\"page-sticky-header hidden-xs\">\n          <div class=\"d-flex\">\n            <div class=\"card-header p-l-40\">\n              <p translate>Device</p>\n            </div>\n            <div class=\"card-block card-column-30 p-l-0 m-l-8\">\n              <p translate>Status</p>\n            </div>\n            <div class=\"card-block card-column-30 p-0\" *ngIf=\"showTokenInputBasedOnSecurityMode()\">\n              <p translate>Security token</p>\n              <button\n                class=\"btn-help\"\n                type=\"button\"\n                popover=\"{{\n                  'Security token is required if the connected device uses it.' | translate\n                }}\"\n                placement=\"right\"\n                container=\"body\"\n                [attr.aria-label]=\"'Help' | translate\"\n                triggers=\"focus\"\n              >\n                <i [c8yIcon]=\"'question-circle-o'\"></i>\n              </button>\n            </div>\n            <div class=\"card-footer card-column-50\">\n              <div class=\"d-contents\" *ngIf=\"isManagementTenant; else noManagement\">\n                <div class=\"card-column-50\">\n                  {{ 'Created' | translate }}\n                </div>\n                <div class=\"card-column-30\">\n                  {{ 'By`user`' | translate }}\n                </div>\n                <div class=\"card-column-20\">\n                  {{ 'Tenant ID' | translate }}\n                </div>\n              </div>\n              <ng-template #noManagement>\n                <div class=\"d-contents\">\n                  <div class=\"card-column-50\">\n                    {{ 'Created' | translate }}\n                  </div>\n                  <div class=\"card-column-50\">\n                    {{ 'By`user`' | translate }}\n                  </div>\n                </div>\n              </ng-template>\n            </div>\n            <div class=\"card-actions-group\" style=\"min-width: 176px\">\n              <div class=\"btn btn-xs invisible\">\n                <!--EMPTY by design-->\n              </div>\n            </div>\n          </div>\n        </div>\n        <!-- END interact-list sticky header END -->\n\n        <div *ngIf=\"limitStatus?.isReached\" class=\"col-xs-12 col-sm-6 col-md-4 col-lg-3\">\n          <p class=\"alert alert-warning center-block\" role=\"alert\">\n            <strong>\n              {{ limitReachedInfo$ | async }}\n            </strong>\n            <br />\n            <span translate>Please contact your platform administrator.</span>\n          </p>\n        </div>\n\n        <ng-container *ngFor=\"let singleRequest of deviceRequestList.data\">\n          <div class=\"col-xs-12 col-sm-6 col-md-4 col-lg-3\">\n            <div class=\"card\">\n              <div class=\"card-header separator\">\n                <div class=\"card-icon\">\n                  <i\n                    [c8yIcon]=\"statusProps[singleRequest.status].icon\"\n                    [class]=\"statusProps[singleRequest.status].cls\"\n                  ></i>\n                </div>\n                <p class=\"card-title text-truncate\" title=\"{{ singleRequest.id }}\">{{ singleRequest.id }}</p>\n              </div>\n\n              <div class=\"card-block text-center card-column-30\">\n                <span class=\"text-label-small\" translate>Status</span>\n                <p>\n                  <i\n                    *ngIf=\"singleRequest.status === status.WAITING_FOR_CONNECTION\"\n                    c8yIcon=\"refresh\"\n                    class=\"icon-spin text-primary\"\n                  ></i>\n                  {{ statusProps[singleRequest.status].label | translate }}\n                </p>\n              </div>\n\n              <ng-container *c8yIfAllowed=\"['ROLE_DEVICE_CONTROL_ADMIN']\">\n                <div\n                  class=\"card-block text-center card-column-30 p-t-0\"\n                  [ngClass]=\"{ 'p-b-0': !shouldShowSecurityTokenInput(singleRequest) }\"\n                  *ngIf=\"showTokenInputBasedOnSecurityMode()\"\n                >\n                  <ng-container *ngIf=\"shouldShowSecurityTokenInput(singleRequest)\">\n                    <span *ngIf=\"gridOrList !== 'interact-list'\" class=\"text-label-small\" translate>\n                      Security token\n                    </span>\n                    <input\n                      [(ngModel)]=\"singleRequest.securityToken\"\n                      type=\"text\"\n                      class=\"form-control\"\n                      [placeholder]=\"'e.g. {{ example }}' | translate: { example: 'A1e3gh5ds' }\"\n                      [required]=\"requireSecurityToken\"\n                    />\n                  </ng-container>\n                </div>\n\n                <div\n                  class=\"card-actions-group d-flex a-i-center j-c-center\"\n                  style=\"min-width: 176px\"\n                >\n                  <button\n                    class=\"btn btn-sm\"\n                    [ngClass]=\"{\n                      'btn-danger': singleRequest.status === status.PENDING_ACCEPTANCE,\n                      'btn-default': singleRequest.status !== status.PENDING_ACCEPTANCE\n                    }\"\n                    title=\"{{\n                      singleRequest.status === status.PENDING_ACCEPTANCE\n                        ? ('Remove' | translate)\n                        : ('Cancel' | translate)\n                    }}\"\n                    type=\"button\"\n                    (click)=\"delete(singleRequest.id)\"\n                    [disabled]=\"isLoading\"\n                  >\n                    <span *ngIf=\"singleRequest.status === status.PENDING_ACCEPTANCE\">\n                      {{ 'Remove' | translate }}\n                    </span>\n                    <span *ngIf=\"singleRequest.status !== status.PENDING_ACCEPTANCE\">\n                      {{ 'Cancel' | translate }}\n                    </span>\n                  </button>\n                  <button\n                    class=\"btn btn-primary btn-sm\"\n                    title=\"{{ 'Accept' | translate }}\"\n                    type=\"button\"\n                    (click)=\"accept(singleRequest)\"\n                    *ngIf=\"singleRequest.status === status.PENDING_ACCEPTANCE\"\n                    [disabled]=\"\n                      isLoading ||\n                      limitStatus?.isReached ||\n                      (!singleRequest.securityToken && requireSecurityToken)\n                    \"\n                  >\n                    {{ 'Accept' | translate }}\n                  </button>\n                </div>\n              </ng-container>\n\n              <div class=\"card-footer separator text-center card-column-50\">\n                <small *ngIf=\"isManagementTenant; else noManagement\" class=\"d-contents\">\n                  <div class=\"d-contents\" *ngIf=\"singleRequest.creationTime && singleRequest.owner\">\n                    <span class=\"text-label-small\" translate>Created on`date`</span>\n                    <span class=\"card-column-50\">\n                      {{ singleRequest.creationTime | c8yDate }}\n                    </span>\n                    <span class=\"text-label-small m-l-4 m-r-4\" translate>by`user`</span>\n                    <span class=\"card-column-30\">\n                      <span class=\"text-truncate\" title=\"{{ singleRequest.owner }}\">\n                        {{ singleRequest.owner }}\n                      </span>\n                    </span>\n                    <span class=\"text-label-small m-l-4 m-r-4\" translate>in`tenant`</span>\n                    <span class=\"card-column-20\">{{ singleRequest.tenantId }}</span>\n                  </div>\n                  <div\n                    class=\"d-contents\"\n                    *ngIf=\"!singleRequest.creationTime || !singleRequest.owner\"\n                  >\n                    <div class=\"card-column-50\"></div>\n                    <div class=\"card-column-30\"></div>\n                    <span class=\"text-label-small\" translate>Created in`tenant`</span>\n                    <div class=\"card-column-20\">\n                      <span>\n                        {{ singleRequest.tenantId }}\n                      </span>\n                    </div>\n                  </div>\n                </small>\n                <ng-template #noManagement>\n                  <small class=\"d-contents\">\n                    <span class=\"text-label-small m-l-4 m-r-4\" translate>Created on`date`</span>\n                    <span class=\"card-column-50\">\n                      {{ singleRequest.creationTime | c8yDate }}\n                    </span>\n                    <span class=\"text-label-small m-l-4 m-r-4\" translate>by`user`</span>\n                    <span class=\"card-column-50\">\n                      <span class=\"text-truncate\" title=\"{{ singleRequest.owner }}\">\n                        {{ singleRequest.owner }}\n                      </span>\n                    </span>\n                  </small>\n                </ng-template>\n              </div>\n            </div>\n          </div>\n        </ng-container>\n      </div>\n      <c8y-load-more\n        [paging]=\"deviceRequestList.paging\"\n        [hidden]=\"true\"\n        (onLoad)=\"updateList($event)\"\n      ></c8y-load-more>\n    </ng-container>\n\n    <ng-template #noData>\n      <div class=\"c8y-empty-state m-t-40 text-center\">\n        <h1 class=\"c8y-icon c8y-icon-device-connect c8y-icon-duocolor\"></h1>\n        <ng-container *ngIf=\"limitStatus?.isReached; else limitNotReached\">\n          <h3>\n            {{ limitReachedInfo$ | async }}\n          </h3>\n          <p translate>Please contact your platform administrator.</p>\n        </ng-container>\n        <ng-template #limitNotReached>\n          <h3 translate>No pending registrations to display.</h3>\n          <p *c8yIfAllowed=\"['ROLE_DEVICE_CONTROL_ADMIN']\" translate>\n            Use the \"Register device\" dropdown in the top right corner.\n          </p>\n        </ng-template>\n      </div>\n    </ng-template>\n  </ng-container>\n</ng-container>\n" }]
-        }], ctorParameters: function () { return [{ type: RegisterDeviceService }, { type: i2$1.DeviceBootstrapRealtimeService }, { type: i2$1.TenantUiService }, { type: i2$1.ModalService }, { type: i3$1.TranslateService }, { type: i2$1.OptionsService }]; } });
+        }], ctorParameters: function () { return [{ type: RegisterDeviceService }, { type: i2.DeviceBootstrapRealtimeService }, { type: i2.TenantUiService }, { type: i2.ModalService }, { type: i3$1.TranslateService }, { type: i2.OptionsService }]; } });
 
 class RegisterDeviceNavigationFactory {
     constructor(permissions) {
@@ -650,26 +650,16 @@ class RegisterDeviceNavigationFactory {
         return nav;
     }
 }
-RegisterDeviceNavigationFactory.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.0.6", ngImport: i0, type: RegisterDeviceNavigationFactory, deps: [{ token: i2$1.Permissions }], target: i0.ɵɵFactoryTarget.Injectable });
+RegisterDeviceNavigationFactory.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.0.6", ngImport: i0, type: RegisterDeviceNavigationFactory, deps: [{ token: i2.Permissions }], target: i0.ɵɵFactoryTarget.Injectable });
 RegisterDeviceNavigationFactory.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "14.0.6", ngImport: i0, type: RegisterDeviceNavigationFactory });
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.0.6", ngImport: i0, type: RegisterDeviceNavigationFactory, decorators: [{
             type: Injectable
-        }], ctorParameters: function () { return [{ type: i2$1.Permissions }]; } });
+        }], ctorParameters: function () { return [{ type: i2.Permissions }]; } });
 
 class BaseExtensibleDeviceRegistrationService {
-    constructor(router, stateService, client, tenantUiService) {
-        this.tenantUiService = tenantUiService;
-        this.router = router;
+    constructor(applicationService, stateService) {
+        this.applicationService = applicationService;
         this.stateService = stateService;
-        this.client = client;
-    }
-    getDeviceRegistrationProviders(bulk) {
-        let providers = [];
-        const microservices = this.tenantUiService.getSubscribedMicroservicesInCurrentTenant();
-        if (microservices && microservices.length > 0) {
-            providers = this.getProvidersFromManifestExtensions(microservices, bulk).concat(this.getProvidersFromExtensions(microservices, bulk));
-        }
-        return providers;
     }
     getMetadataUrl(contextPath) {
         return `${this.getServiceBaseUrl(contextPath)}/metadata`;
@@ -680,6 +670,23 @@ class BaseExtensibleDeviceRegistrationService {
         }
         return `/service/${contextPath}/deviceRegistration`;
     }
+    async getDeviceRegistrationProviders(bulk) {
+        let providers = [];
+        const microservices = await this.listMicroservicesByUser();
+        if (microservices && microservices.length > 0) {
+            providers = this.getProvidersFromManifestExtensions(microservices, bulk).concat(this.getProvidersFromExtensions(microservices, bulk));
+        }
+        return providers;
+    }
+    async listMicroservicesByUser() {
+        const { data } = await this.applicationService.listByUser(this.stateService?.currentUser?.value?.userName, {
+            dropOverwrittenApps: true,
+            noPaging: true,
+            pageSize: 100,
+            withTotalPages: true
+        });
+        return data?.filter(({ type }) => type === ApplicationType.MICROSERVICE);
+    }
     getProvidersFromManifestExtensions(applications, bulk) {
         return flatMap(applications, application => {
             return application?.manifest?.extensions?.map(extension => {
@@ -708,8 +715,11 @@ class BaseExtensibleDeviceRegistrationService {
 }
 
 class ExtensibleDeviceRegistrationService extends BaseExtensibleDeviceRegistrationService {
-    constructor(router, stateService, client, tenantUiService) {
-        super(router, stateService, client, tenantUiService);
+    constructor(applicationService, stateService, client) {
+        super(applicationService, stateService);
+        this.applicationService = applicationService;
+        this.stateService = stateService;
+        this.client = client;
     }
     async getSchema(contextPath) {
         const response = await this.client.fetch(this.getMetadataUrl(contextPath), {
@@ -737,11 +747,11 @@ class ExtensibleDeviceRegistrationService extends BaseExtensibleDeviceRegistrati
         return { res, data };
     }
 }
-ExtensibleDeviceRegistrationService.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.0.6", ngImport: i0, type: ExtensibleDeviceRegistrationService, deps: [{ token: i1.Router }, { token: i2$1.AppStateService }, { token: i2.FetchClient }, { token: i2$1.TenantUiService }], target: i0.ɵɵFactoryTarget.Injectable });
+ExtensibleDeviceRegistrationService.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.0.6", ngImport: i0, type: ExtensibleDeviceRegistrationService, deps: [{ token: i1$1.ApplicationService }, { token: i2.AppStateService }, { token: i1$1.FetchClient }], target: i0.ɵɵFactoryTarget.Injectable });
 ExtensibleDeviceRegistrationService.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "14.0.6", ngImport: i0, type: ExtensibleDeviceRegistrationService });
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.0.6", ngImport: i0, type: ExtensibleDeviceRegistrationService, decorators: [{
             type: Injectable
-        }], ctorParameters: function () { return [{ type: i1.Router }, { type: i2$1.AppStateService }, { type: i2.FetchClient }, { type: i2$1.TenantUiService }]; } });
+        }], ctorParameters: function () { return [{ type: i1$1.ApplicationService }, { type: i2.AppStateService }, { type: i1$1.FetchClient }]; } });
 
 class ExtensibleDeviceRegistrationStepperComponent {
     constructor(customProviderService, registerDeviceService, bsModalRef) {
@@ -818,12 +828,12 @@ class ExtensibleDeviceRegistrationStepperComponent {
         this.errorMessage = message;
     }
 }
-ExtensibleDeviceRegistrationStepperComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.0.6", ngImport: i0, type: ExtensibleDeviceRegistrationStepperComponent, deps: [{ token: ExtensibleDeviceRegistrationService }, { token: RegisterDeviceService }, { token: i1$1.BsModalRef }], target: i0.ɵɵFactoryTarget.Component });
-ExtensibleDeviceRegistrationStepperComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.0.6", type: ExtensibleDeviceRegistrationStepperComponent, selector: "c8y-extensible-device-registration-stepper", inputs: { contextPath: "contextPath", labels: "labels", steps: "steps" }, viewQueries: [{ propertyName: "stepper", first: true, predicate: C8yStepper, descendants: true, static: true }], ngImport: i0, template: "<c8y-stepper\n  [disableProgressButtons]=\"true\"\n  [disableDefaultIcons]=\"{ edit: true, done: false }\"\n  [customClasses]=\"['m-40', 'm-t-8', 'm-b-16']\"\n>\n  <cdk-step *ngFor=\"let step of steps; let i = index\" [stepControl]=\"forms[i]\" [label]=\"labels[i]\">\n    <c8y-form-group class=\"form-group p-24 p-b-0 p-t-16\">\n      <formly-form [form]=\"forms[i]\" [fields]=\"step\" [model]=\"model\"></formly-form>\n    </c8y-form-group>\n    <c8y-stepper-buttons\n      class=\"sticky-bottom d-block modal-footer separator-top bg-component\"\n      *ngIf=\"isRegistrationStep()\"\n      [showButtons]=\"{ cancel: true, back: true, next: true }\"\n      [labels]=\"{ next: 'Register' }\"\n      (onCancel)=\"close()\"\n      (onNext)=\"save()\"\n      [pending]=\"pendingStatus\"\n      [disabled]=\"forms[i].invalid\"\n    ></c8y-stepper-buttons>\n    <c8y-stepper-buttons\n      class=\"sticky-bottom d-block modal-footer separator-top bg-component\"\n      *ngIf=\"!isRegistrationStep()\"\n      [showButtons]=\"{ cancel: true, back: i !== 0, next: true }\"\n      [disabled]=\"forms[i].invalid\"\n      (onCancel)=\"close()\"\n    ></c8y-stepper-buttons>\n  </cdk-step>\n  <cdk-step [state]=\"finalStepStatus()\" label=\"{{ 'Summary' | translate }}\">\n    <c8y-operation-result\n      *ngIf=\"!errorMessage; else errorInfo\"\n      text=\"{{ message | translate }}\"\n      [size]=\"84\"\n      [vertical]=\"true\"\n      type=\"success\"\n      class=\"lead\"\n      data-cy=\"success\"\n    ></c8y-operation-result>\n    <ng-template #errorInfo>\n      <c8y-operation-result\n        text=\"{{ errorMessage | translate }}\"\n        [size]=\"84\"\n        [vertical]=\"true\"\n        type=\"error\"\n        class=\"lead\"\n        data-cy=\"error\"\n      ></c8y-operation-result>\n    </ng-template>\n    <c8y-stepper-buttons\n      class=\"sticky-bottom d-block modal-footer separator-top bg-component\"\n      [showButtons]=\"{ cancel: errorMessage, back: errorMessage, next: !errorMessage }\"\n      [labels]=\"{ back: 'Fix issue', next: 'Close' }\"\n      (onCancel)=\"close()\"\n      (onNext)=\"complete()\"\n      (onBack)=\"goToFirstStep()\"\n    ></c8y-stepper-buttons>\n  </cdk-step>\n</c8y-stepper>\n", dependencies: [{ kind: "directive", type: i5.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i5.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: i2$1.OperationResultComponent, selector: "c8y-operation-result", inputs: ["text", "vertical", "size", "type"] }, { kind: "component", type: i2$1.FormGroupComponent, selector: "c8y-form-group", inputs: ["hasError", "hasWarning", "hasSuccess", "novalidation", "status"] }, { kind: "component", type: i2$1.C8yStepper, selector: "c8y-stepper", inputs: ["disableDefaultIcons", "disableProgressButtons", "customClasses", "hideStepProgress", "useStepLabelsAsTitlesOnly"], outputs: ["onStepChange"] }, { kind: "component", type: i6.CdkStep, selector: "cdk-step", inputs: ["stepControl", "label", "errorMessage", "aria-label", "aria-labelledby", "state", "editable", "optional", "completed", "hasError"], outputs: ["interacted"], exportAs: ["cdkStep"] }, { kind: "component", type: i2$1.C8yStepperButtons, selector: "c8y-stepper-buttons", inputs: ["labels", "pending", "disabled", "showButtons"], outputs: ["onCancel", "onNext", "onBack", "onCustom"] }, { kind: "component", type: i7.FormlyForm, selector: "formly-form", inputs: ["model", "fields", "options", "form"], outputs: ["modelChange"] }, { kind: "pipe", type: i2$1.C8yTranslatePipe, name: "translate" }] });
+ExtensibleDeviceRegistrationStepperComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.0.6", ngImport: i0, type: ExtensibleDeviceRegistrationStepperComponent, deps: [{ token: ExtensibleDeviceRegistrationService }, { token: RegisterDeviceService }, { token: i1$2.BsModalRef }], target: i0.ɵɵFactoryTarget.Component });
+ExtensibleDeviceRegistrationStepperComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.0.6", type: ExtensibleDeviceRegistrationStepperComponent, selector: "c8y-extensible-device-registration-stepper", inputs: { contextPath: "contextPath", labels: "labels", steps: "steps" }, viewQueries: [{ propertyName: "stepper", first: true, predicate: C8yStepper, descendants: true, static: true }], ngImport: i0, template: "<c8y-stepper\n  [disableProgressButtons]=\"true\"\n  [disableDefaultIcons]=\"{ edit: true, done: false }\"\n  [customClasses]=\"['m-40', 'm-t-8', 'm-b-16']\"\n>\n  <cdk-step *ngFor=\"let step of steps; let i = index\" [stepControl]=\"forms[i]\" [label]=\"labels[i]\">\n    <c8y-form-group class=\"form-group p-24 p-b-0 p-t-16\">\n      <formly-form [form]=\"forms[i]\" [fields]=\"step\" [model]=\"model\"></formly-form>\n    </c8y-form-group>\n    <c8y-stepper-buttons\n      class=\"sticky-bottom d-block modal-footer separator-top bg-component\"\n      *ngIf=\"isRegistrationStep()\"\n      [showButtons]=\"{ cancel: true, back: true, next: true }\"\n      [labels]=\"{ next: 'Register' }\"\n      (onCancel)=\"close()\"\n      (onNext)=\"save()\"\n      [pending]=\"pendingStatus\"\n      [disabled]=\"forms[i].invalid\"\n    ></c8y-stepper-buttons>\n    <c8y-stepper-buttons\n      class=\"sticky-bottom d-block modal-footer separator-top bg-component\"\n      *ngIf=\"!isRegistrationStep()\"\n      [showButtons]=\"{ cancel: true, back: i !== 0, next: true }\"\n      [disabled]=\"forms[i].invalid\"\n      (onCancel)=\"close()\"\n    ></c8y-stepper-buttons>\n  </cdk-step>\n  <cdk-step [state]=\"finalStepStatus()\" label=\"{{ 'Summary' | translate }}\">\n    <c8y-operation-result\n      *ngIf=\"!errorMessage; else errorInfo\"\n      text=\"{{ message | translate }}\"\n      [size]=\"84\"\n      [vertical]=\"true\"\n      type=\"success\"\n      class=\"lead\"\n      data-cy=\"success\"\n    ></c8y-operation-result>\n    <ng-template #errorInfo>\n      <c8y-operation-result\n        text=\"{{ errorMessage | translate }}\"\n        [size]=\"84\"\n        [vertical]=\"true\"\n        type=\"error\"\n        class=\"lead\"\n        data-cy=\"error\"\n      ></c8y-operation-result>\n    </ng-template>\n    <c8y-stepper-buttons\n      class=\"sticky-bottom d-block modal-footer separator-top bg-component\"\n      [showButtons]=\"{ cancel: errorMessage, back: errorMessage, next: !errorMessage }\"\n      [labels]=\"{ back: 'Fix issue', next: 'Close' }\"\n      (onCancel)=\"close()\"\n      (onNext)=\"complete()\"\n      (onBack)=\"goToFirstStep()\"\n    ></c8y-stepper-buttons>\n  </cdk-step>\n</c8y-stepper>\n", dependencies: [{ kind: "directive", type: i5.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i5.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: i2.OperationResultComponent, selector: "c8y-operation-result", inputs: ["text", "vertical", "size", "type"] }, { kind: "component", type: i2.FormGroupComponent, selector: "c8y-form-group", inputs: ["hasError", "hasWarning", "hasSuccess", "novalidation", "status"] }, { kind: "component", type: i2.C8yStepper, selector: "c8y-stepper", inputs: ["disableDefaultIcons", "disableProgressButtons", "customClasses", "hideStepProgress", "useStepLabelsAsTitlesOnly"], outputs: ["onStepChange"] }, { kind: "component", type: i6.CdkStep, selector: "cdk-step", inputs: ["stepControl", "label", "errorMessage", "aria-label", "aria-labelledby", "state", "editable", "optional", "completed", "hasError"], outputs: ["interacted"], exportAs: ["cdkStep"] }, { kind: "component", type: i2.C8yStepperButtons, selector: "c8y-stepper-buttons", inputs: ["labels", "pending", "disabled", "showButtons"], outputs: ["onCancel", "onNext", "onBack", "onCustom"] }, { kind: "component", type: i7.FormlyForm, selector: "formly-form", inputs: ["model", "fields", "options", "form"], outputs: ["modelChange"] }, { kind: "pipe", type: i2.C8yTranslatePipe, name: "translate" }] });
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.0.6", ngImport: i0, type: ExtensibleDeviceRegistrationStepperComponent, decorators: [{
             type: Component,
             args: [{ selector: 'c8y-extensible-device-registration-stepper', template: "<c8y-stepper\n  [disableProgressButtons]=\"true\"\n  [disableDefaultIcons]=\"{ edit: true, done: false }\"\n  [customClasses]=\"['m-40', 'm-t-8', 'm-b-16']\"\n>\n  <cdk-step *ngFor=\"let step of steps; let i = index\" [stepControl]=\"forms[i]\" [label]=\"labels[i]\">\n    <c8y-form-group class=\"form-group p-24 p-b-0 p-t-16\">\n      <formly-form [form]=\"forms[i]\" [fields]=\"step\" [model]=\"model\"></formly-form>\n    </c8y-form-group>\n    <c8y-stepper-buttons\n      class=\"sticky-bottom d-block modal-footer separator-top bg-component\"\n      *ngIf=\"isRegistrationStep()\"\n      [showButtons]=\"{ cancel: true, back: true, next: true }\"\n      [labels]=\"{ next: 'Register' }\"\n      (onCancel)=\"close()\"\n      (onNext)=\"save()\"\n      [pending]=\"pendingStatus\"\n      [disabled]=\"forms[i].invalid\"\n    ></c8y-stepper-buttons>\n    <c8y-stepper-buttons\n      class=\"sticky-bottom d-block modal-footer separator-top bg-component\"\n      *ngIf=\"!isRegistrationStep()\"\n      [showButtons]=\"{ cancel: true, back: i !== 0, next: true }\"\n      [disabled]=\"forms[i].invalid\"\n      (onCancel)=\"close()\"\n    ></c8y-stepper-buttons>\n  </cdk-step>\n  <cdk-step [state]=\"finalStepStatus()\" label=\"{{ 'Summary' | translate }}\">\n    <c8y-operation-result\n      *ngIf=\"!errorMessage; else errorInfo\"\n      text=\"{{ message | translate }}\"\n      [size]=\"84\"\n      [vertical]=\"true\"\n      type=\"success\"\n      class=\"lead\"\n      data-cy=\"success\"\n    ></c8y-operation-result>\n    <ng-template #errorInfo>\n      <c8y-operation-result\n        text=\"{{ errorMessage | translate }}\"\n        [size]=\"84\"\n        [vertical]=\"true\"\n        type=\"error\"\n        class=\"lead\"\n        data-cy=\"error\"\n      ></c8y-operation-result>\n    </ng-template>\n    <c8y-stepper-buttons\n      class=\"sticky-bottom d-block modal-footer separator-top bg-component\"\n      [showButtons]=\"{ cancel: errorMessage, back: errorMessage, next: !errorMessage }\"\n      [labels]=\"{ back: 'Fix issue', next: 'Close' }\"\n      (onCancel)=\"close()\"\n      (onNext)=\"complete()\"\n      (onBack)=\"goToFirstStep()\"\n    ></c8y-stepper-buttons>\n  </cdk-step>\n</c8y-stepper>\n" }]
-        }], ctorParameters: function () { return [{ type: ExtensibleDeviceRegistrationService }, { type: RegisterDeviceService }, { type: i1$1.BsModalRef }]; }, propDecorators: { stepper: [{
+        }], ctorParameters: function () { return [{ type: ExtensibleDeviceRegistrationService }, { type: RegisterDeviceService }, { type: i1$2.BsModalRef }]; }, propDecorators: { stepper: [{
                 type: ViewChild,
                 args: [C8yStepper, { static: true }]
             }], contextPath: [{
@@ -858,12 +868,12 @@ class ExtensibleDeviceRegistrationModalComponent {
         });
     }
 }
-ExtensibleDeviceRegistrationModalComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.0.6", ngImport: i0, type: ExtensibleDeviceRegistrationModalComponent, deps: [{ token: i1$1.BsModalRef }, { token: i2$1.C8yJSONSchema }, { token: ExtensibleDeviceRegistrationService }], target: i0.ɵɵFactoryTarget.Component });
-ExtensibleDeviceRegistrationModalComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.0.6", type: ExtensibleDeviceRegistrationModalComponent, selector: "extensible-device-registration-modal", ngImport: i0, template: "<c8y-modal [title]=\"title | translate\" [headerClasses]=\"'dialog-header'\" [customFooter]=\"true\">\n  <ng-container c8y-modal-title>\n    <span class=\"c8y-icon c8y-icon-device-connect\"></span>\n  </ng-container>\n  <ng-container *ngIf=\"pages as steps; else loadingOrError\">\n    <c8y-extensible-device-registration-stepper\n      c8y-modal-body\n      [steps]=\"steps\"\n      [labels]=\"labels\"\n      [contextPath]=\"contextPath\"\n    ></c8y-extensible-device-registration-stepper>\n  </ng-container>\n  <ng-template #loadingOrError>\n    <ng-container *ngIf=\"loadingErrorMessage; else loading\">\n      <c8y-operation-result\n        text=\"{{ loadingErrorMessage | translate }}\"\n        [size]=\"84\"\n        [vertical]=\"true\"\n        type=\"error\"\n        class=\"lead text-regular\"\n        data-cy=\"error\"\n      ></c8y-operation-result>\n      <div class=\"modal-footer\">\n        <button\n          title=\"{{ 'Close' | translate }}\"\n          (click)=\"bsModalRef.hide()\"\n          type=\"button\"\n          class=\"btn btn-default\"\n        >\n          {{ 'Close' | translate }}\n        </button>\n      </div>\n    </ng-container>\n    <ng-template #loading>\n      <div class=\"modal-header modal-header-info text-center\">\n        <c8y-progress-bar\n          [message]=\"'Loading the registration form definition\u2026' | translate\"\n          class=\"text-center\"\n        ></c8y-progress-bar>\n      </div>\n    </ng-template>\n  </ng-template>\n</c8y-modal>\n", dependencies: [{ kind: "directive", type: i5.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: i2$1.ProgressBarComponent, selector: "c8y-progress-bar", inputs: ["message", "progress"] }, { kind: "component", type: i2$1.OperationResultComponent, selector: "c8y-operation-result", inputs: ["text", "vertical", "size", "type"] }, { kind: "component", type: i2$1.ModalComponent, selector: "c8y-modal", inputs: ["disabled", "close", "dismiss", "title", "body", "customFooter", "headerClasses", "labels"], outputs: ["onDismiss", "onClose"] }, { kind: "component", type: ExtensibleDeviceRegistrationStepperComponent, selector: "c8y-extensible-device-registration-stepper", inputs: ["contextPath", "labels", "steps"] }, { kind: "pipe", type: i2$1.C8yTranslatePipe, name: "translate" }] });
+ExtensibleDeviceRegistrationModalComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.0.6", ngImport: i0, type: ExtensibleDeviceRegistrationModalComponent, deps: [{ token: i1$2.BsModalRef }, { token: i2.C8yJSONSchema }, { token: ExtensibleDeviceRegistrationService }], target: i0.ɵɵFactoryTarget.Component });
+ExtensibleDeviceRegistrationModalComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.0.6", type: ExtensibleDeviceRegistrationModalComponent, selector: "extensible-device-registration-modal", ngImport: i0, template: "<c8y-modal [title]=\"title | translate\" [headerClasses]=\"'dialog-header'\" [customFooter]=\"true\">\n  <ng-container c8y-modal-title>\n    <span class=\"c8y-icon c8y-icon-device-connect\"></span>\n  </ng-container>\n  <ng-container *ngIf=\"pages as steps; else loadingOrError\">\n    <c8y-extensible-device-registration-stepper\n      c8y-modal-body\n      [steps]=\"steps\"\n      [labels]=\"labels\"\n      [contextPath]=\"contextPath\"\n    ></c8y-extensible-device-registration-stepper>\n  </ng-container>\n  <ng-template #loadingOrError>\n    <ng-container *ngIf=\"loadingErrorMessage; else loading\">\n      <c8y-operation-result\n        text=\"{{ loadingErrorMessage | translate }}\"\n        [size]=\"84\"\n        [vertical]=\"true\"\n        type=\"error\"\n        class=\"lead text-regular\"\n        data-cy=\"error\"\n      ></c8y-operation-result>\n      <div class=\"modal-footer\">\n        <button\n          title=\"{{ 'Close' | translate }}\"\n          (click)=\"bsModalRef.hide()\"\n          type=\"button\"\n          class=\"btn btn-default\"\n        >\n          {{ 'Close' | translate }}\n        </button>\n      </div>\n    </ng-container>\n    <ng-template #loading>\n      <div class=\"modal-header modal-header-info text-center\">\n        <c8y-progress-bar\n          [message]=\"'Loading the registration form definition\u2026' | translate\"\n          class=\"text-center\"\n        ></c8y-progress-bar>\n      </div>\n    </ng-template>\n  </ng-template>\n</c8y-modal>\n", dependencies: [{ kind: "directive", type: i5.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: i2.ProgressBarComponent, selector: "c8y-progress-bar", inputs: ["message", "progress"] }, { kind: "component", type: i2.OperationResultComponent, selector: "c8y-operation-result", inputs: ["text", "vertical", "size", "type"] }, { kind: "component", type: i2.ModalComponent, selector: "c8y-modal", inputs: ["disabled", "close", "dismiss", "title", "body", "customFooter", "headerClasses", "labels"], outputs: ["onDismiss", "onClose"] }, { kind: "component", type: ExtensibleDeviceRegistrationStepperComponent, selector: "c8y-extensible-device-registration-stepper", inputs: ["contextPath", "labels", "steps"] }, { kind: "pipe", type: i2.C8yTranslatePipe, name: "translate" }] });
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.0.6", ngImport: i0, type: ExtensibleDeviceRegistrationModalComponent, decorators: [{
             type: Component,
             args: [{ selector: 'extensible-device-registration-modal', template: "<c8y-modal [title]=\"title | translate\" [headerClasses]=\"'dialog-header'\" [customFooter]=\"true\">\n  <ng-container c8y-modal-title>\n    <span class=\"c8y-icon c8y-icon-device-connect\"></span>\n  </ng-container>\n  <ng-container *ngIf=\"pages as steps; else loadingOrError\">\n    <c8y-extensible-device-registration-stepper\n      c8y-modal-body\n      [steps]=\"steps\"\n      [labels]=\"labels\"\n      [contextPath]=\"contextPath\"\n    ></c8y-extensible-device-registration-stepper>\n  </ng-container>\n  <ng-template #loadingOrError>\n    <ng-container *ngIf=\"loadingErrorMessage; else loading\">\n      <c8y-operation-result\n        text=\"{{ loadingErrorMessage | translate }}\"\n        [size]=\"84\"\n        [vertical]=\"true\"\n        type=\"error\"\n        class=\"lead text-regular\"\n        data-cy=\"error\"\n      ></c8y-operation-result>\n      <div class=\"modal-footer\">\n        <button\n          title=\"{{ 'Close' | translate }}\"\n          (click)=\"bsModalRef.hide()\"\n          type=\"button\"\n          class=\"btn btn-default\"\n        >\n          {{ 'Close' | translate }}\n        </button>\n      </div>\n    </ng-container>\n    <ng-template #loading>\n      <div class=\"modal-header modal-header-info text-center\">\n        <c8y-progress-bar\n          [message]=\"'Loading the registration form definition\u2026' | translate\"\n          class=\"text-center\"\n        ></c8y-progress-bar>\n      </div>\n    </ng-template>\n  </ng-template>\n</c8y-modal>\n" }]
-        }], ctorParameters: function () { return [{ type: i1$1.BsModalRef }, { type: i2$1.C8yJSONSchema }, { type: ExtensibleDeviceRegistrationService }]; } });
+        }], ctorParameters: function () { return [{ type: i1$2.BsModalRef }, { type: i2.C8yJSONSchema }, { type: ExtensibleDeviceRegistrationService }]; } });
 
 class ExtensibleDeviceRegistrationButtonComponent {
     constructor(deviceRegistrationService, modalService) {
@@ -884,16 +894,19 @@ class ExtensibleDeviceRegistrationButtonComponent {
         });
     }
 }
-ExtensibleDeviceRegistrationButtonComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.0.6", ngImport: i0, type: ExtensibleDeviceRegistrationButtonComponent, deps: [{ token: ExtensibleDeviceRegistrationService }, { token: i1$1.BsModalService }], target: i0.ɵɵFactoryTarget.Component });
-ExtensibleDeviceRegistrationButtonComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.0.6", type: ExtensibleDeviceRegistrationButtonComponent, selector: "extensible-device-registration-provider", ngImport: i0, template: "<div *ngFor=\"let provider of providersMetaData\">\n  <button title=\"{{ provider.name | translate }}\" type=\"button\" (click)=\"click(provider)\">\n    <i c8yIcon=\"c8y-device-connect\"></i>\n    {{ provider.name | translate }}\n  </button>\n</div>\n", dependencies: [{ kind: "directive", type: i2$1.IconDirective, selector: "[c8yIcon]", inputs: ["c8yIcon"] }, { kind: "directive", type: i5.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "pipe", type: i2$1.C8yTranslatePipe, name: "translate" }] });
+ExtensibleDeviceRegistrationButtonComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.0.6", ngImport: i0, type: ExtensibleDeviceRegistrationButtonComponent, deps: [{ token: ExtensibleDeviceRegistrationService }, { token: i1$2.BsModalService }], target: i0.ɵɵFactoryTarget.Component });
+ExtensibleDeviceRegistrationButtonComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.0.6", type: ExtensibleDeviceRegistrationButtonComponent, selector: "extensible-device-registration-provider", ngImport: i0, template: "<div *ngFor=\"let provider of providersMetaData | async\">\n  <button title=\"{{ provider.name | translate }}\" type=\"button\" (click)=\"click(provider)\">\n    <i c8yIcon=\"c8y-device-connect\"></i>\n    {{ provider.name | translate }}\n  </button>\n</div>\n", dependencies: [{ kind: "directive", type: i2.IconDirective, selector: "[c8yIcon]", inputs: ["c8yIcon"] }, { kind: "directive", type: i5.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "pipe", type: i2.C8yTranslatePipe, name: "translate" }, { kind: "pipe", type: i5.AsyncPipe, name: "async" }] });
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.0.6", ngImport: i0, type: ExtensibleDeviceRegistrationButtonComponent, decorators: [{
             type: Component,
-            args: [{ selector: 'extensible-device-registration-provider', template: "<div *ngFor=\"let provider of providersMetaData\">\n  <button title=\"{{ provider.name | translate }}\" type=\"button\" (click)=\"click(provider)\">\n    <i c8yIcon=\"c8y-device-connect\"></i>\n    {{ provider.name | translate }}\n  </button>\n</div>\n" }]
-        }], ctorParameters: function () { return [{ type: ExtensibleDeviceRegistrationService }, { type: i1$1.BsModalService }]; } });
+            args: [{ selector: 'extensible-device-registration-provider', template: "<div *ngFor=\"let provider of providersMetaData | async\">\n  <button title=\"{{ provider.name | translate }}\" type=\"button\" (click)=\"click(provider)\">\n    <i c8yIcon=\"c8y-device-connect\"></i>\n    {{ provider.name | translate }}\n  </button>\n</div>\n" }]
+        }], ctorParameters: function () { return [{ type: ExtensibleDeviceRegistrationService }, { type: i1$2.BsModalService }]; } });
 
 class BulkExtensibleDeviceRegistrationService extends BaseExtensibleDeviceRegistrationService {
-    constructor(router, stateService, client, tenantUiService) {
-        super(router, stateService, client, tenantUiService);
+    constructor(applicationService, stateService, client) {
+        super(applicationService, stateService);
+        this.applicationService = applicationService;
+        this.stateService = stateService;
+        this.client = client;
     }
     getDeviceRegistrationProviders() {
         return super.getDeviceRegistrationProviders(true);
@@ -924,11 +937,11 @@ class BulkExtensibleDeviceRegistrationService extends BaseExtensibleDeviceRegist
         return body;
     }
 }
-BulkExtensibleDeviceRegistrationService.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.0.6", ngImport: i0, type: BulkExtensibleDeviceRegistrationService, deps: [{ token: i1.Router }, { token: i2$1.AppStateService }, { token: i2.FetchClient }, { token: i2$1.TenantUiService }], target: i0.ɵɵFactoryTarget.Injectable });
+BulkExtensibleDeviceRegistrationService.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.0.6", ngImport: i0, type: BulkExtensibleDeviceRegistrationService, deps: [{ token: i1$1.ApplicationService }, { token: i2.AppStateService }, { token: i1$1.FetchClient }], target: i0.ɵɵFactoryTarget.Injectable });
 BulkExtensibleDeviceRegistrationService.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "14.0.6", ngImport: i0, type: BulkExtensibleDeviceRegistrationService });
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.0.6", ngImport: i0, type: BulkExtensibleDeviceRegistrationService, decorators: [{
             type: Injectable
-        }], ctorParameters: function () { return [{ type: i1.Router }, { type: i2$1.AppStateService }, { type: i2.FetchClient }, { type: i2$1.TenantUiService }]; } });
+        }], ctorParameters: function () { return [{ type: i1$1.ApplicationService }, { type: i2.AppStateService }, { type: i1$1.FetchClient }]; } });
 
 const bulkSchema$1 = {
     $schema: 'https://json-schema.org/draft/2019-09/schema',
@@ -1015,12 +1028,12 @@ class ExtensibleBulkDeviceRegistrationModalComponent {
         this.bsModalRef.hide();
     }
 }
-ExtensibleBulkDeviceRegistrationModalComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.0.6", ngImport: i0, type: ExtensibleBulkDeviceRegistrationModalComponent, deps: [{ token: i2$1.C8yJSONSchema }, { token: BulkExtensibleDeviceRegistrationService }, { token: RegisterDeviceService }, { token: i1$1.BsModalRef }], target: i0.ɵɵFactoryTarget.Component });
-ExtensibleBulkDeviceRegistrationModalComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.0.6", type: ExtensibleBulkDeviceRegistrationModalComponent, selector: "extensible-device-registration-modal-component", viewQueries: [{ propertyName: "stepper", first: true, predicate: C8yStepper, descendants: true, static: true }], ngImport: i0, template: "<c8y-modal\n  [title]=\"title | translate\"\n  [headerClasses]=\"'dialog-header'\"\n  [customFooter]=\"true\"\n>\n  <ng-container c8y-modal-title>\n    <i c8yIcon=\"c8y-device-connect\"></i>\n  </ng-container>\n  <c8y-stepper [hideStepProgress]=\"true\" linear class=\"p-t-16\" c8y-modal-body>\n    <ng-container *ngIf=\"!loadingError\">\n      <cdk-step>\n        <div class=\"sticky-top bg-component separator-bottom\">\n          <p\n            class=\"p-l-24 p-r-24 p-t-16 p-b-16 m-b-0 separator-bottom text-16 text-medium text-center bg-component\"\n            translate\n          >\n            Register devices in bulk\n          </p>\n          <c8y-form-group class=\"p-24 p-t-16 p-b-8 m-b-0\">\n            <formly-form [form]=\"form\" [fields]=\"template\" [model]=\"model\"></formly-form>\n          </c8y-form-group>\n        </div>\n        <div\n          *ngFor=\"let example of examples\"\n          class=\"bg-gray-white separator-bottom p-t-16 p-b-16 p-l-24 p-r-24\"\n        >\n          <p class=\"m-b-8 text-medium\">\n            {{ example.title | translate }}\n          </p>\n          <p class=\"small m-b-8\">{{ example.description | translate }}</p>\n          <a\n            title=\"{{ 'Download template' | translate }}\"\n            class=\"btn btn-default btn-sm\"\n            target=\"_self\"\n            [href]=\"example.url\"\n            download=\"{{ 'Example bulk registration - template.csv' | translate }}\"\n          >\n            <i c8yIcon=\"download\"></i>\n            <span translate>Download template</span>\n          </a>\n        </div>\n        <c8y-stepper-buttons\n          class=\"sticky-bottom d-block p-t-16 p-b-16 separator-top bg-level-0\"\n          [showButtons]=\"{ cancel: true, next: true }\"\n          [disabled]=\"form.invalid\"\n          [pending]=\"pending\"\n          (onCancel)=\"cancel()\"\n          (onNext)=\"upload()\"\n          [labels]=\"{ next: 'Upload' }\"\n        ></c8y-stepper-buttons>\n      </cdk-step>\n    </ng-container>\n    <cdk-step state=\"final\">\n      <div class=\"p-24\">\n        <div *ngIf=\"success; else fail\">\n          <c8y-operation-result\n            text=\"{{ message | translate }}\"\n            [size]=\"84\"\n            [vertical]=\"true\"\n            type=\"success\"\n            class=\"lead\"\n            data-cy=\"success\"\n          ></c8y-operation-result>\n          <c8y-list-group class=\"separator-top m-t-16\">\n            <c8y-li>\n              <c8y-li-icon class=\"text-success\" [icon]=\"'check-circle'\"></c8y-li-icon>\n              <p translate>File successfully uploaded.</p>\n              <c8y-li-collapse>\n                <pre><code>{{ result | json }}</code></pre>\n              </c8y-li-collapse>\n            </c8y-li>\n          </c8y-list-group>\n        </div>\n        <ng-template #fail>\n          <c8y-operation-result\n            text=\"{{ message | translate }}\"\n            [size]=\"84\"\n            [vertical]=\"true\"\n            type=\"error\"\n            class=\"lead\"\n            data-cy=\"error\"\n          ></c8y-operation-result>\n          <c8y-list-group *ngIf=\"result\" class=\"separator-top m-t-16\">\n            <c8y-li>\n              <c8y-li-icon class=\"text-danger\" [icon]=\"'ban'\"></c8y-li-icon>\n              <p translate>Bulk operation failed.</p>\n              <c8y-li-collapse>\n                <pre><code>{{ result | json }}</code></pre>\n              </c8y-li-collapse>\n            </c8y-li>\n          </c8y-list-group>\n        </ng-template>\n      </div>\n      <c8y-stepper-buttons\n        class=\"sticky-bottom d-block p-t-16 p-b-16 separator-top bg-component\"\n        [showButtons]=\"{ next: true }\"\n        (onNext)=\"complete()\"\n        [labels]=\"{ next: success ? 'Complete' : 'Cancel' }\"\n      ></c8y-stepper-buttons>\n    </cdk-step>\n  </c8y-stepper>\n</c8y-modal>\n", dependencies: [{ kind: "directive", type: i2$1.IconDirective, selector: "[c8yIcon]", inputs: ["c8yIcon"] }, { kind: "directive", type: i2$1.C8yTranslateDirective, selector: "[translate],[ngx-translate]" }, { kind: "directive", type: i5.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i5.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: i2$1.OperationResultComponent, selector: "c8y-operation-result", inputs: ["text", "vertical", "size", "type"] }, { kind: "component", type: i2$1.ModalComponent, selector: "c8y-modal", inputs: ["disabled", "close", "dismiss", "title", "body", "customFooter", "headerClasses", "labels"], outputs: ["onDismiss", "onClose"] }, { kind: "component", type: i2$1.FormGroupComponent, selector: "c8y-form-group", inputs: ["hasError", "hasWarning", "hasSuccess", "novalidation", "status"] }, { kind: "component", type: i2$1.C8yStepper, selector: "c8y-stepper", inputs: ["disableDefaultIcons", "disableProgressButtons", "customClasses", "hideStepProgress", "useStepLabelsAsTitlesOnly"], outputs: ["onStepChange"] }, { kind: "component", type: i6.CdkStep, selector: "cdk-step", inputs: ["stepControl", "label", "errorMessage", "aria-label", "aria-labelledby", "state", "editable", "optional", "completed", "hasError"], outputs: ["interacted"], exportAs: ["cdkStep"] }, { kind: "component", type: i2$1.C8yStepperButtons, selector: "c8y-stepper-buttons", inputs: ["labels", "pending", "disabled", "showButtons"], outputs: ["onCancel", "onNext", "onBack", "onCustom"] }, { kind: "component", type: i2$1.ListGroupComponent, selector: "c8y-list-group" }, { kind: "component", type: i2$1.ListItemComponent, selector: "c8y-list-item, c8y-li", inputs: ["active", "emptyActions", "collapsed", "selectable"], outputs: ["collapsedChange"] }, { kind: "component", type: i2$1.ListItemIconComponent, selector: "c8y-list-item-icon, c8y-li-icon", inputs: ["icon", "status"] }, { kind: "component", type: i2$1.ListItemCollapseComponent, selector: "c8y-list-item-collapse, c8y-li-collapse", inputs: ["collapseWay"] }, { kind: "component", type: i7.FormlyForm, selector: "formly-form", inputs: ["model", "fields", "options", "form"], outputs: ["modelChange"] }, { kind: "pipe", type: i2$1.C8yTranslatePipe, name: "translate" }, { kind: "pipe", type: i5.JsonPipe, name: "json" }] });
+ExtensibleBulkDeviceRegistrationModalComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.0.6", ngImport: i0, type: ExtensibleBulkDeviceRegistrationModalComponent, deps: [{ token: i2.C8yJSONSchema }, { token: BulkExtensibleDeviceRegistrationService }, { token: RegisterDeviceService }, { token: i1$2.BsModalRef }], target: i0.ɵɵFactoryTarget.Component });
+ExtensibleBulkDeviceRegistrationModalComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.0.6", type: ExtensibleBulkDeviceRegistrationModalComponent, selector: "extensible-device-registration-modal-component", viewQueries: [{ propertyName: "stepper", first: true, predicate: C8yStepper, descendants: true, static: true }], ngImport: i0, template: "<c8y-modal\n  [title]=\"title | translate\"\n  [headerClasses]=\"'dialog-header'\"\n  [customFooter]=\"true\"\n>\n  <ng-container c8y-modal-title>\n    <i c8yIcon=\"c8y-device-connect\"></i>\n  </ng-container>\n  <c8y-stepper [hideStepProgress]=\"true\" linear class=\"p-t-16\" c8y-modal-body>\n    <ng-container *ngIf=\"!loadingError\">\n      <cdk-step>\n        <div class=\"sticky-top bg-component separator-bottom\">\n          <p\n            class=\"p-l-24 p-r-24 p-t-16 p-b-16 m-b-0 separator-bottom text-16 text-medium text-center bg-component\"\n            translate\n          >\n            Register devices in bulk\n          </p>\n          <c8y-form-group class=\"p-24 p-t-16 p-b-8 m-b-0\">\n            <formly-form [form]=\"form\" [fields]=\"template\" [model]=\"model\"></formly-form>\n          </c8y-form-group>\n        </div>\n        <div\n          *ngFor=\"let example of examples\"\n          class=\"bg-gray-white separator-bottom p-t-16 p-b-16 p-l-24 p-r-24\"\n        >\n          <p class=\"m-b-8 text-medium\">\n            {{ example.title | translate }}\n          </p>\n          <p class=\"small m-b-8\">{{ example.description | translate }}</p>\n          <a\n            title=\"{{ 'Download template' | translate }}\"\n            class=\"btn btn-default btn-sm\"\n            target=\"_self\"\n            [href]=\"example.url\"\n            download=\"{{ 'Example bulk registration - template.csv' | translate }}\"\n          >\n            <i c8yIcon=\"download\"></i>\n            <span translate>Download template</span>\n          </a>\n        </div>\n        <c8y-stepper-buttons\n          class=\"sticky-bottom d-block p-t-16 p-b-16 separator-top bg-level-0\"\n          [showButtons]=\"{ cancel: true, next: true }\"\n          [disabled]=\"form.invalid\"\n          [pending]=\"pending\"\n          (onCancel)=\"cancel()\"\n          (onNext)=\"upload()\"\n          [labels]=\"{ next: 'Upload' }\"\n        ></c8y-stepper-buttons>\n      </cdk-step>\n    </ng-container>\n    <cdk-step state=\"final\">\n      <div class=\"p-24\">\n        <div *ngIf=\"success; else fail\">\n          <c8y-operation-result\n            text=\"{{ message | translate }}\"\n            [size]=\"84\"\n            [vertical]=\"true\"\n            type=\"success\"\n            class=\"lead\"\n            data-cy=\"success\"\n          ></c8y-operation-result>\n          <c8y-list-group class=\"separator-top m-t-16\">\n            <c8y-li>\n              <c8y-li-icon class=\"text-success\" [icon]=\"'check-circle'\"></c8y-li-icon>\n              <p translate>File successfully uploaded.</p>\n              <c8y-li-collapse>\n                <pre><code>{{ result | json }}</code></pre>\n              </c8y-li-collapse>\n            </c8y-li>\n          </c8y-list-group>\n        </div>\n        <ng-template #fail>\n          <c8y-operation-result\n            text=\"{{ message | translate }}\"\n            [size]=\"84\"\n            [vertical]=\"true\"\n            type=\"error\"\n            class=\"lead\"\n            data-cy=\"error\"\n          ></c8y-operation-result>\n          <c8y-list-group *ngIf=\"result\" class=\"separator-top m-t-16\">\n            <c8y-li>\n              <c8y-li-icon class=\"text-danger\" [icon]=\"'ban'\"></c8y-li-icon>\n              <p translate>Bulk operation failed.</p>\n              <c8y-li-collapse>\n                <pre><code>{{ result | json }}</code></pre>\n              </c8y-li-collapse>\n            </c8y-li>\n          </c8y-list-group>\n        </ng-template>\n      </div>\n      <c8y-stepper-buttons\n        class=\"sticky-bottom d-block p-t-16 p-b-16 separator-top bg-component\"\n        [showButtons]=\"{ next: true }\"\n        (onNext)=\"complete()\"\n        [labels]=\"{ next: success ? 'Complete' : 'Cancel' }\"\n      ></c8y-stepper-buttons>\n    </cdk-step>\n  </c8y-stepper>\n</c8y-modal>\n", dependencies: [{ kind: "directive", type: i2.IconDirective, selector: "[c8yIcon]", inputs: ["c8yIcon"] }, { kind: "directive", type: i2.C8yTranslateDirective, selector: "[translate],[ngx-translate]" }, { kind: "directive", type: i5.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i5.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: i2.OperationResultComponent, selector: "c8y-operation-result", inputs: ["text", "vertical", "size", "type"] }, { kind: "component", type: i2.ModalComponent, selector: "c8y-modal", inputs: ["disabled", "close", "dismiss", "title", "body", "customFooter", "headerClasses", "labels"], outputs: ["onDismiss", "onClose"] }, { kind: "component", type: i2.FormGroupComponent, selector: "c8y-form-group", inputs: ["hasError", "hasWarning", "hasSuccess", "novalidation", "status"] }, { kind: "component", type: i2.C8yStepper, selector: "c8y-stepper", inputs: ["disableDefaultIcons", "disableProgressButtons", "customClasses", "hideStepProgress", "useStepLabelsAsTitlesOnly"], outputs: ["onStepChange"] }, { kind: "component", type: i6.CdkStep, selector: "cdk-step", inputs: ["stepControl", "label", "errorMessage", "aria-label", "aria-labelledby", "state", "editable", "optional", "completed", "hasError"], outputs: ["interacted"], exportAs: ["cdkStep"] }, { kind: "component", type: i2.C8yStepperButtons, selector: "c8y-stepper-buttons", inputs: ["labels", "pending", "disabled", "showButtons"], outputs: ["onCancel", "onNext", "onBack", "onCustom"] }, { kind: "component", type: i2.ListGroupComponent, selector: "c8y-list-group" }, { kind: "component", type: i2.ListItemComponent, selector: "c8y-list-item, c8y-li", inputs: ["active", "emptyActions", "collapsed", "selectable"], outputs: ["collapsedChange"] }, { kind: "component", type: i2.ListItemIconComponent, selector: "c8y-list-item-icon, c8y-li-icon", inputs: ["icon", "status"] }, { kind: "component", type: i2.ListItemCollapseComponent, selector: "c8y-list-item-collapse, c8y-li-collapse", inputs: ["collapseWay"] }, { kind: "component", type: i7.FormlyForm, selector: "formly-form", inputs: ["model", "fields", "options", "form"], outputs: ["modelChange"] }, { kind: "pipe", type: i2.C8yTranslatePipe, name: "translate" }, { kind: "pipe", type: i5.JsonPipe, name: "json" }] });
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.0.6", ngImport: i0, type: ExtensibleBulkDeviceRegistrationModalComponent, decorators: [{
             type: Component,
             args: [{ selector: 'extensible-device-registration-modal-component', template: "<c8y-modal\n  [title]=\"title | translate\"\n  [headerClasses]=\"'dialog-header'\"\n  [customFooter]=\"true\"\n>\n  <ng-container c8y-modal-title>\n    <i c8yIcon=\"c8y-device-connect\"></i>\n  </ng-container>\n  <c8y-stepper [hideStepProgress]=\"true\" linear class=\"p-t-16\" c8y-modal-body>\n    <ng-container *ngIf=\"!loadingError\">\n      <cdk-step>\n        <div class=\"sticky-top bg-component separator-bottom\">\n          <p\n            class=\"p-l-24 p-r-24 p-t-16 p-b-16 m-b-0 separator-bottom text-16 text-medium text-center bg-component\"\n            translate\n          >\n            Register devices in bulk\n          </p>\n          <c8y-form-group class=\"p-24 p-t-16 p-b-8 m-b-0\">\n            <formly-form [form]=\"form\" [fields]=\"template\" [model]=\"model\"></formly-form>\n          </c8y-form-group>\n        </div>\n        <div\n          *ngFor=\"let example of examples\"\n          class=\"bg-gray-white separator-bottom p-t-16 p-b-16 p-l-24 p-r-24\"\n        >\n          <p class=\"m-b-8 text-medium\">\n            {{ example.title | translate }}\n          </p>\n          <p class=\"small m-b-8\">{{ example.description | translate }}</p>\n          <a\n            title=\"{{ 'Download template' | translate }}\"\n            class=\"btn btn-default btn-sm\"\n            target=\"_self\"\n            [href]=\"example.url\"\n            download=\"{{ 'Example bulk registration - template.csv' | translate }}\"\n          >\n            <i c8yIcon=\"download\"></i>\n            <span translate>Download template</span>\n          </a>\n        </div>\n        <c8y-stepper-buttons\n          class=\"sticky-bottom d-block p-t-16 p-b-16 separator-top bg-level-0\"\n          [showButtons]=\"{ cancel: true, next: true }\"\n          [disabled]=\"form.invalid\"\n          [pending]=\"pending\"\n          (onCancel)=\"cancel()\"\n          (onNext)=\"upload()\"\n          [labels]=\"{ next: 'Upload' }\"\n        ></c8y-stepper-buttons>\n      </cdk-step>\n    </ng-container>\n    <cdk-step state=\"final\">\n      <div class=\"p-24\">\n        <div *ngIf=\"success; else fail\">\n          <c8y-operation-result\n            text=\"{{ message | translate }}\"\n            [size]=\"84\"\n            [vertical]=\"true\"\n            type=\"success\"\n            class=\"lead\"\n            data-cy=\"success\"\n          ></c8y-operation-result>\n          <c8y-list-group class=\"separator-top m-t-16\">\n            <c8y-li>\n              <c8y-li-icon class=\"text-success\" [icon]=\"'check-circle'\"></c8y-li-icon>\n              <p translate>File successfully uploaded.</p>\n              <c8y-li-collapse>\n                <pre><code>{{ result | json }}</code></pre>\n              </c8y-li-collapse>\n            </c8y-li>\n          </c8y-list-group>\n        </div>\n        <ng-template #fail>\n          <c8y-operation-result\n            text=\"{{ message | translate }}\"\n            [size]=\"84\"\n            [vertical]=\"true\"\n            type=\"error\"\n            class=\"lead\"\n            data-cy=\"error\"\n          ></c8y-operation-result>\n          <c8y-list-group *ngIf=\"result\" class=\"separator-top m-t-16\">\n            <c8y-li>\n              <c8y-li-icon class=\"text-danger\" [icon]=\"'ban'\"></c8y-li-icon>\n              <p translate>Bulk operation failed.</p>\n              <c8y-li-collapse>\n                <pre><code>{{ result | json }}</code></pre>\n              </c8y-li-collapse>\n            </c8y-li>\n          </c8y-list-group>\n        </ng-template>\n      </div>\n      <c8y-stepper-buttons\n        class=\"sticky-bottom d-block p-t-16 p-b-16 separator-top bg-component\"\n        [showButtons]=\"{ next: true }\"\n        (onNext)=\"complete()\"\n        [labels]=\"{ next: success ? 'Complete' : 'Cancel' }\"\n      ></c8y-stepper-buttons>\n    </cdk-step>\n  </c8y-stepper>\n</c8y-modal>\n" }]
-        }], ctorParameters: function () { return [{ type: i2$1.C8yJSONSchema }, { type: BulkExtensibleDeviceRegistrationService }, { type: RegisterDeviceService }, { type: i1$1.BsModalRef }]; }, propDecorators: { stepper: [{
+        }], ctorParameters: function () { return [{ type: i2.C8yJSONSchema }, { type: BulkExtensibleDeviceRegistrationService }, { type: RegisterDeviceService }, { type: i1$2.BsModalRef }]; }, propDecorators: { stepper: [{
                 type: ViewChild,
                 args: [C8yStepper, { static: true }]
             }] } });
@@ -1132,12 +1145,12 @@ class BulkDeviceRegistrationModalComponent {
         return csvBulkFile ? csvBulkFile[0]?.file : undefined;
     }
 }
-BulkDeviceRegistrationModalComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.0.6", ngImport: i0, type: BulkDeviceRegistrationModalComponent, deps: [{ token: i1.Router }, { token: i2$1.C8yJSONSchema }, { token: i2.DeviceRegistrationBulkService }, { token: RegisterDeviceService }, { token: i1$1.BsModalRef }, { token: i2$1.GainsightService }], target: i0.ɵɵFactoryTarget.Component });
-BulkDeviceRegistrationModalComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.0.6", type: BulkDeviceRegistrationModalComponent, selector: "bulk-device-registration", viewQueries: [{ propertyName: "stepper", first: true, predicate: C8yStepper, descendants: true, static: true }], ngImport: i0, template: "<c8y-modal\n  [title]=\"'Bulk device registration' | translate\"\n  [headerClasses]=\"'dialog-header'\"\n  [customFooter]=\"true\"\n>\n  <ng-container c8y-modal-title>\n    <i c8yIcon=\"upload\"></i>\n  </ng-container>\n\n  <c8y-stepper [hideStepProgress]=\"true\" linear id=\"modal-body\">\n    <cdk-step>\n      <p class=\"modal-subtitle sticky-top\" translate>Register devices in bulk</p>\n\n      <c8y-form-group class=\"d-block p-24 p-t-16 p-b-0 m-b-0\">\n        <formly-form [form]=\"form\" [fields]=\"template\" [model]=\"model\"></formly-form>\n      </c8y-form-group>\n\n      <div class=\"p-24 m-t-0 bg-level-1\">\n        <div class=\"content-flex-30 flex-stretch\">\n          <div class=\"col-6 p-16 p-b-0 d-flex d-col j-c-between\">\n            <div>\n              <p class=\"m-b-8\">\n                <strong translate>Simple registration</strong>\n              </p>\n              <small class=\"text-muted\" translate>\n                Creates all registration requests at once, then each one needs to go through regular\n                acceptance process.\n              </small>\n            </div>\n            <div class=\"m-b-16 m-t-16\">\n              <a\n                title=\"{{ 'Download template' | translate }}\"\n                class=\"btn btn-default btn-sm\"\n                target=\"_self\"\n                (click)=\"downloadSimple()\"\n              >\n                <i c8yIcon=\"download\" translate></i>\n                {{ 'Download template' | translate }}\n              </a>\n            </div>\n          </div>\n          <div class=\"col-6 p-16 p-b-0 d-flex d-col j-c-between\">\n            <div>\n              <p class=\"m-b-8\">\n                <strong translate>Full registration</strong>\n              </p>\n              <small class=\"text-muted\" translate>\n                Creates all device credentials and devices using provided list of property values.\n                Devices can start communicating with the platform immediately.\n              </small>\n            </div>\n            <div class=\"m-b-16 m-t-16\">\n              <a\n                title=\"{{ 'Download template' | translate }}\"\n                class=\"btn btn-default btn-sm\"\n                target=\"_self\"\n                (click)=\"downloadFull()\"\n              >\n                <i c8yIcon=\"download\" translate></i>\n                {{ 'Download template' | translate }}\n              </a>\n            </div>\n          </div>\n        </div>\n      </div>\n\n      <c8y-stepper-buttons\n        class=\"sticky-bottom d-block p-t-16 p-b-16 separator-top bg-level-0\"\n        [showButtons]=\"{ cancel: true, next: true }\"\n        [disabled]=\"form.invalid\"\n        [pending]=\"pending\"\n        (onCancel)=\"cancel()\"\n        (onNext)=\"upload()\"\n        [labels]=\"{ next: 'Upload' }\"\n      ></c8y-stepper-buttons>\n    </cdk-step>\n\n    <cdk-step state=\"final\">\n      <div class=\"m-24\">\n        <div *ngIf=\"success; else warning\">\n          <c8y-operation-result\n            text=\"{{ message | translate }}\"\n            [size]=\"84\"\n            [vertical]=\"true\"\n            type=\"success\"\n            class=\"lead\"\n          ></c8y-operation-result>\n        </div>\n        <ng-template #warning>\n          <c8y-operation-result\n            text=\"{{ message | translate }}\"\n            [size]=\"84\"\n            [vertical]=\"true\"\n            type=\"error\"\n            class=\"lead\"\n          ></c8y-operation-result>\n        </ng-template>\n        <c8y-list-group class=\"separator-top m-t-16\">\n          <ng-container *ngIf=\"result; else failedResponse\">\n            <c8y-li *ngIf=\"success; else fail\">\n              <c8y-li-icon class=\"text-success\" icon=\"check-circle\"></c8y-li-icon>\n              <p>All devices processed successfully.</p>\n              <c8y-li-collapse>\n                <pre><code>{{ result | json }}</code></pre>\n              </c8y-li-collapse>\n            </c8y-li>\n            <ng-template #fail>\n              <c8y-li>\n                <c8y-li-icon class=\"text-danger\" icon=\"ban\"></c8y-li-icon>\n                <p\n                  ngNonBindable\n                  [translateParams]=\"{ count: result?.numberOfFailed, total: result?.numberOfAll }\"\n                  translate\n                >\n                  Failed to process {{ count }} out of {{ total }}.\n                </p>\n                <c8y-li-collapse>\n                  <pre><code>{{ result | json }}</code></pre>\n                </c8y-li-collapse>\n              </c8y-li>\n            </ng-template>\n          </ng-container>\n          <ng-template #failedResponse>\n            <c8y-li>\n              <c8y-li-icon class=\"text-danger\" [icon]=\"'ban'\"></c8y-li-icon>\n              <small>{{ failedResult?.message | translate }}</small>\n              <c8y-li-collapse>\n                <pre><code>{{ failedResult | json }}</code></pre>\n              </c8y-li-collapse>\n            </c8y-li>\n          </ng-template>\n        </c8y-list-group>\n      </div>\n      <c8y-stepper-buttons\n        class=\"sticky-bottom d-block p-t-16 p-b-16 separator-top bg-level-0\"\n        [showButtons]=\"{ next: true }\"\n        (onNext)=\"complete()\"\n        [labels]=\"{ next: success ? 'Close' : 'Cancel' }\"\n      ></c8y-stepper-buttons>\n    </cdk-step>\n    \n  </c8y-stepper>\n</c8y-modal>\n", dependencies: [{ kind: "directive", type: i2$1.IconDirective, selector: "[c8yIcon]", inputs: ["c8yIcon"] }, { kind: "directive", type: i2$1.C8yTranslateDirective, selector: "[translate],[ngx-translate]" }, { kind: "directive", type: i5.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: i2$1.OperationResultComponent, selector: "c8y-operation-result", inputs: ["text", "vertical", "size", "type"] }, { kind: "component", type: i2$1.ModalComponent, selector: "c8y-modal", inputs: ["disabled", "close", "dismiss", "title", "body", "customFooter", "headerClasses", "labels"], outputs: ["onDismiss", "onClose"] }, { kind: "component", type: i2$1.FormGroupComponent, selector: "c8y-form-group", inputs: ["hasError", "hasWarning", "hasSuccess", "novalidation", "status"] }, { kind: "component", type: i2$1.C8yStepper, selector: "c8y-stepper", inputs: ["disableDefaultIcons", "disableProgressButtons", "customClasses", "hideStepProgress", "useStepLabelsAsTitlesOnly"], outputs: ["onStepChange"] }, { kind: "component", type: i6.CdkStep, selector: "cdk-step", inputs: ["stepControl", "label", "errorMessage", "aria-label", "aria-labelledby", "state", "editable", "optional", "completed", "hasError"], outputs: ["interacted"], exportAs: ["cdkStep"] }, { kind: "component", type: i2$1.C8yStepperButtons, selector: "c8y-stepper-buttons", inputs: ["labels", "pending", "disabled", "showButtons"], outputs: ["onCancel", "onNext", "onBack", "onCustom"] }, { kind: "component", type: i2$1.ListGroupComponent, selector: "c8y-list-group" }, { kind: "component", type: i2$1.ListItemComponent, selector: "c8y-list-item, c8y-li", inputs: ["active", "emptyActions", "collapsed", "selectable"], outputs: ["collapsedChange"] }, { kind: "component", type: i2$1.ListItemIconComponent, selector: "c8y-list-item-icon, c8y-li-icon", inputs: ["icon", "status"] }, { kind: "component", type: i2$1.ListItemCollapseComponent, selector: "c8y-list-item-collapse, c8y-li-collapse", inputs: ["collapseWay"] }, { kind: "component", type: i7.FormlyForm, selector: "formly-form", inputs: ["model", "fields", "options", "form"], outputs: ["modelChange"] }, { kind: "pipe", type: i2$1.C8yTranslatePipe, name: "translate" }, { kind: "pipe", type: i5.JsonPipe, name: "json" }] });
+BulkDeviceRegistrationModalComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.0.6", ngImport: i0, type: BulkDeviceRegistrationModalComponent, deps: [{ token: i1.Router }, { token: i2.C8yJSONSchema }, { token: i1$1.DeviceRegistrationBulkService }, { token: RegisterDeviceService }, { token: i1$2.BsModalRef }, { token: i2.GainsightService }], target: i0.ɵɵFactoryTarget.Component });
+BulkDeviceRegistrationModalComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.0.6", type: BulkDeviceRegistrationModalComponent, selector: "bulk-device-registration", viewQueries: [{ propertyName: "stepper", first: true, predicate: C8yStepper, descendants: true, static: true }], ngImport: i0, template: "<c8y-modal\n  [title]=\"'Bulk device registration' | translate\"\n  [headerClasses]=\"'dialog-header'\"\n  [customFooter]=\"true\"\n>\n  <ng-container c8y-modal-title>\n    <i c8yIcon=\"upload\"></i>\n  </ng-container>\n\n  <c8y-stepper [hideStepProgress]=\"true\" linear id=\"modal-body\">\n    <cdk-step>\n      <p class=\"modal-subtitle sticky-top\" translate>Register devices in bulk</p>\n\n      <c8y-form-group class=\"d-block p-24 p-t-16 p-b-0 m-b-0\">\n        <formly-form [form]=\"form\" [fields]=\"template\" [model]=\"model\"></formly-form>\n      </c8y-form-group>\n\n      <div class=\"p-24 m-t-0 bg-level-1\">\n        <div class=\"content-flex-30 flex-stretch\">\n          <div class=\"col-6 p-16 p-b-0 d-flex d-col j-c-between\">\n            <div>\n              <p class=\"m-b-8\">\n                <strong translate>Simple registration</strong>\n              </p>\n              <small class=\"text-muted\" translate>\n                Creates all registration requests at once, then each one needs to go through regular\n                acceptance process.\n              </small>\n            </div>\n            <div class=\"m-b-16 m-t-16\">\n              <a\n                title=\"{{ 'Download template' | translate }}\"\n                class=\"btn btn-default btn-sm\"\n                target=\"_self\"\n                (click)=\"downloadSimple()\"\n              >\n                <i c8yIcon=\"download\" translate></i>\n                {{ 'Download template' | translate }}\n              </a>\n            </div>\n          </div>\n          <div class=\"col-6 p-16 p-b-0 d-flex d-col j-c-between\">\n            <div>\n              <p class=\"m-b-8\">\n                <strong translate>Full registration</strong>\n              </p>\n              <small class=\"text-muted\" translate>\n                Creates all device credentials and devices using provided list of property values.\n                Devices can start communicating with the platform immediately.\n              </small>\n            </div>\n            <div class=\"m-b-16 m-t-16\">\n              <a\n                title=\"{{ 'Download template' | translate }}\"\n                class=\"btn btn-default btn-sm\"\n                target=\"_self\"\n                (click)=\"downloadFull()\"\n              >\n                <i c8yIcon=\"download\" translate></i>\n                {{ 'Download template' | translate }}\n              </a>\n            </div>\n          </div>\n        </div>\n      </div>\n\n      <c8y-stepper-buttons\n        class=\"sticky-bottom d-block p-t-16 p-b-16 separator-top bg-level-0\"\n        [showButtons]=\"{ cancel: true, next: true }\"\n        [disabled]=\"form.invalid\"\n        [pending]=\"pending\"\n        (onCancel)=\"cancel()\"\n        (onNext)=\"upload()\"\n        [labels]=\"{ next: 'Upload' }\"\n      ></c8y-stepper-buttons>\n    </cdk-step>\n\n    <cdk-step state=\"final\">\n      <div class=\"m-24\">\n        <div *ngIf=\"success; else warning\">\n          <c8y-operation-result\n            text=\"{{ message | translate }}\"\n            [size]=\"84\"\n            [vertical]=\"true\"\n            type=\"success\"\n            class=\"lead\"\n          ></c8y-operation-result>\n        </div>\n        <ng-template #warning>\n          <c8y-operation-result\n            text=\"{{ message | translate }}\"\n            [size]=\"84\"\n            [vertical]=\"true\"\n            type=\"error\"\n            class=\"lead\"\n          ></c8y-operation-result>\n        </ng-template>\n        <c8y-list-group class=\"separator-top m-t-16\">\n          <ng-container *ngIf=\"result; else failedResponse\">\n            <c8y-li *ngIf=\"success; else fail\">\n              <c8y-li-icon class=\"text-success\" icon=\"check-circle\"></c8y-li-icon>\n              <p>All devices processed successfully.</p>\n              <c8y-li-collapse>\n                <pre><code>{{ result | json }}</code></pre>\n              </c8y-li-collapse>\n            </c8y-li>\n            <ng-template #fail>\n              <c8y-li>\n                <c8y-li-icon class=\"text-danger\" icon=\"ban\"></c8y-li-icon>\n                <p\n                  ngNonBindable\n                  [translateParams]=\"{ count: result?.numberOfFailed, total: result?.numberOfAll }\"\n                  translate\n                >\n                  Failed to process {{ count }} out of {{ total }}.\n                </p>\n                <c8y-li-collapse>\n                  <pre><code>{{ result | json }}</code></pre>\n                </c8y-li-collapse>\n              </c8y-li>\n            </ng-template>\n          </ng-container>\n          <ng-template #failedResponse>\n            <c8y-li>\n              <c8y-li-icon class=\"text-danger\" [icon]=\"'ban'\"></c8y-li-icon>\n              <small>{{ failedResult?.message | translate }}</small>\n              <c8y-li-collapse>\n                <pre><code>{{ failedResult | json }}</code></pre>\n              </c8y-li-collapse>\n            </c8y-li>\n          </ng-template>\n        </c8y-list-group>\n      </div>\n      <c8y-stepper-buttons\n        class=\"sticky-bottom d-block p-t-16 p-b-16 separator-top bg-level-0\"\n        [showButtons]=\"{ next: true }\"\n        (onNext)=\"complete()\"\n        [labels]=\"{ next: success ? 'Close' : 'Cancel' }\"\n      ></c8y-stepper-buttons>\n    </cdk-step>\n    \n  </c8y-stepper>\n</c8y-modal>\n", dependencies: [{ kind: "directive", type: i2.IconDirective, selector: "[c8yIcon]", inputs: ["c8yIcon"] }, { kind: "directive", type: i2.C8yTranslateDirective, selector: "[translate],[ngx-translate]" }, { kind: "directive", type: i5.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: i2.OperationResultComponent, selector: "c8y-operation-result", inputs: ["text", "vertical", "size", "type"] }, { kind: "component", type: i2.ModalComponent, selector: "c8y-modal", inputs: ["disabled", "close", "dismiss", "title", "body", "customFooter", "headerClasses", "labels"], outputs: ["onDismiss", "onClose"] }, { kind: "component", type: i2.FormGroupComponent, selector: "c8y-form-group", inputs: ["hasError", "hasWarning", "hasSuccess", "novalidation", "status"] }, { kind: "component", type: i2.C8yStepper, selector: "c8y-stepper", inputs: ["disableDefaultIcons", "disableProgressButtons", "customClasses", "hideStepProgress", "useStepLabelsAsTitlesOnly"], outputs: ["onStepChange"] }, { kind: "component", type: i6.CdkStep, selector: "cdk-step", inputs: ["stepControl", "label", "errorMessage", "aria-label", "aria-labelledby", "state", "editable", "optional", "completed", "hasError"], outputs: ["interacted"], exportAs: ["cdkStep"] }, { kind: "component", type: i2.C8yStepperButtons, selector: "c8y-stepper-buttons", inputs: ["labels", "pending", "disabled", "showButtons"], outputs: ["onCancel", "onNext", "onBack", "onCustom"] }, { kind: "component", type: i2.ListGroupComponent, selector: "c8y-list-group" }, { kind: "component", type: i2.ListItemComponent, selector: "c8y-list-item, c8y-li", inputs: ["active", "emptyActions", "collapsed", "selectable"], outputs: ["collapsedChange"] }, { kind: "component", type: i2.ListItemIconComponent, selector: "c8y-list-item-icon, c8y-li-icon", inputs: ["icon", "status"] }, { kind: "component", type: i2.ListItemCollapseComponent, selector: "c8y-list-item-collapse, c8y-li-collapse", inputs: ["collapseWay"] }, { kind: "component", type: i7.FormlyForm, selector: "formly-form", inputs: ["model", "fields", "options", "form"], outputs: ["modelChange"] }, { kind: "pipe", type: i2.C8yTranslatePipe, name: "translate" }, { kind: "pipe", type: i5.JsonPipe, name: "json" }] });
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.0.6", ngImport: i0, type: BulkDeviceRegistrationModalComponent, decorators: [{
             type: Component,
             args: [{ selector: 'bulk-device-registration', template: "<c8y-modal\n  [title]=\"'Bulk device registration' | translate\"\n  [headerClasses]=\"'dialog-header'\"\n  [customFooter]=\"true\"\n>\n  <ng-container c8y-modal-title>\n    <i c8yIcon=\"upload\"></i>\n  </ng-container>\n\n  <c8y-stepper [hideStepProgress]=\"true\" linear id=\"modal-body\">\n    <cdk-step>\n      <p class=\"modal-subtitle sticky-top\" translate>Register devices in bulk</p>\n\n      <c8y-form-group class=\"d-block p-24 p-t-16 p-b-0 m-b-0\">\n        <formly-form [form]=\"form\" [fields]=\"template\" [model]=\"model\"></formly-form>\n      </c8y-form-group>\n\n      <div class=\"p-24 m-t-0 bg-level-1\">\n        <div class=\"content-flex-30 flex-stretch\">\n          <div class=\"col-6 p-16 p-b-0 d-flex d-col j-c-between\">\n            <div>\n              <p class=\"m-b-8\">\n                <strong translate>Simple registration</strong>\n              </p>\n              <small class=\"text-muted\" translate>\n                Creates all registration requests at once, then each one needs to go through regular\n                acceptance process.\n              </small>\n            </div>\n            <div class=\"m-b-16 m-t-16\">\n              <a\n                title=\"{{ 'Download template' | translate }}\"\n                class=\"btn btn-default btn-sm\"\n                target=\"_self\"\n                (click)=\"downloadSimple()\"\n              >\n                <i c8yIcon=\"download\" translate></i>\n                {{ 'Download template' | translate }}\n              </a>\n            </div>\n          </div>\n          <div class=\"col-6 p-16 p-b-0 d-flex d-col j-c-between\">\n            <div>\n              <p class=\"m-b-8\">\n                <strong translate>Full registration</strong>\n              </p>\n              <small class=\"text-muted\" translate>\n                Creates all device credentials and devices using provided list of property values.\n                Devices can start communicating with the platform immediately.\n              </small>\n            </div>\n            <div class=\"m-b-16 m-t-16\">\n              <a\n                title=\"{{ 'Download template' | translate }}\"\n                class=\"btn btn-default btn-sm\"\n                target=\"_self\"\n                (click)=\"downloadFull()\"\n              >\n                <i c8yIcon=\"download\" translate></i>\n                {{ 'Download template' | translate }}\n              </a>\n            </div>\n          </div>\n        </div>\n      </div>\n\n      <c8y-stepper-buttons\n        class=\"sticky-bottom d-block p-t-16 p-b-16 separator-top bg-level-0\"\n        [showButtons]=\"{ cancel: true, next: true }\"\n        [disabled]=\"form.invalid\"\n        [pending]=\"pending\"\n        (onCancel)=\"cancel()\"\n        (onNext)=\"upload()\"\n        [labels]=\"{ next: 'Upload' }\"\n      ></c8y-stepper-buttons>\n    </cdk-step>\n\n    <cdk-step state=\"final\">\n      <div class=\"m-24\">\n        <div *ngIf=\"success; else warning\">\n          <c8y-operation-result\n            text=\"{{ message | translate }}\"\n            [size]=\"84\"\n            [vertical]=\"true\"\n            type=\"success\"\n            class=\"lead\"\n          ></c8y-operation-result>\n        </div>\n        <ng-template #warning>\n          <c8y-operation-result\n            text=\"{{ message | translate }}\"\n            [size]=\"84\"\n            [vertical]=\"true\"\n            type=\"error\"\n            class=\"lead\"\n          ></c8y-operation-result>\n        </ng-template>\n        <c8y-list-group class=\"separator-top m-t-16\">\n          <ng-container *ngIf=\"result; else failedResponse\">\n            <c8y-li *ngIf=\"success; else fail\">\n              <c8y-li-icon class=\"text-success\" icon=\"check-circle\"></c8y-li-icon>\n              <p>All devices processed successfully.</p>\n              <c8y-li-collapse>\n                <pre><code>{{ result | json }}</code></pre>\n              </c8y-li-collapse>\n            </c8y-li>\n            <ng-template #fail>\n              <c8y-li>\n                <c8y-li-icon class=\"text-danger\" icon=\"ban\"></c8y-li-icon>\n                <p\n                  ngNonBindable\n                  [translateParams]=\"{ count: result?.numberOfFailed, total: result?.numberOfAll }\"\n                  translate\n                >\n                  Failed to process {{ count }} out of {{ total }}.\n                </p>\n                <c8y-li-collapse>\n                  <pre><code>{{ result | json }}</code></pre>\n                </c8y-li-collapse>\n              </c8y-li>\n            </ng-template>\n          </ng-container>\n          <ng-template #failedResponse>\n            <c8y-li>\n              <c8y-li-icon class=\"text-danger\" [icon]=\"'ban'\"></c8y-li-icon>\n              <small>{{ failedResult?.message | translate }}</small>\n              <c8y-li-collapse>\n                <pre><code>{{ failedResult | json }}</code></pre>\n              </c8y-li-collapse>\n            </c8y-li>\n          </ng-template>\n        </c8y-list-group>\n      </div>\n      <c8y-stepper-buttons\n        class=\"sticky-bottom d-block p-t-16 p-b-16 separator-top bg-level-0\"\n        [showButtons]=\"{ next: true }\"\n        (onNext)=\"complete()\"\n        [labels]=\"{ next: success ? 'Close' : 'Cancel' }\"\n      ></c8y-stepper-buttons>\n    </cdk-step>\n    \n  </c8y-stepper>\n</c8y-modal>\n" }]
-        }], ctorParameters: function () { return [{ type: i1.Router }, { type: i2$1.C8yJSONSchema }, { type: i2.DeviceRegistrationBulkService }, { type: RegisterDeviceService }, { type: i1$1.BsModalRef }, { type: i2$1.GainsightService }]; }, propDecorators: { stepper: [{
+        }], ctorParameters: function () { return [{ type: i1.Router }, { type: i2.C8yJSONSchema }, { type: i1$1.DeviceRegistrationBulkService }, { type: RegisterDeviceService }, { type: i1$2.BsModalRef }, { type: i2.GainsightService }]; }, propDecorators: { stepper: [{
                 type: ViewChild,
                 args: [C8yStepper, { static: true }]
             }] } });
@@ -1161,12 +1174,12 @@ class ExtensibleBulkDeviceRegistrationButtonComponent {
         });
     }
 }
-ExtensibleBulkDeviceRegistrationButtonComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.0.6", ngImport: i0, type: ExtensibleBulkDeviceRegistrationButtonComponent, deps: [{ token: BulkExtensibleDeviceRegistrationService }, { token: i1$1.BsModalService }], target: i0.ɵɵFactoryTarget.Component });
-ExtensibleBulkDeviceRegistrationButtonComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.0.6", type: ExtensibleBulkDeviceRegistrationButtonComponent, selector: "extensible-device-registration-component", ngImport: i0, template: "<div *ngFor=\"let provider of bulkProvidersMetaData\">\n  <button\n    title=\"{{ provider.name | translate }}\"\n    type=\"button\"\n    (click)=\"click(provider.contextPath)\"\n  >\n    <i c8yIcon=\"upload\"></i>\n    {{ provider.name | translate }}\n  </button>\n</div>\n", dependencies: [{ kind: "directive", type: i2$1.IconDirective, selector: "[c8yIcon]", inputs: ["c8yIcon"] }, { kind: "directive", type: i5.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "pipe", type: i2$1.C8yTranslatePipe, name: "translate" }] });
+ExtensibleBulkDeviceRegistrationButtonComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.0.6", ngImport: i0, type: ExtensibleBulkDeviceRegistrationButtonComponent, deps: [{ token: BulkExtensibleDeviceRegistrationService }, { token: i1$2.BsModalService }], target: i0.ɵɵFactoryTarget.Component });
+ExtensibleBulkDeviceRegistrationButtonComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.0.6", type: ExtensibleBulkDeviceRegistrationButtonComponent, selector: "extensible-device-registration-component", ngImport: i0, template: "<div *ngFor=\"let provider of bulkProvidersMetaData | async\">\n  <button\n    title=\"{{ provider.name | translate }}\"\n    type=\"button\"\n    (click)=\"click(provider.contextPath)\"\n  >\n    <i c8yIcon=\"upload\"></i>\n    {{ provider.name | translate }}\n  </button>\n</div>\n", dependencies: [{ kind: "directive", type: i2.IconDirective, selector: "[c8yIcon]", inputs: ["c8yIcon"] }, { kind: "directive", type: i5.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "pipe", type: i2.C8yTranslatePipe, name: "translate" }, { kind: "pipe", type: i5.AsyncPipe, name: "async" }] });
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.0.6", ngImport: i0, type: ExtensibleBulkDeviceRegistrationButtonComponent, decorators: [{
             type: Component,
-            args: [{ selector: 'extensible-device-registration-component', template: "<div *ngFor=\"let provider of bulkProvidersMetaData\">\n  <button\n    title=\"{{ provider.name | translate }}\"\n    type=\"button\"\n    (click)=\"click(provider.contextPath)\"\n  >\n    <i c8yIcon=\"upload\"></i>\n    {{ provider.name | translate }}\n  </button>\n</div>\n" }]
-        }], ctorParameters: function () { return [{ type: BulkExtensibleDeviceRegistrationService }, { type: i1$1.BsModalService }]; } });
+            args: [{ selector: 'extensible-device-registration-component', template: "<div *ngFor=\"let provider of bulkProvidersMetaData | async\">\n  <button\n    title=\"{{ provider.name | translate }}\"\n    type=\"button\"\n    (click)=\"click(provider.contextPath)\"\n  >\n    <i c8yIcon=\"upload\"></i>\n    {{ provider.name | translate }}\n  </button>\n</div>\n" }]
+        }], ctorParameters: function () { return [{ type: BulkExtensibleDeviceRegistrationService }, { type: i1$2.BsModalService }]; } });
 
 class BulkDeviceRegistrationButtonComponent {
     constructor(modalService) {
@@ -1181,12 +1194,12 @@ class BulkDeviceRegistrationButtonComponent {
         });
     }
 }
-BulkDeviceRegistrationButtonComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.0.6", ngImport: i0, type: BulkDeviceRegistrationButtonComponent, deps: [{ token: i1$1.BsModalService }], target: i0.ɵɵFactoryTarget.Component });
-BulkDeviceRegistrationButtonComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.0.6", type: BulkDeviceRegistrationButtonComponent, selector: "extensible-device-registration-component", ngImport: i0, template: "<button title=\"{{ 'General' | translate }}\" type=\"button\" (click)=\"click()\">\n  <i c8yIcon=\"upload\"></i>\n  {{ 'General' | translate }}\n</button>\n", dependencies: [{ kind: "directive", type: i2$1.IconDirective, selector: "[c8yIcon]", inputs: ["c8yIcon"] }, { kind: "pipe", type: i2$1.C8yTranslatePipe, name: "translate" }] });
+BulkDeviceRegistrationButtonComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.0.6", ngImport: i0, type: BulkDeviceRegistrationButtonComponent, deps: [{ token: i1$2.BsModalService }], target: i0.ɵɵFactoryTarget.Component });
+BulkDeviceRegistrationButtonComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.0.6", type: BulkDeviceRegistrationButtonComponent, selector: "extensible-device-registration-component", ngImport: i0, template: "<button title=\"{{ 'General' | translate }}\" type=\"button\" (click)=\"click()\">\n  <i c8yIcon=\"upload\"></i>\n  {{ 'General' | translate }}\n</button>\n", dependencies: [{ kind: "directive", type: i2.IconDirective, selector: "[c8yIcon]", inputs: ["c8yIcon"] }, { kind: "pipe", type: i2.C8yTranslatePipe, name: "translate" }] });
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.0.6", ngImport: i0, type: BulkDeviceRegistrationButtonComponent, decorators: [{
             type: Component,
             args: [{ selector: 'extensible-device-registration-component', template: "<button title=\"{{ 'General' | translate }}\" type=\"button\" (click)=\"click()\">\n  <i c8yIcon=\"upload\"></i>\n  {{ 'General' | translate }}\n</button>\n" }]
-        }], ctorParameters: function () { return [{ type: i1$1.BsModalService }]; } });
+        }], ctorParameters: function () { return [{ type: i1$2.BsModalService }]; } });
 
 class DeviceRegistrationFactory {
     get() {