@c8y/ngx-components 1024.16.6 → 1024.16.12

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
@@ -690,9 +690,10 @@ class DeviceRegistrationViewComponent {
690
690
  if (!externalId) {
691
691
  return;
692
692
  }
693
+ const useEST = this.activatedRoute.snapshot.queryParamMap.has('one-time-password');
693
694
  try {
694
695
  await this.generalRegistration.open({
695
- useEST$: new BehaviorSubject(!!oneTimePassword),
696
+ useEST$: new BehaviorSubject(useEST),
696
697
  model: {
697
698
  devicesToCreate: [
698
699
  {
@@ -704,7 +705,7 @@ class DeviceRegistrationViewComponent {
704
705
  });
705
706
  this.loadAll();
706
707
  }
707
- catch (e) {
708
+ catch {
708
709
  // modal closed
709
710
  }
710
711
  }
@@ -750,12 +751,11 @@ class DeviceRegistrationViewComponent {
750
751
  return this._securityTokenPolicy.getValue() !== DeviceRegistrationSecurityMode.IGNORED;
751
752
  }
752
753
  static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.19", ngImport: i0, type: DeviceRegistrationViewComponent, deps: [{ token: RegisterDeviceService }, { token: i1$2.DeviceBootstrapRealtimeService }, { token: i1$2.TenantUiService }, { token: i1$2.ModalService }, { token: i3.TranslateService }, { token: i1$2.OptionsService }, { token: i1.ActivatedRoute }, { token: GeneralDeviceRegistrationService }], target: i0.ɵɵFactoryTarget.Component }); }
753
- static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "21.2.19", type: DeviceRegistrationViewComponent, isStandalone: true, 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\n [icon]=\"'exchange'\"\n [label]=\"'Devices' | translate\"\n ></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\n [placement]=\"'left'\"\n itemClass=\"navbar-form hidden-xs\"\n >\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\n [placement]=\"'right'\"\n [priority]=\"10\"\n >\n <button\n class=\"btn btn-link\"\n title=\"{{ 'Accept all' | translate }}\"\n type=\"button\"\n *c8yIfAllowed=\"['ROLE_DEVICE_CONTROL_ADMIN']\"\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\n [placement]=\"'right'\"\n [priority]=\"9\"\n >\n <button\n class=\"btn btn-link\"\n title=\"{{ 'Reload' | translate }}\"\n type=\"button\"\n (click)=\"loadAll()\"\n [disabled]=\"isLoading\"\n >\n <i\n [c8yIcon]=\"'refresh'\"\n [ngClass]=\"{ 'icon-spin': isLoading }\"\n ></i>\n {{ 'Reload' | translate }}\n </button>\n </c8y-action-bar-item>\n\n <c8y-action-bar-item\n [placement]=\"'right'\"\n *c8yIfAllowed=\"['ROLE_DEVICE_CONTROL_ADMIN']\"\n >\n <c8y-register-device-dropdown></c8y-register-device-dropdown>\n </c8y-action-bar-item>\n\n <c8y-help\n src=\"/docs/device-management-application/registering-devices/#registering-devices\"\n ></c8y-help>\n\n <ng-container *ngIf=\"deviceRequestList.data.length > 0; else noData\">\n <div\n class=\"card-group\"\n [ngClass]=\"gridOrList\"\n >\n <!-- START interact-list sticky header START -->\n <div\n class=\"page-sticky-header hidden-xs\"\n *ngIf=\"gridOrList === 'interact-list'\"\n >\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\n class=\"card-block card-column-30 p-0\"\n *ngIf=\"showTokenInputBasedOnSecurityMode()\"\n >\n <p translate>Security token</p>\n <button\n class=\"btn-help\"\n [attr.aria-label]=\"'Help' | translate\"\n popover=\"{{\n 'Security token is required if the connected device uses it.' | translate\n }}\"\n placement=\"right\"\n triggers=\"focus\"\n container=\"body\"\n type=\"button\"\n ></button>\n </div>\n <div class=\"card-footer card-column-50\">\n <div\n class=\"d-contents\"\n *ngIf=\"isManagementTenant; else noManagement\"\n >\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\n class=\"card-actions-group\"\n style=\"min-width: 176px\"\n >\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\n class=\"col-xs-12 col-sm-6 col-md-4 col-lg-3\"\n *ngIf=\"limitStatus?.isReached\"\n >\n <p\n class=\"alert alert-warning center-block\"\n role=\"alert\"\n >\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 [class]=\"statusProps[singleRequest.status].cls\"\n [c8yIcon]=\"statusProps[singleRequest.status].icon\"\n ></i>\n </div>\n <p\n class=\"card-title text-truncate\"\n title=\"{{ singleRequest.id }}\"\n >\n {{ singleRequest.id }}\n </p>\n </div>\n\n <div class=\"card-block text-center card-column-30\">\n <span\n class=\"text-label-small\"\n translate\n >\n Status\n </span>\n <p>\n <i\n class=\"icon-spin text-primary\"\n c8yIcon=\"refresh\"\n *ngIf=\"singleRequest.status === status.WAITING_FOR_CONNECTION\"\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\n class=\"text-label-small\"\n *ngIf=\"gridOrList !== 'interact-list'\"\n translate\n >\n Security token\n </span>\n <input\n class=\"form-control\"\n type=\"text\"\n [(ngModel)]=\"singleRequest.securityToken\"\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 title=\"{{\n singleRequest.status === status.PENDING_ACCEPTANCE\n ? ('Remove' | translate)\n : ('Cancel' | translate)\n }}\"\n type=\"button\"\n [ngClass]=\"{\n 'btn-danger': singleRequest.status === status.PENDING_ACCEPTANCE,\n 'btn-default': singleRequest.status !== status.PENDING_ACCEPTANCE\n }\"\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\n class=\"d-contents\"\n *ngIf=\"isManagementTenant; else noManagement\"\n >\n <div\n class=\"d-contents\"\n *ngIf=\"singleRequest.creationTime && singleRequest.owner\"\n >\n <span class=\"card-column-50\">\n <span\n class=\"text-label-small m-l-4 m-r-4\"\n translate\n >\n Created on`date`\n </span>\n <span data-cy=\"device-registration--creation-date\">\n {{ singleRequest.creationTime | c8yDate }}\n </span>\n </span>\n <span class=\"card-column-30 text-truncate\">\n <span\n class=\"text-label-small m-l-4 m-r-4\"\n translate\n >\n by`user`\n </span>\n <span\n title=\"{{ singleRequest.owner }}\"\n data-cy=\"device-registration--created-by\"\n >\n {{ singleRequest.owner }}\n </span>\n </span>\n <span class=\"card-column-20\">\n <span\n class=\"text-label-small m-l-4 m-r-4\"\n translate\n >\n in`tenant`\n </span>\n <span>{{ singleRequest.tenantId }}</span>\n </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\n class=\"text-label-small\"\n translate\n >\n Created in`tenant`\n </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=\"card-column-50\">\n <span\n class=\"text-label-small m-l-4 m-r-4\"\n translate\n >\n Created on`date`\n </span>\n <span data-cy=\"device-registration--creation-date\">\n {{ singleRequest.creationTime | c8yDate }}\n </span>\n </span>\n <span class=\"card-column-50 text-truncate\">\n <span\n class=\"text-label-small m-l-4 m-r-4\"\n translate\n >\n by`user`\n </span>\n <span\n title=\"{{ singleRequest.owner }}\"\n data-cy=\"device-registration--created-by\"\n >\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\n *c8yIfAllowed=\"['ROLE_DEVICE_CONTROL_ADMIN']\"\n translate\n >\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: NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: TitleComponent, selector: "c8y-title", inputs: ["pageTitleUpdate"] }, { kind: "component", type: BreadcrumbComponent, selector: "c8y-breadcrumb" }, { kind: "component", type: BreadcrumbItemComponent, selector: "c8y-breadcrumb-item", inputs: ["icon", "translate", "label", "path", "injector"] }, { kind: "component", type: ActionBarItemComponent, selector: "c8y-action-bar-item", inputs: ["placement", "priority", "itemClass", "injector", "groupId", "inGroupPriority"] }, { kind: "component", type: ListDisplaySwitchComponent, selector: "c8y-list-display-switch", inputs: ["listKey", "listLength", "filterPipe"], outputs: ["onListClassChange"] }, { kind: "directive", type: IfAllowedDirective, selector: "[c8yIfAllowed]", inputs: ["c8yIfAllowed", "c8yIfAllowedAllowAny"] }, { kind: "directive", type: IconDirective, selector: "[c8yIcon]", inputs: ["c8yIcon"] }, { kind: "directive", type: NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "component", type: RegisterDeviceDropdownComponent, selector: "c8y-register-device-dropdown" }, { kind: "component", type: HelpComponent, selector: "c8y-help", inputs: ["src", "isCollapsed", "priority", "icon"] }, { kind: "directive", type: C8yTranslateDirective, selector: "[translate],[ngx-translate]" }, { kind: "directive", type: 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: NgFor, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "ngmodule", type: FormsModule }, { kind: "directive", type: i6.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { kind: "directive", type: i6.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i6.RequiredValidator, selector: ":not([type=checkbox])[required][formControlName],:not([type=checkbox])[required][formControl],:not([type=checkbox])[required][ngModel]", inputs: ["required"] }, { kind: "directive", type: i6.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "directive", type: RequiredInputPlaceholderDirective, selector: "input[required], input[formControlName]" }, { kind: "component", type: LoadMoreComponent, selector: "c8y-load-more", inputs: ["paging", "useIntersection", "hidden", "container", "class", "maxIterations", "noMoreDataHint", "loadingTemplate", "hideNoMoreDataHint", "loadNextLabel", "loadingLabel"], outputs: ["onLoad"] }, { kind: "pipe", type: C8yTranslatePipe, name: "translate" }, { kind: "pipe", type: AsyncPipe, name: "async" }, { kind: "pipe", type: DatePipe, name: "c8yDate" }] }); }
754
+ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.19", type: DeviceRegistrationViewComponent, isStandalone: true, selector: "c8y-device-registration-view", ngImport: i0, template: "@if (deviceRequests$ | async; as deviceRequestList) {\n <c8y-title>\n {{ 'Device registration' | translate }}\n @if (deviceRequestList.data.length === 1) {\n <small>1 {{ 'new device' | translate }}</small>\n }\n @if (deviceRequestList.data.length > 1) {\n <small> {{ deviceRequestList.data.length }} {{ 'new devices' | translate }} </small>\n }\n </c8y-title>\n\n <c8y-breadcrumb>\n <c8y-breadcrumb-item\n [icon]=\"'exchange'\"\n [label]=\"'Devices' | translate\"\n ></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\n [placement]=\"'left'\"\n itemClass=\"navbar-form hidden-xs\"\n >\n <c8y-list-display-switch (onListClassChange)=\"displayMode($event)\"></c8y-list-display-switch>\n </c8y-action-bar-item>\n\n @if (limit$ | async; as limitStatus) {\n <c8y-action-bar-item\n [placement]=\"'right'\"\n [priority]=\"10\"\n >\n <button\n class=\"btn btn-link\"\n title=\"{{ 'Accept all' | translate }}\"\n type=\"button\"\n *c8yIfAllowed=\"['ROLE_DEVICE_CONTROL_ADMIN']\"\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\n [placement]=\"'right'\"\n [priority]=\"9\"\n >\n <button\n class=\"btn btn-link\"\n title=\"{{ 'Reload' | translate }}\"\n type=\"button\"\n (click)=\"loadAll()\"\n [disabled]=\"isLoading\"\n >\n <i\n [c8yIcon]=\"'refresh'\"\n [ngClass]=\"{ 'icon-spin': isLoading }\"\n ></i>\n {{ 'Reload' | translate }}\n </button>\n </c8y-action-bar-item>\n\n <c8y-action-bar-item\n [placement]=\"'right'\"\n *c8yIfAllowed=\"['ROLE_DEVICE_CONTROL_ADMIN']\"\n >\n <c8y-register-device-dropdown></c8y-register-device-dropdown>\n </c8y-action-bar-item>\n\n <c8y-help\n src=\"/docs/device-management-application/registering-devices/#registering-devices\"\n ></c8y-help>\n\n @if (deviceRequestList.data.length > 0) {\n <div\n class=\"card-group\"\n [ngClass]=\"gridOrList\"\n >\n <!-- START interact-list sticky header START -->\n @if (gridOrList === 'interact-list') {\n <div 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 @if (showTokenInputBasedOnSecurityMode()) {\n <div class=\"card-block card-column-30 p-0\">\n <p translate>Security token</p>\n <button\n class=\"btn-help\"\n [attr.aria-label]=\"'Help' | translate\"\n popover=\"{{\n 'Security token is required if the connected device uses it.' | translate\n }}\"\n placement=\"right\"\n triggers=\"focus\"\n container=\"body\"\n type=\"button\"\n ></button>\n </div>\n }\n <div class=\"card-footer card-column-50\">\n @if (isManagementTenant) {\n <div class=\"d-contents\">\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 } @else {\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 }\n </div>\n <div\n class=\"card-actions-group\"\n style=\"min-width: 176px\"\n >\n <div class=\"btn btn-xs invisible\">\n <!--EMPTY by design-->\n </div>\n </div>\n </div>\n </div>\n }\n <!-- END interact-list sticky header END -->\n\n @if (limitStatus?.isReached) {\n <div class=\"col-xs-12 col-sm-6 col-md-4 col-lg-3\">\n <p\n class=\"alert alert-warning center-block\"\n role=\"alert\"\n >\n <strong>\n {{ limitReachedInfo$ | async }}\n </strong>\n <br />\n <span translate>Please contact your platform administrator.</span>\n </p>\n </div>\n }\n\n @for (singleRequest of deviceRequestList.data; track singleRequest.id) {\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 [class]=\"statusProps[singleRequest.status].cls\"\n [c8yIcon]=\"statusProps[singleRequest.status].icon\"\n ></i>\n </div>\n <p\n class=\"card-title text-truncate\"\n title=\"{{ singleRequest.id }}\"\n >\n {{ singleRequest.id }}\n </p>\n </div>\n\n <div class=\"card-block text-center card-column-30\">\n <span\n class=\"text-label-small\"\n translate\n >\n Status\n </span>\n <p>\n @if (singleRequest.status === status.WAITING_FOR_CONNECTION) {\n <i\n class=\"icon-spin text-primary\"\n c8yIcon=\"refresh\"\n ></i>\n }\n {{ statusProps[singleRequest.status].label | translate }}\n </p>\n </div>\n\n <ng-container *c8yIfAllowed=\"['ROLE_DEVICE_CONTROL_ADMIN']\">\n @if (showTokenInputBasedOnSecurityMode()) {\n <div\n class=\"card-block text-center card-column-30 p-t-0\"\n [ngClass]=\"{ 'p-b-0': !shouldShowSecurityTokenInput(singleRequest) }\"\n >\n @if (shouldShowSecurityTokenInput(singleRequest)) {\n @if (gridOrList !== 'interact-list') {\n <span\n class=\"text-label-small\"\n translate\n >\n Security token\n </span>\n }\n <input\n class=\"form-control\"\n type=\"text\"\n [(ngModel)]=\"singleRequest.securityToken\"\n [placeholder]=\"'e.g. {{ example }}' | translate: { example: 'A1e3gh5ds' }\"\n [required]=\"requireSecurityToken\"\n />\n }\n </div>\n }\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 title=\"{{\n singleRequest.status === status.PENDING_ACCEPTANCE\n ? ('Remove' | translate)\n : ('Cancel' | translate)\n }}\"\n type=\"button\"\n [ngClass]=\"{\n 'btn-danger': singleRequest.status === status.PENDING_ACCEPTANCE,\n 'btn-default': singleRequest.status !== status.PENDING_ACCEPTANCE\n }\"\n (click)=\"delete(singleRequest.id)\"\n [disabled]=\"isLoading\"\n >\n @if (singleRequest.status === status.PENDING_ACCEPTANCE) {\n <span>{{ 'Remove' | translate }}</span>\n } @else {\n <span>{{ 'Cancel' | translate }}</span>\n }\n </button>\n @if (singleRequest.status === status.PENDING_ACCEPTANCE) {\n <button\n class=\"btn btn-primary btn-sm\"\n title=\"{{ 'Accept' | translate }}\"\n type=\"button\"\n (click)=\"accept(singleRequest)\"\n [disabled]=\"\n isLoading ||\n limitStatus?.isReached ||\n (!singleRequest.securityToken && requireSecurityToken)\n \"\n >\n {{ 'Accept' | translate }}\n </button>\n }\n </div>\n </ng-container>\n\n <div class=\"card-footer separator text-center card-column-50\">\n @if (isManagementTenant) {\n <small class=\"d-contents\">\n @if (singleRequest.creationTime && singleRequest.owner) {\n <div class=\"d-contents\">\n <span class=\"card-column-50\">\n <span\n class=\"text-label-small m-l-4 m-r-4\"\n translate\n >\n Created on`date`\n </span>\n <span data-cy=\"device-registration--creation-date\">\n {{ singleRequest.creationTime | c8yDate }}\n </span>\n </span>\n <span class=\"card-column-30 text-truncate\">\n <span\n class=\"text-label-small m-l-4 m-r-4\"\n translate\n >\n by`user`\n </span>\n <span\n title=\"{{ singleRequest.owner }}\"\n data-cy=\"device-registration--created-by\"\n >\n {{ singleRequest.owner }}\n </span>\n </span>\n <span class=\"card-column-20\">\n <span\n class=\"text-label-small m-l-4 m-r-4\"\n translate\n >\n in`tenant`\n </span>\n <span>{{ singleRequest.tenantId }}</span>\n </span>\n </div>\n } @else {\n <div class=\"d-contents\">\n <div class=\"card-column-50\"></div>\n <div class=\"card-column-30\"></div>\n <span\n class=\"text-label-small\"\n translate\n >\n Created in`tenant`\n </span>\n <div class=\"card-column-20\">\n <span>\n {{ singleRequest.tenantId }}\n </span>\n </div>\n </div>\n }\n </small>\n } @else {\n <small class=\"d-contents\">\n <span class=\"card-column-50\">\n <span\n class=\"text-label-small m-l-4 m-r-4\"\n translate\n >\n Created on`date`\n </span>\n <span data-cy=\"device-registration--creation-date\">\n {{ singleRequest.creationTime | c8yDate }}\n </span>\n </span>\n <span class=\"card-column-50 text-truncate\">\n <span\n class=\"text-label-small m-l-4 m-r-4\"\n translate\n >\n by`user`\n </span>\n <span\n title=\"{{ singleRequest.owner }}\"\n data-cy=\"device-registration--created-by\"\n >\n {{ singleRequest.owner }}\n </span>\n </span>\n </small>\n }\n </div>\n </div>\n </div>\n }\n </div>\n <c8y-load-more\n [paging]=\"deviceRequestList.paging\"\n [hidden]=\"true\"\n (onLoad)=\"updateList($event)\"\n ></c8y-load-more>\n } @else {\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 @if (limitStatus?.isReached) {\n <h3>\n {{ limitReachedInfo$ | async }}\n </h3>\n <p translate>Please contact your platform administrator.</p>\n } @else {\n <h3 translate>No pending registrations to display.</h3>\n <p\n *c8yIfAllowed=\"['ROLE_DEVICE_CONTROL_ADMIN']\"\n translate\n >\n Use the \"Register device\" dropdown in the top right corner.\n </p>\n }\n </div>\n }\n }\n}\n", dependencies: [{ kind: "component", type: TitleComponent, selector: "c8y-title", inputs: ["pageTitleUpdate"] }, { kind: "component", type: BreadcrumbComponent, selector: "c8y-breadcrumb" }, { kind: "component", type: BreadcrumbItemComponent, selector: "c8y-breadcrumb-item", inputs: ["icon", "translate", "label", "path", "injector"] }, { kind: "component", type: ActionBarItemComponent, selector: "c8y-action-bar-item", inputs: ["placement", "priority", "itemClass", "injector", "groupId", "inGroupPriority"] }, { kind: "component", type: ListDisplaySwitchComponent, selector: "c8y-list-display-switch", inputs: ["listKey", "listLength", "filterPipe"], outputs: ["onListClassChange"] }, { kind: "directive", type: IfAllowedDirective, selector: "[c8yIfAllowed]", inputs: ["c8yIfAllowed", "c8yIfAllowedAllowAny"] }, { kind: "directive", type: IconDirective, selector: "[c8yIcon]", inputs: ["c8yIcon"] }, { kind: "directive", type: NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "component", type: RegisterDeviceDropdownComponent, selector: "c8y-register-device-dropdown" }, { kind: "component", type: HelpComponent, selector: "c8y-help", inputs: ["src", "isCollapsed", "priority", "icon"] }, { kind: "directive", type: C8yTranslateDirective, selector: "[translate],[ngx-translate]" }, { kind: "directive", type: PopoverDirective, selector: "[popover]", inputs: ["adaptivePosition", "boundariesElement", "popover", "popoverContext", "popoverTitle", "placement", "outsideClick", "triggers", "container", "containerClass", "isOpen", "delay"], outputs: ["onShown", "onHidden"], exportAs: ["bs-popover"] }, { kind: "ngmodule", type: FormsModule }, { kind: "directive", type: i6.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { kind: "directive", type: i6.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i6.RequiredValidator, selector: ":not([type=checkbox])[required][formControlName],:not([type=checkbox])[required][formControl],:not([type=checkbox])[required][ngModel]", inputs: ["required"] }, { kind: "directive", type: i6.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "directive", type: RequiredInputPlaceholderDirective, selector: "input[required], input[formControlName]" }, { kind: "component", type: LoadMoreComponent, selector: "c8y-load-more", inputs: ["paging", "useIntersection", "hidden", "container", "class", "maxIterations", "noMoreDataHint", "loadingTemplate", "hideNoMoreDataHint", "loadNextLabel", "loadingLabel"], outputs: ["onLoad"] }, { kind: "pipe", type: C8yTranslatePipe, name: "translate" }, { kind: "pipe", type: AsyncPipe, name: "async" }, { kind: "pipe", type: DatePipe, name: "c8yDate" }] }); }
754
755
  }
755
756
  i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.19", ngImport: i0, type: DeviceRegistrationViewComponent, decorators: [{
756
757
  type: Component,
757
758
  args: [{ selector: 'c8y-device-registration-view', imports: [
758
- NgIf,
759
759
  TitleComponent,
760
760
  BreadcrumbComponent,
761
761
  BreadcrumbItemComponent,
@@ -768,14 +768,13 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.19", ngImpo
768
768
  HelpComponent,
769
769
  C8yTranslateDirective,
770
770
  PopoverDirective,
771
- NgFor,
772
771
  FormsModule,
773
772
  RequiredInputPlaceholderDirective,
774
773
  LoadMoreComponent,
775
774
  C8yTranslatePipe,
776
775
  AsyncPipe,
777
776
  DatePipe
778
- ], 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\n [icon]=\"'exchange'\"\n [label]=\"'Devices' | translate\"\n ></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\n [placement]=\"'left'\"\n itemClass=\"navbar-form hidden-xs\"\n >\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\n [placement]=\"'right'\"\n [priority]=\"10\"\n >\n <button\n class=\"btn btn-link\"\n title=\"{{ 'Accept all' | translate }}\"\n type=\"button\"\n *c8yIfAllowed=\"['ROLE_DEVICE_CONTROL_ADMIN']\"\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\n [placement]=\"'right'\"\n [priority]=\"9\"\n >\n <button\n class=\"btn btn-link\"\n title=\"{{ 'Reload' | translate }}\"\n type=\"button\"\n (click)=\"loadAll()\"\n [disabled]=\"isLoading\"\n >\n <i\n [c8yIcon]=\"'refresh'\"\n [ngClass]=\"{ 'icon-spin': isLoading }\"\n ></i>\n {{ 'Reload' | translate }}\n </button>\n </c8y-action-bar-item>\n\n <c8y-action-bar-item\n [placement]=\"'right'\"\n *c8yIfAllowed=\"['ROLE_DEVICE_CONTROL_ADMIN']\"\n >\n <c8y-register-device-dropdown></c8y-register-device-dropdown>\n </c8y-action-bar-item>\n\n <c8y-help\n src=\"/docs/device-management-application/registering-devices/#registering-devices\"\n ></c8y-help>\n\n <ng-container *ngIf=\"deviceRequestList.data.length > 0; else noData\">\n <div\n class=\"card-group\"\n [ngClass]=\"gridOrList\"\n >\n <!-- START interact-list sticky header START -->\n <div\n class=\"page-sticky-header hidden-xs\"\n *ngIf=\"gridOrList === 'interact-list'\"\n >\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\n class=\"card-block card-column-30 p-0\"\n *ngIf=\"showTokenInputBasedOnSecurityMode()\"\n >\n <p translate>Security token</p>\n <button\n class=\"btn-help\"\n [attr.aria-label]=\"'Help' | translate\"\n popover=\"{{\n 'Security token is required if the connected device uses it.' | translate\n }}\"\n placement=\"right\"\n triggers=\"focus\"\n container=\"body\"\n type=\"button\"\n ></button>\n </div>\n <div class=\"card-footer card-column-50\">\n <div\n class=\"d-contents\"\n *ngIf=\"isManagementTenant; else noManagement\"\n >\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\n class=\"card-actions-group\"\n style=\"min-width: 176px\"\n >\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\n class=\"col-xs-12 col-sm-6 col-md-4 col-lg-3\"\n *ngIf=\"limitStatus?.isReached\"\n >\n <p\n class=\"alert alert-warning center-block\"\n role=\"alert\"\n >\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 [class]=\"statusProps[singleRequest.status].cls\"\n [c8yIcon]=\"statusProps[singleRequest.status].icon\"\n ></i>\n </div>\n <p\n class=\"card-title text-truncate\"\n title=\"{{ singleRequest.id }}\"\n >\n {{ singleRequest.id }}\n </p>\n </div>\n\n <div class=\"card-block text-center card-column-30\">\n <span\n class=\"text-label-small\"\n translate\n >\n Status\n </span>\n <p>\n <i\n class=\"icon-spin text-primary\"\n c8yIcon=\"refresh\"\n *ngIf=\"singleRequest.status === status.WAITING_FOR_CONNECTION\"\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\n class=\"text-label-small\"\n *ngIf=\"gridOrList !== 'interact-list'\"\n translate\n >\n Security token\n </span>\n <input\n class=\"form-control\"\n type=\"text\"\n [(ngModel)]=\"singleRequest.securityToken\"\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 title=\"{{\n singleRequest.status === status.PENDING_ACCEPTANCE\n ? ('Remove' | translate)\n : ('Cancel' | translate)\n }}\"\n type=\"button\"\n [ngClass]=\"{\n 'btn-danger': singleRequest.status === status.PENDING_ACCEPTANCE,\n 'btn-default': singleRequest.status !== status.PENDING_ACCEPTANCE\n }\"\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\n class=\"d-contents\"\n *ngIf=\"isManagementTenant; else noManagement\"\n >\n <div\n class=\"d-contents\"\n *ngIf=\"singleRequest.creationTime && singleRequest.owner\"\n >\n <span class=\"card-column-50\">\n <span\n class=\"text-label-small m-l-4 m-r-4\"\n translate\n >\n Created on`date`\n </span>\n <span data-cy=\"device-registration--creation-date\">\n {{ singleRequest.creationTime | c8yDate }}\n </span>\n </span>\n <span class=\"card-column-30 text-truncate\">\n <span\n class=\"text-label-small m-l-4 m-r-4\"\n translate\n >\n by`user`\n </span>\n <span\n title=\"{{ singleRequest.owner }}\"\n data-cy=\"device-registration--created-by\"\n >\n {{ singleRequest.owner }}\n </span>\n </span>\n <span class=\"card-column-20\">\n <span\n class=\"text-label-small m-l-4 m-r-4\"\n translate\n >\n in`tenant`\n </span>\n <span>{{ singleRequest.tenantId }}</span>\n </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\n class=\"text-label-small\"\n translate\n >\n Created in`tenant`\n </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=\"card-column-50\">\n <span\n class=\"text-label-small m-l-4 m-r-4\"\n translate\n >\n Created on`date`\n </span>\n <span data-cy=\"device-registration--creation-date\">\n {{ singleRequest.creationTime | c8yDate }}\n </span>\n </span>\n <span class=\"card-column-50 text-truncate\">\n <span\n class=\"text-label-small m-l-4 m-r-4\"\n translate\n >\n by`user`\n </span>\n <span\n title=\"{{ singleRequest.owner }}\"\n data-cy=\"device-registration--created-by\"\n >\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\n *c8yIfAllowed=\"['ROLE_DEVICE_CONTROL_ADMIN']\"\n translate\n >\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" }]
777
+ ], template: "@if (deviceRequests$ | async; as deviceRequestList) {\n <c8y-title>\n {{ 'Device registration' | translate }}\n @if (deviceRequestList.data.length === 1) {\n <small>1 {{ 'new device' | translate }}</small>\n }\n @if (deviceRequestList.data.length > 1) {\n <small> {{ deviceRequestList.data.length }} {{ 'new devices' | translate }} </small>\n }\n </c8y-title>\n\n <c8y-breadcrumb>\n <c8y-breadcrumb-item\n [icon]=\"'exchange'\"\n [label]=\"'Devices' | translate\"\n ></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\n [placement]=\"'left'\"\n itemClass=\"navbar-form hidden-xs\"\n >\n <c8y-list-display-switch (onListClassChange)=\"displayMode($event)\"></c8y-list-display-switch>\n </c8y-action-bar-item>\n\n @if (limit$ | async; as limitStatus) {\n <c8y-action-bar-item\n [placement]=\"'right'\"\n [priority]=\"10\"\n >\n <button\n class=\"btn btn-link\"\n title=\"{{ 'Accept all' | translate }}\"\n type=\"button\"\n *c8yIfAllowed=\"['ROLE_DEVICE_CONTROL_ADMIN']\"\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\n [placement]=\"'right'\"\n [priority]=\"9\"\n >\n <button\n class=\"btn btn-link\"\n title=\"{{ 'Reload' | translate }}\"\n type=\"button\"\n (click)=\"loadAll()\"\n [disabled]=\"isLoading\"\n >\n <i\n [c8yIcon]=\"'refresh'\"\n [ngClass]=\"{ 'icon-spin': isLoading }\"\n ></i>\n {{ 'Reload' | translate }}\n </button>\n </c8y-action-bar-item>\n\n <c8y-action-bar-item\n [placement]=\"'right'\"\n *c8yIfAllowed=\"['ROLE_DEVICE_CONTROL_ADMIN']\"\n >\n <c8y-register-device-dropdown></c8y-register-device-dropdown>\n </c8y-action-bar-item>\n\n <c8y-help\n src=\"/docs/device-management-application/registering-devices/#registering-devices\"\n ></c8y-help>\n\n @if (deviceRequestList.data.length > 0) {\n <div\n class=\"card-group\"\n [ngClass]=\"gridOrList\"\n >\n <!-- START interact-list sticky header START -->\n @if (gridOrList === 'interact-list') {\n <div 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 @if (showTokenInputBasedOnSecurityMode()) {\n <div class=\"card-block card-column-30 p-0\">\n <p translate>Security token</p>\n <button\n class=\"btn-help\"\n [attr.aria-label]=\"'Help' | translate\"\n popover=\"{{\n 'Security token is required if the connected device uses it.' | translate\n }}\"\n placement=\"right\"\n triggers=\"focus\"\n container=\"body\"\n type=\"button\"\n ></button>\n </div>\n }\n <div class=\"card-footer card-column-50\">\n @if (isManagementTenant) {\n <div class=\"d-contents\">\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 } @else {\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 }\n </div>\n <div\n class=\"card-actions-group\"\n style=\"min-width: 176px\"\n >\n <div class=\"btn btn-xs invisible\">\n <!--EMPTY by design-->\n </div>\n </div>\n </div>\n </div>\n }\n <!-- END interact-list sticky header END -->\n\n @if (limitStatus?.isReached) {\n <div class=\"col-xs-12 col-sm-6 col-md-4 col-lg-3\">\n <p\n class=\"alert alert-warning center-block\"\n role=\"alert\"\n >\n <strong>\n {{ limitReachedInfo$ | async }}\n </strong>\n <br />\n <span translate>Please contact your platform administrator.</span>\n </p>\n </div>\n }\n\n @for (singleRequest of deviceRequestList.data; track singleRequest.id) {\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 [class]=\"statusProps[singleRequest.status].cls\"\n [c8yIcon]=\"statusProps[singleRequest.status].icon\"\n ></i>\n </div>\n <p\n class=\"card-title text-truncate\"\n title=\"{{ singleRequest.id }}\"\n >\n {{ singleRequest.id }}\n </p>\n </div>\n\n <div class=\"card-block text-center card-column-30\">\n <span\n class=\"text-label-small\"\n translate\n >\n Status\n </span>\n <p>\n @if (singleRequest.status === status.WAITING_FOR_CONNECTION) {\n <i\n class=\"icon-spin text-primary\"\n c8yIcon=\"refresh\"\n ></i>\n }\n {{ statusProps[singleRequest.status].label | translate }}\n </p>\n </div>\n\n <ng-container *c8yIfAllowed=\"['ROLE_DEVICE_CONTROL_ADMIN']\">\n @if (showTokenInputBasedOnSecurityMode()) {\n <div\n class=\"card-block text-center card-column-30 p-t-0\"\n [ngClass]=\"{ 'p-b-0': !shouldShowSecurityTokenInput(singleRequest) }\"\n >\n @if (shouldShowSecurityTokenInput(singleRequest)) {\n @if (gridOrList !== 'interact-list') {\n <span\n class=\"text-label-small\"\n translate\n >\n Security token\n </span>\n }\n <input\n class=\"form-control\"\n type=\"text\"\n [(ngModel)]=\"singleRequest.securityToken\"\n [placeholder]=\"'e.g. {{ example }}' | translate: { example: 'A1e3gh5ds' }\"\n [required]=\"requireSecurityToken\"\n />\n }\n </div>\n }\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 title=\"{{\n singleRequest.status === status.PENDING_ACCEPTANCE\n ? ('Remove' | translate)\n : ('Cancel' | translate)\n }}\"\n type=\"button\"\n [ngClass]=\"{\n 'btn-danger': singleRequest.status === status.PENDING_ACCEPTANCE,\n 'btn-default': singleRequest.status !== status.PENDING_ACCEPTANCE\n }\"\n (click)=\"delete(singleRequest.id)\"\n [disabled]=\"isLoading\"\n >\n @if (singleRequest.status === status.PENDING_ACCEPTANCE) {\n <span>{{ 'Remove' | translate }}</span>\n } @else {\n <span>{{ 'Cancel' | translate }}</span>\n }\n </button>\n @if (singleRequest.status === status.PENDING_ACCEPTANCE) {\n <button\n class=\"btn btn-primary btn-sm\"\n title=\"{{ 'Accept' | translate }}\"\n type=\"button\"\n (click)=\"accept(singleRequest)\"\n [disabled]=\"\n isLoading ||\n limitStatus?.isReached ||\n (!singleRequest.securityToken && requireSecurityToken)\n \"\n >\n {{ 'Accept' | translate }}\n </button>\n }\n </div>\n </ng-container>\n\n <div class=\"card-footer separator text-center card-column-50\">\n @if (isManagementTenant) {\n <small class=\"d-contents\">\n @if (singleRequest.creationTime && singleRequest.owner) {\n <div class=\"d-contents\">\n <span class=\"card-column-50\">\n <span\n class=\"text-label-small m-l-4 m-r-4\"\n translate\n >\n Created on`date`\n </span>\n <span data-cy=\"device-registration--creation-date\">\n {{ singleRequest.creationTime | c8yDate }}\n </span>\n </span>\n <span class=\"card-column-30 text-truncate\">\n <span\n class=\"text-label-small m-l-4 m-r-4\"\n translate\n >\n by`user`\n </span>\n <span\n title=\"{{ singleRequest.owner }}\"\n data-cy=\"device-registration--created-by\"\n >\n {{ singleRequest.owner }}\n </span>\n </span>\n <span class=\"card-column-20\">\n <span\n class=\"text-label-small m-l-4 m-r-4\"\n translate\n >\n in`tenant`\n </span>\n <span>{{ singleRequest.tenantId }}</span>\n </span>\n </div>\n } @else {\n <div class=\"d-contents\">\n <div class=\"card-column-50\"></div>\n <div class=\"card-column-30\"></div>\n <span\n class=\"text-label-small\"\n translate\n >\n Created in`tenant`\n </span>\n <div class=\"card-column-20\">\n <span>\n {{ singleRequest.tenantId }}\n </span>\n </div>\n </div>\n }\n </small>\n } @else {\n <small class=\"d-contents\">\n <span class=\"card-column-50\">\n <span\n class=\"text-label-small m-l-4 m-r-4\"\n translate\n >\n Created on`date`\n </span>\n <span data-cy=\"device-registration--creation-date\">\n {{ singleRequest.creationTime | c8yDate }}\n </span>\n </span>\n <span class=\"card-column-50 text-truncate\">\n <span\n class=\"text-label-small m-l-4 m-r-4\"\n translate\n >\n by`user`\n </span>\n <span\n title=\"{{ singleRequest.owner }}\"\n data-cy=\"device-registration--created-by\"\n >\n {{ singleRequest.owner }}\n </span>\n </span>\n </small>\n }\n </div>\n </div>\n </div>\n }\n </div>\n <c8y-load-more\n [paging]=\"deviceRequestList.paging\"\n [hidden]=\"true\"\n (onLoad)=\"updateList($event)\"\n ></c8y-load-more>\n } @else {\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 @if (limitStatus?.isReached) {\n <h3>\n {{ limitReachedInfo$ | async }}\n </h3>\n <p translate>Please contact your platform administrator.</p>\n } @else {\n <h3 translate>No pending registrations to display.</h3>\n <p\n *c8yIfAllowed=\"['ROLE_DEVICE_CONTROL_ADMIN']\"\n translate\n >\n Use the \"Register device\" dropdown in the top right corner.\n </p>\n }\n </div>\n }\n }\n}\n" }]
779
778
  }], ctorParameters: () => [{ type: RegisterDeviceService }, { type: i1$2.DeviceBootstrapRealtimeService }, { type: i1$2.TenantUiService }, { type: i1$2.ModalService }, { type: i3.TranslateService }, { type: i1$2.OptionsService }, { type: i1.ActivatedRoute }, { type: GeneralDeviceRegistrationService }] });
780
779
 
781
780
  class RegisterDeviceNavigationFactory {