@c8y/ngx-components 1023.17.19 → 1023.22.2

package/fesm2022/c8y-ngx-components-repository-firmware.mjs

@@ -337,7 +337,7 @@ class AddFirmwarePatchModalComponent {
         }
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.16", ngImport: i0, type: AddFirmwarePatchModalComponent, deps: [{ token: i1$1.BsModalRef }, { token: i2.RepositoryService }, { token: i4.AlertService }], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "20.3.16", type: AddFirmwarePatchModalComponent, isStandalone: true, selector: "c8y-add-firmware-patch-modal.component", outputs: { saved: "saved" }, viewQueries: [{ propertyName: "dropdown", first: true, predicate: ["dropdown"], descendants: true }, { propertyName: "form", first: true, predicate: ["firmwarePatchForm"], descendants: true }], ngImport: i0, template: "<div class=\"viewport-modal\">\n  <div class=\"modal-header dialog-header\">\n    <i [c8yIcon]=\"'c8y-firmware'\"></i>\n    <h4\n      id=\"addFirmwarePatchModalTitle\"\n      translate\n    >\n      Add firmware patch\n    </h4>\n  </div>\n  <div\n    class=\"p-16 text-center separator-bottom\"\n    id=\"addFirmwarePatchModalDescription\"\n  >\n    <p\n      class=\"text-medium text-16 m-0\"\n      translate\n    >\n      Select a firmware version\n    </p>\n  </div>\n\n  <form\n    class=\"d-contents\"\n    autocomplete=\"off\"\n    #firmwarePatchForm=\"ngForm\"\n    (ngSubmit)=\"firmwarePatchForm.form.valid && save()\"\n  >\n    <div class=\"modal-inner-scroll\">\n      <div class=\"modal-body\">\n        <div [hidden]=\"firmwarePreselected\">\n          <c8y-form-group>\n            <label\n              for=\"firmwareName\"\n              translate\n            >\n              Firmware\n            </label>\n            <c8y-typeahead\n              placeholder=\"{{ 'Select or enter' | translate }}\"\n              name=\"firmwareName\"\n              [ngModel]=\"model.selected\"\n              (onSearch)=\"firmwareInput$.next($event)\"\n              [allowFreeEntries]=\"false\"\n              [required]=\"true\"\n            >\n              <c8y-li\n                class=\"p-l-8 p-r-8 c8y-list__item--link\"\n                *c8yFor=\"let firmware of firmwares$ | async; loadMore: 'auto'\"\n                (click)=\"model.selected = firmware; firmwareSelected$.next(firmware)\"\n                [active]=\"model.selected === firmware\"\n              >\n                <c8y-highlight\n                  [text]=\"firmware.name || '--'\"\n                  [pattern]=\"firmwareInput$ | async\"\n                ></c8y-highlight>\n              </c8y-li>\n            </c8y-typeahead>\n            <c8y-messages>\n              <c8y-message\n                name=\"notExisting\"\n                [text]=\"'Select one of the existing firmwares.' | translate\"\n              ></c8y-message>\n            </c8y-messages>\n          </c8y-form-group>\n        </div>\n\n        <c8y-form-group>\n          <label\n            class=\"m-r-8\"\n            for=\"patchDependency\"\n            translate\n          >\n            Version\n          </label>\n          <c8y-typeahead\n            placeholder=\"{{ 'Select or enter' | translate }}\"\n            name=\"patchDependency\"\n            [ngModel]=\"model.dependency\"\n            data-cy=\"add-firmware-patch-modal--patchDependency\"\n            (onSearch)=\"patchDependencyInput$.next($event)\"\n            [displayProperty]=\"'c8y_Firmware.version'\"\n            [allowFreeEntries]=\"false\"\n            [disabled]=\"\n              (baseVersions$ | async) === null || (baseVersions$ | async)?.data.length === 0\n            \"\n            [required]=\"true\"\n          >\n            <c8y-li\n              class=\"p-l-8 p-r-8 c8y-list__item--link\"\n              *c8yFor=\"\n                let baseVersion of baseVersions$;\n                loadMore: 'auto';\n                pipe: baseVersionsFilterPipe\n              \"\n              (click)=\"model.dependency = baseVersion\"\n              [active]=\"model.dependency === baseVersion\"\n            >\n              <c8y-highlight\n                [text]=\"baseVersion.c8y_Firmware.version || '--'\"\n                [pattern]=\"patchDependencyInput$ | async\"\n              ></c8y-highlight>\n            </c8y-li>\n          </c8y-typeahead>\n          <c8y-messages>\n            <c8y-message\n              name=\"notExisting\"\n              [text]=\"'Select one of the existing versions.' | translate\"\n            ></c8y-message>\n          </c8y-messages>\n        </c8y-form-group>\n\n        <c8y-form-group>\n          <label\n            for=\"patchVersion\"\n            translate\n          >\n            Patch\n          </label>\n          <input\n            class=\"form-control\"\n            id=\"patchVersion\"\n            placeholder=\"{{ 'e.g.' | translate }} 1.0.0\"\n            name=\"patchVersion\"\n            autocomplete=\"off\"\n            required\n            data-cy=\"add-firmware-patch-modal--patchVersion\"\n            [(ngModel)]=\"model.patchVersion\"\n          />\n        </c8y-form-group>\n\n        <c8y-form-group>\n          <div\n            class=\"legend form-block m-t-40\"\n            translate\n          >\n            Patch file\n          </div>\n          <c8y-file-picker\n            [maxAllowedFiles]=\"1\"\n            (onFilesPicked)=\"onFile($event)\"\n            [allowedUploadChoices]=\"['uploadBinary', 'uploadUrl', 'provided']\"\n            [fileUrlPopover]=\"textForFirmwareUrlPopover\"\n          ></c8y-file-picker>\n        </c8y-form-group>\n      </div>\n    </div>\n    <div class=\"modal-footer\">\n      <button\n        class=\"btn btn-default\"\n        title=\"{{ 'Cancel' | translate }}\"\n        type=\"button\"\n        data-cy=\"add-firmware-patch-modal--cancel-btn\"\n        (click)=\"cancel()\"\n        [disabled]=\"saving\"\n        translate\n      >\n        Cancel\n      </button>\n      <button\n        class=\"btn btn-primary\"\n        title=\"{{ 'Add firmware patch' | translate }}\"\n        type=\"submit\"\n        [ngClass]=\"{ 'btn-pending': saving }\"\n        [disabled]=\"\n          !firmwarePatchForm.form.valid ||\n          firmwarePatchForm.form.pristine ||\n          (!model.binary?.url && !model.binary?.file && model.binary?.url !== '$PROVIDED') ||\n          saving\n        \"\n        translate\n        c8yProductExperience\n        [actionName]=\"PRODUCT_EXPERIENCE.FIRMWARE.EVENTS.REPOSITORY\"\n        [actionData]=\"{\n          component: PRODUCT_EXPERIENCE.FIRMWARE.COMPONENTS.ADD_FIRMWAR_PATCH_MODAL,\n          result: PRODUCT_EXPERIENCE.FIRMWARE.RESULTS.ADD_FIRMWARE_PATCH\n        }\"\n      >\n        Add firmware patch\n      </button>\n    </div>\n  </form>\n</div>\n", dependencies: [{ kind: "directive", type: IconDirective, selector: "[c8yIcon]", inputs: ["c8yIcon"] }, { kind: "directive", type: C8yTranslateDirective, selector: "[translate],[ngx-translate]" }, { kind: "ngmodule", type: FormsModule }, { kind: "directive", type: i4$1.ɵNgNoValidate, selector: "form:not([ngNoForm]):not([ngNativeValidate])" }, { kind: "directive", type: i4$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: i4$1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i4$1.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { kind: "directive", type: i4$1.RequiredValidator, selector: ":not([type=checkbox])[required][formControlName],:not([type=checkbox])[required][formControl],:not([type=checkbox])[required][ngModel]", inputs: ["required"] }, { kind: "directive", type: i4$1.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "directive", type: i4$1.NgForm, selector: "form:not([ngNoForm]):not([formGroup]),ng-form,[ngForm]", inputs: ["ngFormOptions"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { kind: "component", type: FormGroupComponent, selector: "c8y-form-group", inputs: ["hasError", "hasWarning", "hasSuccess", "novalidation", "status"] }, { kind: "component", type: TypeaheadComponent, selector: "c8y-typeahead", inputs: ["required", "maxlength", "disabled", "allowFreeEntries", "placeholder", "displayProperty", "icon", "name", "autoClose", "hideNew", "container", "selected", "title", "highlightFirstItem"], outputs: ["onSearch", "onIconClick"] }, { kind: "directive", type: ForOfDirective, selector: "[c8yFor]", inputs: ["c8yForOf", "c8yForLoadMore", "c8yForPipe", "c8yForNotFound", "c8yForMaxIterations", "c8yForLoadingTemplate", "c8yForLoadNextLabel", "c8yForLoadingLabel", "c8yForRealtime", "c8yForRealtimeOptions", "c8yForComparator", "c8yForEnableVirtualScroll", "c8yForVirtualScrollElementSize", "c8yForVirtualScrollStrategy", "c8yForVirtualScrollContainerHeight"], outputs: ["c8yForCount", "c8yForChange", "c8yForLoadMoreComponent"] }, { kind: "component", type: ListItemComponent, selector: "c8y-list-item, c8y-li", inputs: ["active", "highlighted", "emptyActions", "dense", "collapsed", "selectable"], outputs: ["collapsedChange"] }, { kind: "component", type: HighlightComponent, selector: "c8y-highlight", inputs: ["pattern", "text", "elementClass", "shouldTrimPattern"] }, { kind: "component", type: MessagesComponent, selector: "c8y-messages", inputs: ["show", "defaults", "helpMessage"] }, { kind: "directive", type: MessageDirective, selector: "c8y-message", inputs: ["name", "text"] }, { kind: "directive", type: RequiredInputPlaceholderDirective, selector: "input[required], input[formControlName]" }, { kind: "component", type: FilePickerComponent, selector: "c8y-file-picker", inputs: ["maxAllowedFiles", "uploadChoice", "allowedUploadChoices", "fileUrl", "fileBinary", "config", "filePickerIndex", "fileUrlPopover"], outputs: ["onFilesPicked"] }, { kind: "directive", type: ProductExperienceDirective, selector: "[c8yProductExperience]", inputs: ["actionName", "actionData", "inherit", "suppressDataOverriding"] }, { kind: "directive", type: NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "pipe", type: AsyncPipe, name: "async" }, { kind: "pipe", type: C8yTranslatePipe, name: "translate" }] }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "20.3.16", type: AddFirmwarePatchModalComponent, isStandalone: true, selector: "c8y-add-firmware-patch-modal.component", outputs: { saved: "saved" }, viewQueries: [{ propertyName: "dropdown", first: true, predicate: ["dropdown"], descendants: true }, { propertyName: "form", first: true, predicate: ["firmwarePatchForm"], descendants: true }], ngImport: i0, template: "<div class=\"viewport-modal\">\n  <div class=\"modal-header dialog-header\">\n    <i [c8yIcon]=\"'c8y-firmware'\"></i>\n    <h4\n      id=\"addFirmwarePatchModalTitle\"\n      translate\n    >\n      Add firmware patch\n    </h4>\n  </div>\n  <div\n    class=\"p-16 text-center separator-bottom\"\n    id=\"addFirmwarePatchModalDescription\"\n  >\n    <p\n      class=\"text-medium text-16 m-0\"\n      translate\n    >\n      Select a firmware version\n    </p>\n  </div>\n\n  <form\n    class=\"d-contents\"\n    autocomplete=\"off\"\n    #firmwarePatchForm=\"ngForm\"\n    (ngSubmit)=\"firmwarePatchForm.form.valid && save()\"\n  >\n    <div class=\"modal-inner-scroll\">\n      <div class=\"modal-body\">\n        <div [hidden]=\"firmwarePreselected\">\n          <c8y-form-group>\n            <label\n              for=\"firmwareName\"\n              translate\n            >\n              Firmware\n            </label>\n            <c8y-typeahead\n              placeholder=\"{{ 'Select or enter' | translate }}\"\n              name=\"firmwareName\"\n              [ngModel]=\"model.selected\"\n              (onSearch)=\"firmwareInput$.next($event)\"\n              [allowFreeEntries]=\"false\"\n              [required]=\"true\"\n            >\n              <c8y-li\n                class=\"p-l-8 p-r-8 c8y-list__item--link\"\n                *c8yFor=\"let firmware of firmwares$ | async; loadMore: 'auto'\"\n                (click)=\"model.selected = firmware; firmwareSelected$.next(firmware)\"\n                [active]=\"model.selected === firmware\"\n              >\n                <c8y-highlight\n                  [text]=\"firmware.name || '--'\"\n                  [pattern]=\"firmwareInput$ | async\"\n                ></c8y-highlight>\n              </c8y-li>\n            </c8y-typeahead>\n            <c8y-messages>\n              <c8y-message\n                name=\"notExisting\"\n                [text]=\"'Select one of the existing firmwares.' | translate\"\n              ></c8y-message>\n            </c8y-messages>\n          </c8y-form-group>\n        </div>\n\n        <c8y-form-group>\n          <label\n            class=\"m-r-8\"\n            for=\"patchDependency\"\n            translate\n          >\n            Version\n          </label>\n          <c8y-typeahead\n            placeholder=\"{{ 'Select or enter' | translate }}\"\n            name=\"patchDependency\"\n            [ngModel]=\"model.dependency\"\n            data-cy=\"add-firmware-patch-modal--patchDependency\"\n            (onSearch)=\"patchDependencyInput$.next($event)\"\n            [displayProperty]=\"'c8y_Firmware.version'\"\n            [allowFreeEntries]=\"false\"\n            [disabled]=\"\n              (baseVersions$ | async) === null || (baseVersions$ | async)?.data.length === 0\n            \"\n            [required]=\"true\"\n          >\n            <c8y-li\n              class=\"p-l-8 p-r-8 c8y-list__item--link\"\n              *c8yFor=\"\n                let baseVersion of baseVersions$;\n                loadMore: 'auto';\n                pipe: baseVersionsFilterPipe\n              \"\n              (click)=\"model.dependency = baseVersion\"\n              [active]=\"model.dependency === baseVersion\"\n            >\n              <c8y-highlight\n                [text]=\"baseVersion.c8y_Firmware.version || '--'\"\n                [pattern]=\"patchDependencyInput$ | async\"\n              ></c8y-highlight>\n            </c8y-li>\n          </c8y-typeahead>\n          <c8y-messages>\n            <c8y-message\n              name=\"notExisting\"\n              [text]=\"'Select one of the existing versions.' | translate\"\n            ></c8y-message>\n          </c8y-messages>\n        </c8y-form-group>\n\n        <c8y-form-group>\n          <label\n            for=\"patchVersion\"\n            translate\n          >\n            Patch\n          </label>\n          <input\n            class=\"form-control\"\n            id=\"patchVersion\"\n            placeholder=\"{{ 'e.g.' | translate }} 1.0.0\"\n            name=\"patchVersion\"\n            autocomplete=\"off\"\n            required\n            data-cy=\"add-firmware-patch-modal--patchVersion\"\n            [(ngModel)]=\"model.patchVersion\"\n          />\n        </c8y-form-group>\n\n        <c8y-form-group>\n          <div\n            class=\"legend form-block m-t-40\"\n            translate\n          >\n            Patch file\n          </div>\n          <c8y-file-picker\n            [maxAllowedFiles]=\"1\"\n            (onFilesPicked)=\"onFile($event)\"\n            [allowedUploadChoices]=\"['uploadBinary', 'uploadUrl', 'provided']\"\n            [fileUrlPopover]=\"textForFirmwareUrlPopover\"\n          ></c8y-file-picker>\n        </c8y-form-group>\n      </div>\n    </div>\n    <div class=\"modal-footer\">\n      <button\n        class=\"btn btn-default\"\n        title=\"{{ 'Cancel' | translate }}\"\n        type=\"button\"\n        data-cy=\"add-firmware-patch-modal--cancel-btn\"\n        (click)=\"cancel()\"\n        [disabled]=\"saving\"\n        translate\n      >\n        Cancel\n      </button>\n      <button\n        class=\"btn btn-primary\"\n        title=\"{{ 'Add firmware patch' | translate }}\"\n        type=\"submit\"\n        [ngClass]=\"{ 'btn-pending': saving }\"\n        [disabled]=\"\n          !firmwarePatchForm.form.valid ||\n          firmwarePatchForm.form.pristine ||\n          (!model.binary?.url && !model.binary?.file && model.binary?.url !== '') ||\n          saving\n        \"\n        translate\n        c8yProductExperience\n        [actionName]=\"PRODUCT_EXPERIENCE.FIRMWARE.EVENTS.REPOSITORY\"\n        [actionData]=\"{\n          component: PRODUCT_EXPERIENCE.FIRMWARE.COMPONENTS.ADD_FIRMWAR_PATCH_MODAL,\n          result: PRODUCT_EXPERIENCE.FIRMWARE.RESULTS.ADD_FIRMWARE_PATCH\n        }\"\n      >\n        Add firmware patch\n      </button>\n    </div>\n  </form>\n</div>\n", dependencies: [{ kind: "directive", type: IconDirective, selector: "[c8yIcon]", inputs: ["c8yIcon"] }, { kind: "directive", type: C8yTranslateDirective, selector: "[translate],[ngx-translate]" }, { kind: "ngmodule", type: FormsModule }, { kind: "directive", type: i4$1.ɵNgNoValidate, selector: "form:not([ngNoForm]):not([ngNativeValidate])" }, { kind: "directive", type: i4$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: i4$1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i4$1.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { kind: "directive", type: i4$1.RequiredValidator, selector: ":not([type=checkbox])[required][formControlName],:not([type=checkbox])[required][formControl],:not([type=checkbox])[required][ngModel]", inputs: ["required"] }, { kind: "directive", type: i4$1.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "directive", type: i4$1.NgForm, selector: "form:not([ngNoForm]):not([formGroup]),ng-form,[ngForm]", inputs: ["ngFormOptions"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { kind: "component", type: FormGroupComponent, selector: "c8y-form-group", inputs: ["hasError", "hasWarning", "hasSuccess", "novalidation", "status"] }, { kind: "component", type: TypeaheadComponent, selector: "c8y-typeahead", inputs: ["required", "maxlength", "disabled", "allowFreeEntries", "placeholder", "displayProperty", "icon", "name", "autoClose", "hideNew", "container", "selected", "title", "highlightFirstItem"], outputs: ["onSearch", "onIconClick"] }, { kind: "directive", type: ForOfDirective, selector: "[c8yFor]", inputs: ["c8yForOf", "c8yForLoadMore", "c8yForPipe", "c8yForNotFound", "c8yForMaxIterations", "c8yForLoadingTemplate", "c8yForLoadNextLabel", "c8yForLoadingLabel", "c8yForRealtime", "c8yForRealtimeOptions", "c8yForComparator", "c8yForEnableVirtualScroll", "c8yForVirtualScrollElementSize", "c8yForVirtualScrollStrategy", "c8yForVirtualScrollContainerHeight"], outputs: ["c8yForCount", "c8yForChange", "c8yForLoadMoreComponent"] }, { kind: "component", type: ListItemComponent, selector: "c8y-list-item, c8y-li", inputs: ["active", "highlighted", "emptyActions", "dense", "collapsed", "selectable"], outputs: ["collapsedChange"] }, { kind: "component", type: HighlightComponent, selector: "c8y-highlight", inputs: ["pattern", "text", "elementClass", "shouldTrimPattern"] }, { kind: "component", type: MessagesComponent, selector: "c8y-messages", inputs: ["show", "defaults", "helpMessage"] }, { kind: "directive", type: MessageDirective, selector: "c8y-message", inputs: ["name", "text"] }, { kind: "directive", type: RequiredInputPlaceholderDirective, selector: "input[required], input[formControlName]" }, { kind: "component", type: FilePickerComponent, selector: "c8y-file-picker", inputs: ["maxAllowedFiles", "uploadChoice", "allowedUploadChoices", "fileUrl", "fileBinary", "config", "filePickerIndex", "fileUrlPopover"], outputs: ["onFilesPicked"] }, { kind: "directive", type: ProductExperienceDirective, selector: "[c8yProductExperience]", inputs: ["actionName", "actionData", "inherit", "suppressDataOverriding"] }, { kind: "directive", type: NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "pipe", type: AsyncPipe, name: "async" }, { kind: "pipe", type: C8yTranslatePipe, name: "translate" }] }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.16", ngImport: i0, type: AddFirmwarePatchModalComponent, decorators: [{
             type: Component,
@@ -358,7 +358,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.16", ngImpo
                         NgClass,
                         AsyncPipe,
                         C8yTranslatePipe
-                    ], template: "<div class=\"viewport-modal\">\n  <div class=\"modal-header dialog-header\">\n    <i [c8yIcon]=\"'c8y-firmware'\"></i>\n    <h4\n      id=\"addFirmwarePatchModalTitle\"\n      translate\n    >\n      Add firmware patch\n    </h4>\n  </div>\n  <div\n    class=\"p-16 text-center separator-bottom\"\n    id=\"addFirmwarePatchModalDescription\"\n  >\n    <p\n      class=\"text-medium text-16 m-0\"\n      translate\n    >\n      Select a firmware version\n    </p>\n  </div>\n\n  <form\n    class=\"d-contents\"\n    autocomplete=\"off\"\n    #firmwarePatchForm=\"ngForm\"\n    (ngSubmit)=\"firmwarePatchForm.form.valid && save()\"\n  >\n    <div class=\"modal-inner-scroll\">\n      <div class=\"modal-body\">\n        <div [hidden]=\"firmwarePreselected\">\n          <c8y-form-group>\n            <label\n              for=\"firmwareName\"\n              translate\n            >\n              Firmware\n            </label>\n            <c8y-typeahead\n              placeholder=\"{{ 'Select or enter' | translate }}\"\n              name=\"firmwareName\"\n              [ngModel]=\"model.selected\"\n              (onSearch)=\"firmwareInput$.next($event)\"\n              [allowFreeEntries]=\"false\"\n              [required]=\"true\"\n            >\n              <c8y-li\n                class=\"p-l-8 p-r-8 c8y-list__item--link\"\n                *c8yFor=\"let firmware of firmwares$ | async; loadMore: 'auto'\"\n                (click)=\"model.selected = firmware; firmwareSelected$.next(firmware)\"\n                [active]=\"model.selected === firmware\"\n              >\n                <c8y-highlight\n                  [text]=\"firmware.name || '--'\"\n                  [pattern]=\"firmwareInput$ | async\"\n                ></c8y-highlight>\n              </c8y-li>\n            </c8y-typeahead>\n            <c8y-messages>\n              <c8y-message\n                name=\"notExisting\"\n                [text]=\"'Select one of the existing firmwares.' | translate\"\n              ></c8y-message>\n            </c8y-messages>\n          </c8y-form-group>\n        </div>\n\n        <c8y-form-group>\n          <label\n            class=\"m-r-8\"\n            for=\"patchDependency\"\n            translate\n          >\n            Version\n          </label>\n          <c8y-typeahead\n            placeholder=\"{{ 'Select or enter' | translate }}\"\n            name=\"patchDependency\"\n            [ngModel]=\"model.dependency\"\n            data-cy=\"add-firmware-patch-modal--patchDependency\"\n            (onSearch)=\"patchDependencyInput$.next($event)\"\n            [displayProperty]=\"'c8y_Firmware.version'\"\n            [allowFreeEntries]=\"false\"\n            [disabled]=\"\n              (baseVersions$ | async) === null || (baseVersions$ | async)?.data.length === 0\n            \"\n            [required]=\"true\"\n          >\n            <c8y-li\n              class=\"p-l-8 p-r-8 c8y-list__item--link\"\n              *c8yFor=\"\n                let baseVersion of baseVersions$;\n                loadMore: 'auto';\n                pipe: baseVersionsFilterPipe\n              \"\n              (click)=\"model.dependency = baseVersion\"\n              [active]=\"model.dependency === baseVersion\"\n            >\n              <c8y-highlight\n                [text]=\"baseVersion.c8y_Firmware.version || '--'\"\n                [pattern]=\"patchDependencyInput$ | async\"\n              ></c8y-highlight>\n            </c8y-li>\n          </c8y-typeahead>\n          <c8y-messages>\n            <c8y-message\n              name=\"notExisting\"\n              [text]=\"'Select one of the existing versions.' | translate\"\n            ></c8y-message>\n          </c8y-messages>\n        </c8y-form-group>\n\n        <c8y-form-group>\n          <label\n            for=\"patchVersion\"\n            translate\n          >\n            Patch\n          </label>\n          <input\n            class=\"form-control\"\n            id=\"patchVersion\"\n            placeholder=\"{{ 'e.g.' | translate }} 1.0.0\"\n            name=\"patchVersion\"\n            autocomplete=\"off\"\n            required\n            data-cy=\"add-firmware-patch-modal--patchVersion\"\n            [(ngModel)]=\"model.patchVersion\"\n          />\n        </c8y-form-group>\n\n        <c8y-form-group>\n          <div\n            class=\"legend form-block m-t-40\"\n            translate\n          >\n            Patch file\n          </div>\n          <c8y-file-picker\n            [maxAllowedFiles]=\"1\"\n            (onFilesPicked)=\"onFile($event)\"\n            [allowedUploadChoices]=\"['uploadBinary', 'uploadUrl', 'provided']\"\n            [fileUrlPopover]=\"textForFirmwareUrlPopover\"\n          ></c8y-file-picker>\n        </c8y-form-group>\n      </div>\n    </div>\n    <div class=\"modal-footer\">\n      <button\n        class=\"btn btn-default\"\n        title=\"{{ 'Cancel' | translate }}\"\n        type=\"button\"\n        data-cy=\"add-firmware-patch-modal--cancel-btn\"\n        (click)=\"cancel()\"\n        [disabled]=\"saving\"\n        translate\n      >\n        Cancel\n      </button>\n      <button\n        class=\"btn btn-primary\"\n        title=\"{{ 'Add firmware patch' | translate }}\"\n        type=\"submit\"\n        [ngClass]=\"{ 'btn-pending': saving }\"\n        [disabled]=\"\n          !firmwarePatchForm.form.valid ||\n          firmwarePatchForm.form.pristine ||\n          (!model.binary?.url && !model.binary?.file && model.binary?.url !== '$PROVIDED') ||\n          saving\n        \"\n        translate\n        c8yProductExperience\n        [actionName]=\"PRODUCT_EXPERIENCE.FIRMWARE.EVENTS.REPOSITORY\"\n        [actionData]=\"{\n          component: PRODUCT_EXPERIENCE.FIRMWARE.COMPONENTS.ADD_FIRMWAR_PATCH_MODAL,\n          result: PRODUCT_EXPERIENCE.FIRMWARE.RESULTS.ADD_FIRMWARE_PATCH\n        }\"\n      >\n        Add firmware patch\n      </button>\n    </div>\n  </form>\n</div>\n" }]
+                    ], template: "<div class=\"viewport-modal\">\n  <div class=\"modal-header dialog-header\">\n    <i [c8yIcon]=\"'c8y-firmware'\"></i>\n    <h4\n      id=\"addFirmwarePatchModalTitle\"\n      translate\n    >\n      Add firmware patch\n    </h4>\n  </div>\n  <div\n    class=\"p-16 text-center separator-bottom\"\n    id=\"addFirmwarePatchModalDescription\"\n  >\n    <p\n      class=\"text-medium text-16 m-0\"\n      translate\n    >\n      Select a firmware version\n    </p>\n  </div>\n\n  <form\n    class=\"d-contents\"\n    autocomplete=\"off\"\n    #firmwarePatchForm=\"ngForm\"\n    (ngSubmit)=\"firmwarePatchForm.form.valid && save()\"\n  >\n    <div class=\"modal-inner-scroll\">\n      <div class=\"modal-body\">\n        <div [hidden]=\"firmwarePreselected\">\n          <c8y-form-group>\n            <label\n              for=\"firmwareName\"\n              translate\n            >\n              Firmware\n            </label>\n            <c8y-typeahead\n              placeholder=\"{{ 'Select or enter' | translate }}\"\n              name=\"firmwareName\"\n              [ngModel]=\"model.selected\"\n              (onSearch)=\"firmwareInput$.next($event)\"\n              [allowFreeEntries]=\"false\"\n              [required]=\"true\"\n            >\n              <c8y-li\n                class=\"p-l-8 p-r-8 c8y-list__item--link\"\n                *c8yFor=\"let firmware of firmwares$ | async; loadMore: 'auto'\"\n                (click)=\"model.selected = firmware; firmwareSelected$.next(firmware)\"\n                [active]=\"model.selected === firmware\"\n              >\n                <c8y-highlight\n                  [text]=\"firmware.name || '--'\"\n                  [pattern]=\"firmwareInput$ | async\"\n                ></c8y-highlight>\n              </c8y-li>\n            </c8y-typeahead>\n            <c8y-messages>\n              <c8y-message\n                name=\"notExisting\"\n                [text]=\"'Select one of the existing firmwares.' | translate\"\n              ></c8y-message>\n            </c8y-messages>\n          </c8y-form-group>\n        </div>\n\n        <c8y-form-group>\n          <label\n            class=\"m-r-8\"\n            for=\"patchDependency\"\n            translate\n          >\n            Version\n          </label>\n          <c8y-typeahead\n            placeholder=\"{{ 'Select or enter' | translate }}\"\n            name=\"patchDependency\"\n            [ngModel]=\"model.dependency\"\n            data-cy=\"add-firmware-patch-modal--patchDependency\"\n            (onSearch)=\"patchDependencyInput$.next($event)\"\n            [displayProperty]=\"'c8y_Firmware.version'\"\n            [allowFreeEntries]=\"false\"\n            [disabled]=\"\n              (baseVersions$ | async) === null || (baseVersions$ | async)?.data.length === 0\n            \"\n            [required]=\"true\"\n          >\n            <c8y-li\n              class=\"p-l-8 p-r-8 c8y-list__item--link\"\n              *c8yFor=\"\n                let baseVersion of baseVersions$;\n                loadMore: 'auto';\n                pipe: baseVersionsFilterPipe\n              \"\n              (click)=\"model.dependency = baseVersion\"\n              [active]=\"model.dependency === baseVersion\"\n            >\n              <c8y-highlight\n                [text]=\"baseVersion.c8y_Firmware.version || '--'\"\n                [pattern]=\"patchDependencyInput$ | async\"\n              ></c8y-highlight>\n            </c8y-li>\n          </c8y-typeahead>\n          <c8y-messages>\n            <c8y-message\n              name=\"notExisting\"\n              [text]=\"'Select one of the existing versions.' | translate\"\n            ></c8y-message>\n          </c8y-messages>\n        </c8y-form-group>\n\n        <c8y-form-group>\n          <label\n            for=\"patchVersion\"\n            translate\n          >\n            Patch\n          </label>\n          <input\n            class=\"form-control\"\n            id=\"patchVersion\"\n            placeholder=\"{{ 'e.g.' | translate }} 1.0.0\"\n            name=\"patchVersion\"\n            autocomplete=\"off\"\n            required\n            data-cy=\"add-firmware-patch-modal--patchVersion\"\n            [(ngModel)]=\"model.patchVersion\"\n          />\n        </c8y-form-group>\n\n        <c8y-form-group>\n          <div\n            class=\"legend form-block m-t-40\"\n            translate\n          >\n            Patch file\n          </div>\n          <c8y-file-picker\n            [maxAllowedFiles]=\"1\"\n            (onFilesPicked)=\"onFile($event)\"\n            [allowedUploadChoices]=\"['uploadBinary', 'uploadUrl', 'provided']\"\n            [fileUrlPopover]=\"textForFirmwareUrlPopover\"\n          ></c8y-file-picker>\n        </c8y-form-group>\n      </div>\n    </div>\n    <div class=\"modal-footer\">\n      <button\n        class=\"btn btn-default\"\n        title=\"{{ 'Cancel' | translate }}\"\n        type=\"button\"\n        data-cy=\"add-firmware-patch-modal--cancel-btn\"\n        (click)=\"cancel()\"\n        [disabled]=\"saving\"\n        translate\n      >\n        Cancel\n      </button>\n      <button\n        class=\"btn btn-primary\"\n        title=\"{{ 'Add firmware patch' | translate }}\"\n        type=\"submit\"\n        [ngClass]=\"{ 'btn-pending': saving }\"\n        [disabled]=\"\n          !firmwarePatchForm.form.valid ||\n          firmwarePatchForm.form.pristine ||\n          (!model.binary?.url && !model.binary?.file && model.binary?.url !== '') ||\n          saving\n        \"\n        translate\n        c8yProductExperience\n        [actionName]=\"PRODUCT_EXPERIENCE.FIRMWARE.EVENTS.REPOSITORY\"\n        [actionData]=\"{\n          component: PRODUCT_EXPERIENCE.FIRMWARE.COMPONENTS.ADD_FIRMWAR_PATCH_MODAL,\n          result: PRODUCT_EXPERIENCE.FIRMWARE.RESULTS.ADD_FIRMWARE_PATCH\n        }\"\n      >\n        Add firmware patch\n      </button>\n    </div>\n  </form>\n</div>\n" }]
         }], ctorParameters: () => [{ type: i1$1.BsModalRef }, { type: i2.RepositoryService }, { type: i4.AlertService }], propDecorators: { saved: [{
                 type: Output
             }], dropdown: [{
@@ -480,14 +480,13 @@ class AddFirmwareModalComponent {
         });
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.16", ngImport: i0, type: AddFirmwareModalComponent, deps: [{ token: i1$1.BsModalRef }, { token: i2.RepositoryService }, { token: i4.AlertService }], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "20.3.16", type: AddFirmwareModalComponent, isStandalone: true, selector: "c8y-add-firmware-software-modal", outputs: { saved: "saved" }, viewQueries: [{ propertyName: "form", first: true, predicate: ["firmwareForm"], descendants: true }], ngImport: i0, template: "<div class=\"viewport-modal\">\n  <div class=\"modal-header dialog-header\">\n    <i [c8yIcon]=\"'c8y-firmware'\"></i>\n    <div\n      class=\"modal-title\"\n      id=\"addFirmwareModalTitle\"\n      translate\n    >\n      Add firmware\n    </div>\n  </div>\n  <div\n    class=\"p-16 text-center separator-bottom\"\n    *ngIf=\"!firmwarePreselected\"\n  >\n    <p\n      class=\"text-medium text-16 m-0\"\n      translate\n    >\n      Select or create new firmware\n    </p>\n  </div>\n  <form\n    class=\"d-contents\"\n    autocomplete=\"off\"\n    #firmwareForm=\"ngForm\"\n    (ngSubmit)=\"firmwareForm.form.valid && save()\"\n  >\n    <div class=\"modal-inner-scroll\">\n      <div\n        class=\"modal-body\"\n        id=\"addFirmwareModalDescription\"\n      >\n        <div [hidden]=\"firmwarePreselected\">\n          <c8y-form-group>\n            <label\n              for=\"firmwareName\"\n              translate\n            >\n              Firmware\n            </label>\n            <c8y-typeahead\n              placeholder=\"{{ 'Select or enter' | translate }}\"\n              name=\"firmwareName\"\n              [(ngModel)]=\"model.selected\"\n              data-cy=\"add-firmware-modal--input-name\"\n              (onSearch)=\"onInput.next($event)\"\n              [required]=\"true\"\n            >\n              <c8y-li\n                class=\"p-l-8 p-r-8 c8y-list__item--link\"\n                *c8yFor=\"\n                  let firmware of firmwaresResult;\n                  loadMore: 'auto';\n                  notFound: notFoundTemplate\n                \"\n                (click)=\"onFirmwareSelect(firmware)\"\n                [active]=\"model.selected === firmware\"\n              >\n                <c8y-highlight\n                  [text]=\"firmware.name || '--'\"\n                  [pattern]=\"onInput | async\"\n                ></c8y-highlight>\n              </c8y-li>\n              <ng-template #notFoundTemplate>\n                <c8y-li\n                  class=\"bg-level-2 p-8\"\n                  *ngIf=\"(onInput | async)?.length > 0\"\n                >\n                  <span translate>No match found.</span>\n                  <button\n                    class=\"btn btn-primary btn-xs m-l-8\"\n                    title=\"{{ 'Add new`firmware`' | translate }}\"\n                    type=\"button\"\n                    translate\n                  >\n                    Add new`firmware`\n                  </button>\n                </c8y-li>\n              </ng-template>\n            </c8y-typeahead>\n          </c8y-form-group>\n\n          <c8y-form-group>\n            <label\n              for=\"firmwareDescription\"\n              translate\n            >\n              Description\n            </label>\n            <input\n              class=\"form-control\"\n              id=\"firmwareDescription\"\n              placeholder=\"{{ 'e.g. Firmware for hardware revision B' | translate }}\"\n              name=\"description\"\n              autocomplete=\"off\"\n              data-cy=\"add-firmware-modal--input-description\"\n              [(ngModel)]=\"model.description\"\n              [disabled]=\"model.selected?.id\"\n              [required]=\"true\"\n              [pattern]=\"ValidationPattern.rules.noWhiteSpaceOnly.pattern\"\n            />\n          </c8y-form-group>\n\n          <c8y-form-group>\n            <label\n              class=\"control-label\"\n              for=\"firmwareDeviceTypeFilter\"\n            >\n              {{ 'Device type filter' | translate }}\n              <button\n                class=\"btn-help\"\n                [attr.aria-label]=\"'Help' | translate\"\n                popover=\"{{\n                  'If the filter is set, the firmware will show up for installation only for devices of that type. If no filter is set, it will be available for all devices.'\n                    | translate\n                }}\"\n                placement=\"right\"\n                triggers=\"focus\"\n                container=\"body\"\n                type=\"button\"\n              ></button>\n            </label>\n            <input\n              class=\"form-control\"\n              id=\"firmwareDeviceTypeFilter\"\n              placeholder=\"{{ 'e.g.' | translate }} c8y_Linux\"\n              name=\"firmwareDeviceTypeFilter\"\n              data-cy=\"add-firmware-modal--firmwareDeviceTypeFilter\"\n              [(ngModel)]=\"model.deviceType\"\n              [disabled]=\"model.selected?.id\"\n              [pattern]=\"ValidationPattern.rules.noWhiteSpaceOnly.pattern\"\n            />\n          </c8y-form-group>\n        </div>\n\n        <c8y-form-group>\n          <label\n            for=\"firmwareVersion\"\n            translate\n          >\n            Version\n          </label>\n          <input\n            class=\"form-control\"\n            id=\"firmwareVersion\"\n            placeholder=\"{{ 'e.g.' | translate }} 1.0.0\"\n            name=\"version\"\n            autocomplete=\"off\"\n            data-cy=\"add-firmware-modal--firmwareVersion\"\n            [(ngModel)]=\"model.version\"\n            [required]=\"true\"\n            [pattern]=\"ValidationPattern.rules.noWhiteSpaceOnly.pattern\"\n          />\n        </c8y-form-group>\n\n        <c8y-form-group>\n          <div\n            class=\"legend form-block m-t-40\"\n            translate\n          >\n            Firmware file\n          </div>\n          <c8y-file-picker\n            [maxAllowedFiles]=\"1\"\n            (onFilesPicked)=\"onFile($event)\"\n            [allowedUploadChoices]=\"['uploadBinary', 'uploadUrl', 'provided']\"\n            [fileUrlPopover]=\"textForFirmwareUrlPopover\"\n          ></c8y-file-picker>\n        </c8y-form-group>\n      </div>\n    </div>\n    <div class=\"modal-footer\">\n      <button\n        class=\"btn btn-default\"\n        title=\"{{ 'Cancel' | translate }}\"\n        type=\"button\"\n        data-cy=\"add-firmware-modal--cancel-btn\"\n        (click)=\"cancel()\"\n        [disabled]=\"saving\"\n        translate\n      >\n        Cancel\n      </button>\n\n      <button\n        class=\"btn btn-primary\"\n        title=\"{{ 'Add firmware' | translate }}\"\n        type=\"submit\"\n        [ngClass]=\"{ 'btn-pending': saving }\"\n        [disabled]=\"\n          !firmwareForm.form.valid ||\n          firmwareForm.form.pristine ||\n          saving ||\n          (!model.binary?.url && !model.binary?.file)\n        \"\n        [actionName]=\"PRODUCT_EXPERIENCE.FIRMWARE.EVENTS.REPOSITORY\"\n        [actionData]=\"{\n          component: PRODUCT_EXPERIENCE.FIRMWARE.COMPONENTS.ADD_FIRMWARE_MODAL,\n          result:\n            firmwarePreselected || model.selected?.id\n              ? PRODUCT_EXPERIENCE.FIRMWARE.RESULTS.ADD_FIRMWARE_VERSION\n              : PRODUCT_EXPERIENCE.FIRMWARE.RESULTS.ADD_FIRMWARE\n        }\"\n        translate\n        c8yProductExperience\n      >\n        Add firmware\n      </button>\n    </div>\n  </form>\n</div>\n", dependencies: [{ kind: "directive", type: IconDirective, selector: "[c8yIcon]", inputs: ["c8yIcon"] }, { kind: "directive", type: C8yTranslateDirective, selector: "[translate],[ngx-translate]" }, { kind: "directive", type: NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "ngmodule", type: FormsModule }, { kind: "directive", type: i4$1.ɵNgNoValidate, selector: "form:not([ngNoForm]):not([ngNativeValidate])" }, { kind: "directive", type: i4$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: i4$1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i4$1.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { kind: "directive", type: i4$1.RequiredValidator, selector: ":not([type=checkbox])[required][formControlName],:not([type=checkbox])[required][formControl],:not([type=checkbox])[required][ngModel]", inputs: ["required"] }, { kind: "directive", type: i4$1.PatternValidator, selector: "[pattern][formControlName],[pattern][formControl],[pattern][ngModel]", inputs: ["pattern"] }, { kind: "directive", type: i4$1.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "directive", type: i4$1.NgForm, selector: "form:not([ngNoForm]):not([formGroup]),ng-form,[ngForm]", inputs: ["ngFormOptions"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { kind: "component", type: FormGroupComponent, selector: "c8y-form-group", inputs: ["hasError", "hasWarning", "hasSuccess", "novalidation", "status"] }, { kind: "component", type: TypeaheadComponent, selector: "c8y-typeahead", inputs: ["required", "maxlength", "disabled", "allowFreeEntries", "placeholder", "displayProperty", "icon", "name", "autoClose", "hideNew", "container", "selected", "title", "highlightFirstItem"], outputs: ["onSearch", "onIconClick"] }, { kind: "directive", type: ForOfDirective, selector: "[c8yFor]", inputs: ["c8yForOf", "c8yForLoadMore", "c8yForPipe", "c8yForNotFound", "c8yForMaxIterations", "c8yForLoadingTemplate", "c8yForLoadNextLabel", "c8yForLoadingLabel", "c8yForRealtime", "c8yForRealtimeOptions", "c8yForComparator", "c8yForEnableVirtualScroll", "c8yForVirtualScrollElementSize", "c8yForVirtualScrollStrategy", "c8yForVirtualScrollContainerHeight"], outputs: ["c8yForCount", "c8yForChange", "c8yForLoadMoreComponent"] }, { kind: "component", type: ListItemComponent, selector: "c8y-list-item, c8y-li", inputs: ["active", "highlighted", "emptyActions", "dense", "collapsed", "selectable"], outputs: ["collapsedChange"] }, { kind: "component", type: HighlightComponent, selector: "c8y-highlight", inputs: ["pattern", "text", "elementClass", "shouldTrimPattern"] }, { kind: "directive", type: RequiredInputPlaceholderDirective, selector: "input[required], input[formControlName]" }, { 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: "component", type: FilePickerComponent, selector: "c8y-file-picker", inputs: ["maxAllowedFiles", "uploadChoice", "allowedUploadChoices", "fileUrl", "fileBinary", "config", "filePickerIndex", "fileUrlPopover"], outputs: ["onFilesPicked"] }, { kind: "directive", type: ProductExperienceDirective, selector: "[c8yProductExperience]", inputs: ["actionName", "actionData", "inherit", "suppressDataOverriding"] }, { kind: "directive", type: NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "pipe", type: AsyncPipe, name: "async" }, { kind: "pipe", type: C8yTranslatePipe, name: "translate" }] }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.3.16", type: AddFirmwareModalComponent, isStandalone: true, selector: "c8y-add-firmware-software-modal", outputs: { saved: "saved" }, viewQueries: [{ propertyName: "form", first: true, predicate: ["firmwareForm"], descendants: true }], ngImport: i0, template: "<div class=\"viewport-modal\">\n  <div class=\"modal-header dialog-header\">\n    <i [c8yIcon]=\"'c8y-firmware'\"></i>\n    <div\n      class=\"modal-title\"\n      id=\"addFirmwareModalTitle\"\n      translate\n    >\n      Add firmware\n    </div>\n  </div>\n  @if (!firmwarePreselected) {\n    <div class=\"p-16 text-center separator-bottom\">\n      <p\n        class=\"text-medium text-16 m-0\"\n        translate\n      >\n        Select or create new firmware\n      </p>\n    </div>\n  }\n  <form\n    class=\"d-contents\"\n    autocomplete=\"off\"\n    #firmwareForm=\"ngForm\"\n    (ngSubmit)=\"firmwareForm.form.valid && save()\"\n  >\n    <div class=\"modal-inner-scroll\">\n      <div\n        class=\"modal-body\"\n        id=\"addFirmwareModalDescription\"\n      >\n        <div [hidden]=\"firmwarePreselected\">\n          <c8y-form-group>\n            <label\n              for=\"firmwareName\"\n              translate\n            >\n              Firmware\n            </label>\n            <c8y-typeahead\n              placeholder=\"{{ 'Select or enter' | translate }}\"\n              name=\"firmwareName\"\n              [(ngModel)]=\"model.selected\"\n              data-cy=\"add-firmware-modal--input-name\"\n              (onSearch)=\"onInput.next($event)\"\n              [required]=\"true\"\n            >\n              <c8y-li\n                class=\"p-l-8 p-r-8 c8y-list__item--link\"\n                *c8yFor=\"\n                  let firmware of firmwaresResult;\n                  loadMore: 'auto';\n                  notFound: notFoundTemplate\n                \"\n                (click)=\"onFirmwareSelect(firmware)\"\n                [active]=\"model.selected === firmware\"\n              >\n                <c8y-highlight\n                  [text]=\"firmware.name || '--'\"\n                  [pattern]=\"onInput | async\"\n                ></c8y-highlight>\n              </c8y-li>\n              <ng-template #notFoundTemplate>\n                @if ((onInput | async)?.length > 0) {\n                  <c8y-li class=\"bg-level-2 p-8\">\n                    <span translate>No match found.</span>\n                    <button\n                      class=\"btn btn-primary btn-xs m-l-8\"\n                      title=\"{{ 'Add new`firmware`' | translate }}\"\n                      type=\"button\"\n                      translate\n                    >\n                      Add new`firmware`\n                    </button>\n                  </c8y-li>\n                }\n              </ng-template>\n            </c8y-typeahead>\n          </c8y-form-group>\n\n          <c8y-form-group>\n            <label\n              for=\"firmwareDescription\"\n              translate\n            >\n              Description\n            </label>\n            <input\n              class=\"form-control\"\n              id=\"firmwareDescription\"\n              placeholder=\"{{ 'e.g. Firmware for hardware revision B' | translate }}\"\n              name=\"description\"\n              autocomplete=\"off\"\n              data-cy=\"add-firmware-modal--input-description\"\n              [(ngModel)]=\"model.description\"\n              [disabled]=\"model.selected?.id\"\n              [required]=\"true\"\n              [pattern]=\"ValidationPattern.rules.noWhiteSpaceOnly.pattern\"\n            />\n          </c8y-form-group>\n\n          <c8y-form-group>\n            <label\n              class=\"control-label\"\n              for=\"firmwareDeviceTypeFilter\"\n            >\n              {{ 'Device type filter' | translate }}\n              <button\n                class=\"btn-help\"\n                [attr.aria-label]=\"'Help' | translate\"\n                popover=\"{{\n                  'If the filter is set, the firmware will show up for installation only for devices of that type. If no filter is set, it will be available for all devices.'\n                    | translate\n                }}\"\n                placement=\"right\"\n                triggers=\"focus\"\n                container=\"body\"\n                type=\"button\"\n              ></button>\n            </label>\n            <input\n              class=\"form-control\"\n              id=\"firmwareDeviceTypeFilter\"\n              placeholder=\"{{ 'e.g.' | translate }} c8y_Linux\"\n              name=\"firmwareDeviceTypeFilter\"\n              data-cy=\"add-firmware-modal--firmwareDeviceTypeFilter\"\n              [(ngModel)]=\"model.deviceType\"\n              [disabled]=\"model.selected?.id\"\n              [pattern]=\"ValidationPattern.rules.noWhiteSpaceOnly.pattern\"\n            />\n          </c8y-form-group>\n        </div>\n\n        <c8y-form-group>\n          <label\n            for=\"firmwareVersion\"\n            translate\n          >\n            Version\n          </label>\n          <input\n            class=\"form-control\"\n            id=\"firmwareVersion\"\n            placeholder=\"{{ 'e.g.' | translate }} 1.0.0\"\n            name=\"version\"\n            autocomplete=\"off\"\n            data-cy=\"add-firmware-modal--firmwareVersion\"\n            [(ngModel)]=\"model.version\"\n            [required]=\"true\"\n            [pattern]=\"ValidationPattern.rules.noWhiteSpaceOnly.pattern\"\n          />\n        </c8y-form-group>\n\n        <c8y-form-group>\n          <div\n            class=\"legend form-block m-t-40\"\n            translate\n          >\n            Firmware file\n          </div>\n          <c8y-file-picker\n            [maxAllowedFiles]=\"1\"\n            (onFilesPicked)=\"onFile($event)\"\n            [allowedUploadChoices]=\"['uploadBinary', 'uploadUrl', 'provided']\"\n            [fileUrlPopover]=\"textForFirmwareUrlPopover\"\n          ></c8y-file-picker>\n        </c8y-form-group>\n      </div>\n    </div>\n    <div class=\"modal-footer\">\n      <button\n        class=\"btn btn-default\"\n        title=\"{{ 'Cancel' | translate }}\"\n        type=\"button\"\n        data-cy=\"add-firmware-modal--cancel-btn\"\n        (click)=\"cancel()\"\n        [disabled]=\"saving\"\n        translate\n      >\n        Cancel\n      </button>\n\n      <button\n        class=\"btn btn-primary\"\n        title=\"{{ 'Add firmware' | translate }}\"\n        type=\"submit\"\n        [ngClass]=\"{ 'btn-pending': saving }\"\n        [disabled]=\"\n          !firmwareForm.form.valid ||\n          firmwareForm.form.pristine ||\n          saving ||\n          ([null, undefined].includes(model.binary?.url) && !model.binary?.file)\n        \"\n        [actionName]=\"PRODUCT_EXPERIENCE.FIRMWARE.EVENTS.REPOSITORY\"\n        [actionData]=\"{\n          component: PRODUCT_EXPERIENCE.FIRMWARE.COMPONENTS.ADD_FIRMWARE_MODAL,\n          result:\n            firmwarePreselected || model.selected?.id\n              ? PRODUCT_EXPERIENCE.FIRMWARE.RESULTS.ADD_FIRMWARE_VERSION\n              : PRODUCT_EXPERIENCE.FIRMWARE.RESULTS.ADD_FIRMWARE\n        }\"\n        translate\n        c8yProductExperience\n      >\n        Add firmware\n      </button>\n    </div>\n  </form>\n</div>\n", dependencies: [{ kind: "directive", type: IconDirective, selector: "[c8yIcon]", inputs: ["c8yIcon"] }, { kind: "directive", type: C8yTranslateDirective, selector: "[translate],[ngx-translate]" }, { kind: "ngmodule", type: FormsModule }, { kind: "directive", type: i4$1.ɵNgNoValidate, selector: "form:not([ngNoForm]):not([ngNativeValidate])" }, { kind: "directive", type: i4$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: i4$1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i4$1.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { kind: "directive", type: i4$1.RequiredValidator, selector: ":not([type=checkbox])[required][formControlName],:not([type=checkbox])[required][formControl],:not([type=checkbox])[required][ngModel]", inputs: ["required"] }, { kind: "directive", type: i4$1.PatternValidator, selector: "[pattern][formControlName],[pattern][formControl],[pattern][ngModel]", inputs: ["pattern"] }, { kind: "directive", type: i4$1.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "directive", type: i4$1.NgForm, selector: "form:not([ngNoForm]):not([formGroup]),ng-form,[ngForm]", inputs: ["ngFormOptions"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { kind: "component", type: FormGroupComponent, selector: "c8y-form-group", inputs: ["hasError", "hasWarning", "hasSuccess", "novalidation", "status"] }, { kind: "component", type: TypeaheadComponent, selector: "c8y-typeahead", inputs: ["required", "maxlength", "disabled", "allowFreeEntries", "placeholder", "displayProperty", "icon", "name", "autoClose", "hideNew", "container", "selected", "title", "highlightFirstItem"], outputs: ["onSearch", "onIconClick"] }, { kind: "directive", type: ForOfDirective, selector: "[c8yFor]", inputs: ["c8yForOf", "c8yForLoadMore", "c8yForPipe", "c8yForNotFound", "c8yForMaxIterations", "c8yForLoadingTemplate", "c8yForLoadNextLabel", "c8yForLoadingLabel", "c8yForRealtime", "c8yForRealtimeOptions", "c8yForComparator", "c8yForEnableVirtualScroll", "c8yForVirtualScrollElementSize", "c8yForVirtualScrollStrategy", "c8yForVirtualScrollContainerHeight"], outputs: ["c8yForCount", "c8yForChange", "c8yForLoadMoreComponent"] }, { kind: "component", type: ListItemComponent, selector: "c8y-list-item, c8y-li", inputs: ["active", "highlighted", "emptyActions", "dense", "collapsed", "selectable"], outputs: ["collapsedChange"] }, { kind: "component", type: HighlightComponent, selector: "c8y-highlight", inputs: ["pattern", "text", "elementClass", "shouldTrimPattern"] }, { kind: "directive", type: RequiredInputPlaceholderDirective, selector: "input[required], input[formControlName]" }, { 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: "component", type: FilePickerComponent, selector: "c8y-file-picker", inputs: ["maxAllowedFiles", "uploadChoice", "allowedUploadChoices", "fileUrl", "fileBinary", "config", "filePickerIndex", "fileUrlPopover"], outputs: ["onFilesPicked"] }, { kind: "directive", type: ProductExperienceDirective, selector: "[c8yProductExperience]", inputs: ["actionName", "actionData", "inherit", "suppressDataOverriding"] }, { kind: "directive", type: NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "pipe", type: AsyncPipe, name: "async" }, { kind: "pipe", type: C8yTranslatePipe, name: "translate" }] }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.16", ngImport: i0, type: AddFirmwareModalComponent, decorators: [{
             type: Component,
             args: [{ selector: 'c8y-add-firmware-software-modal', imports: [
                         IconDirective,
                         C8yTranslateDirective,
-                        NgIf,
                         FormsModule,
                         FormGroupComponent,
                         TypeaheadComponent,
@@ -501,7 +500,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.16", ngImpo
                         NgClass,
                         AsyncPipe,
                         C8yTranslatePipe
-                    ], template: "<div class=\"viewport-modal\">\n  <div class=\"modal-header dialog-header\">\n    <i [c8yIcon]=\"'c8y-firmware'\"></i>\n    <div\n      class=\"modal-title\"\n      id=\"addFirmwareModalTitle\"\n      translate\n    >\n      Add firmware\n    </div>\n  </div>\n  <div\n    class=\"p-16 text-center separator-bottom\"\n    *ngIf=\"!firmwarePreselected\"\n  >\n    <p\n      class=\"text-medium text-16 m-0\"\n      translate\n    >\n      Select or create new firmware\n    </p>\n  </div>\n  <form\n    class=\"d-contents\"\n    autocomplete=\"off\"\n    #firmwareForm=\"ngForm\"\n    (ngSubmit)=\"firmwareForm.form.valid && save()\"\n  >\n    <div class=\"modal-inner-scroll\">\n      <div\n        class=\"modal-body\"\n        id=\"addFirmwareModalDescription\"\n      >\n        <div [hidden]=\"firmwarePreselected\">\n          <c8y-form-group>\n            <label\n              for=\"firmwareName\"\n              translate\n            >\n              Firmware\n            </label>\n            <c8y-typeahead\n              placeholder=\"{{ 'Select or enter' | translate }}\"\n              name=\"firmwareName\"\n              [(ngModel)]=\"model.selected\"\n              data-cy=\"add-firmware-modal--input-name\"\n              (onSearch)=\"onInput.next($event)\"\n              [required]=\"true\"\n            >\n              <c8y-li\n                class=\"p-l-8 p-r-8 c8y-list__item--link\"\n                *c8yFor=\"\n                  let firmware of firmwaresResult;\n                  loadMore: 'auto';\n                  notFound: notFoundTemplate\n                \"\n                (click)=\"onFirmwareSelect(firmware)\"\n                [active]=\"model.selected === firmware\"\n              >\n                <c8y-highlight\n                  [text]=\"firmware.name || '--'\"\n                  [pattern]=\"onInput | async\"\n                ></c8y-highlight>\n              </c8y-li>\n              <ng-template #notFoundTemplate>\n                <c8y-li\n                  class=\"bg-level-2 p-8\"\n                  *ngIf=\"(onInput | async)?.length > 0\"\n                >\n                  <span translate>No match found.</span>\n                  <button\n                    class=\"btn btn-primary btn-xs m-l-8\"\n                    title=\"{{ 'Add new`firmware`' | translate }}\"\n                    type=\"button\"\n                    translate\n                  >\n                    Add new`firmware`\n                  </button>\n                </c8y-li>\n              </ng-template>\n            </c8y-typeahead>\n          </c8y-form-group>\n\n          <c8y-form-group>\n            <label\n              for=\"firmwareDescription\"\n              translate\n            >\n              Description\n            </label>\n            <input\n              class=\"form-control\"\n              id=\"firmwareDescription\"\n              placeholder=\"{{ 'e.g. Firmware for hardware revision B' | translate }}\"\n              name=\"description\"\n              autocomplete=\"off\"\n              data-cy=\"add-firmware-modal--input-description\"\n              [(ngModel)]=\"model.description\"\n              [disabled]=\"model.selected?.id\"\n              [required]=\"true\"\n              [pattern]=\"ValidationPattern.rules.noWhiteSpaceOnly.pattern\"\n            />\n          </c8y-form-group>\n\n          <c8y-form-group>\n            <label\n              class=\"control-label\"\n              for=\"firmwareDeviceTypeFilter\"\n            >\n              {{ 'Device type filter' | translate }}\n              <button\n                class=\"btn-help\"\n                [attr.aria-label]=\"'Help' | translate\"\n                popover=\"{{\n                  'If the filter is set, the firmware will show up for installation only for devices of that type. If no filter is set, it will be available for all devices.'\n                    | translate\n                }}\"\n                placement=\"right\"\n                triggers=\"focus\"\n                container=\"body\"\n                type=\"button\"\n              ></button>\n            </label>\n            <input\n              class=\"form-control\"\n              id=\"firmwareDeviceTypeFilter\"\n              placeholder=\"{{ 'e.g.' | translate }} c8y_Linux\"\n              name=\"firmwareDeviceTypeFilter\"\n              data-cy=\"add-firmware-modal--firmwareDeviceTypeFilter\"\n              [(ngModel)]=\"model.deviceType\"\n              [disabled]=\"model.selected?.id\"\n              [pattern]=\"ValidationPattern.rules.noWhiteSpaceOnly.pattern\"\n            />\n          </c8y-form-group>\n        </div>\n\n        <c8y-form-group>\n          <label\n            for=\"firmwareVersion\"\n            translate\n          >\n            Version\n          </label>\n          <input\n            class=\"form-control\"\n            id=\"firmwareVersion\"\n            placeholder=\"{{ 'e.g.' | translate }} 1.0.0\"\n            name=\"version\"\n            autocomplete=\"off\"\n            data-cy=\"add-firmware-modal--firmwareVersion\"\n            [(ngModel)]=\"model.version\"\n            [required]=\"true\"\n            [pattern]=\"ValidationPattern.rules.noWhiteSpaceOnly.pattern\"\n          />\n        </c8y-form-group>\n\n        <c8y-form-group>\n          <div\n            class=\"legend form-block m-t-40\"\n            translate\n          >\n            Firmware file\n          </div>\n          <c8y-file-picker\n            [maxAllowedFiles]=\"1\"\n            (onFilesPicked)=\"onFile($event)\"\n            [allowedUploadChoices]=\"['uploadBinary', 'uploadUrl', 'provided']\"\n            [fileUrlPopover]=\"textForFirmwareUrlPopover\"\n          ></c8y-file-picker>\n        </c8y-form-group>\n      </div>\n    </div>\n    <div class=\"modal-footer\">\n      <button\n        class=\"btn btn-default\"\n        title=\"{{ 'Cancel' | translate }}\"\n        type=\"button\"\n        data-cy=\"add-firmware-modal--cancel-btn\"\n        (click)=\"cancel()\"\n        [disabled]=\"saving\"\n        translate\n      >\n        Cancel\n      </button>\n\n      <button\n        class=\"btn btn-primary\"\n        title=\"{{ 'Add firmware' | translate }}\"\n        type=\"submit\"\n        [ngClass]=\"{ 'btn-pending': saving }\"\n        [disabled]=\"\n          !firmwareForm.form.valid ||\n          firmwareForm.form.pristine ||\n          saving ||\n          (!model.binary?.url && !model.binary?.file)\n        \"\n        [actionName]=\"PRODUCT_EXPERIENCE.FIRMWARE.EVENTS.REPOSITORY\"\n        [actionData]=\"{\n          component: PRODUCT_EXPERIENCE.FIRMWARE.COMPONENTS.ADD_FIRMWARE_MODAL,\n          result:\n            firmwarePreselected || model.selected?.id\n              ? PRODUCT_EXPERIENCE.FIRMWARE.RESULTS.ADD_FIRMWARE_VERSION\n              : PRODUCT_EXPERIENCE.FIRMWARE.RESULTS.ADD_FIRMWARE\n        }\"\n        translate\n        c8yProductExperience\n      >\n        Add firmware\n      </button>\n    </div>\n  </form>\n</div>\n" }]
+                    ], template: "<div class=\"viewport-modal\">\n  <div class=\"modal-header dialog-header\">\n    <i [c8yIcon]=\"'c8y-firmware'\"></i>\n    <div\n      class=\"modal-title\"\n      id=\"addFirmwareModalTitle\"\n      translate\n    >\n      Add firmware\n    </div>\n  </div>\n  @if (!firmwarePreselected) {\n    <div class=\"p-16 text-center separator-bottom\">\n      <p\n        class=\"text-medium text-16 m-0\"\n        translate\n      >\n        Select or create new firmware\n      </p>\n    </div>\n  }\n  <form\n    class=\"d-contents\"\n    autocomplete=\"off\"\n    #firmwareForm=\"ngForm\"\n    (ngSubmit)=\"firmwareForm.form.valid && save()\"\n  >\n    <div class=\"modal-inner-scroll\">\n      <div\n        class=\"modal-body\"\n        id=\"addFirmwareModalDescription\"\n      >\n        <div [hidden]=\"firmwarePreselected\">\n          <c8y-form-group>\n            <label\n              for=\"firmwareName\"\n              translate\n            >\n              Firmware\n            </label>\n            <c8y-typeahead\n              placeholder=\"{{ 'Select or enter' | translate }}\"\n              name=\"firmwareName\"\n              [(ngModel)]=\"model.selected\"\n              data-cy=\"add-firmware-modal--input-name\"\n              (onSearch)=\"onInput.next($event)\"\n              [required]=\"true\"\n            >\n              <c8y-li\n                class=\"p-l-8 p-r-8 c8y-list__item--link\"\n                *c8yFor=\"\n                  let firmware of firmwaresResult;\n                  loadMore: 'auto';\n                  notFound: notFoundTemplate\n                \"\n                (click)=\"onFirmwareSelect(firmware)\"\n                [active]=\"model.selected === firmware\"\n              >\n                <c8y-highlight\n                  [text]=\"firmware.name || '--'\"\n                  [pattern]=\"onInput | async\"\n                ></c8y-highlight>\n              </c8y-li>\n              <ng-template #notFoundTemplate>\n                @if ((onInput | async)?.length > 0) {\n                  <c8y-li class=\"bg-level-2 p-8\">\n                    <span translate>No match found.</span>\n                    <button\n                      class=\"btn btn-primary btn-xs m-l-8\"\n                      title=\"{{ 'Add new`firmware`' | translate }}\"\n                      type=\"button\"\n                      translate\n                    >\n                      Add new`firmware`\n                    </button>\n                  </c8y-li>\n                }\n              </ng-template>\n            </c8y-typeahead>\n          </c8y-form-group>\n\n          <c8y-form-group>\n            <label\n              for=\"firmwareDescription\"\n              translate\n            >\n              Description\n            </label>\n            <input\n              class=\"form-control\"\n              id=\"firmwareDescription\"\n              placeholder=\"{{ 'e.g. Firmware for hardware revision B' | translate }}\"\n              name=\"description\"\n              autocomplete=\"off\"\n              data-cy=\"add-firmware-modal--input-description\"\n              [(ngModel)]=\"model.description\"\n              [disabled]=\"model.selected?.id\"\n              [required]=\"true\"\n              [pattern]=\"ValidationPattern.rules.noWhiteSpaceOnly.pattern\"\n            />\n          </c8y-form-group>\n\n          <c8y-form-group>\n            <label\n              class=\"control-label\"\n              for=\"firmwareDeviceTypeFilter\"\n            >\n              {{ 'Device type filter' | translate }}\n              <button\n                class=\"btn-help\"\n                [attr.aria-label]=\"'Help' | translate\"\n                popover=\"{{\n                  'If the filter is set, the firmware will show up for installation only for devices of that type. If no filter is set, it will be available for all devices.'\n                    | translate\n                }}\"\n                placement=\"right\"\n                triggers=\"focus\"\n                container=\"body\"\n                type=\"button\"\n              ></button>\n            </label>\n            <input\n              class=\"form-control\"\n              id=\"firmwareDeviceTypeFilter\"\n              placeholder=\"{{ 'e.g.' | translate }} c8y_Linux\"\n              name=\"firmwareDeviceTypeFilter\"\n              data-cy=\"add-firmware-modal--firmwareDeviceTypeFilter\"\n              [(ngModel)]=\"model.deviceType\"\n              [disabled]=\"model.selected?.id\"\n              [pattern]=\"ValidationPattern.rules.noWhiteSpaceOnly.pattern\"\n            />\n          </c8y-form-group>\n        </div>\n\n        <c8y-form-group>\n          <label\n            for=\"firmwareVersion\"\n            translate\n          >\n            Version\n          </label>\n          <input\n            class=\"form-control\"\n            id=\"firmwareVersion\"\n            placeholder=\"{{ 'e.g.' | translate }} 1.0.0\"\n            name=\"version\"\n            autocomplete=\"off\"\n            data-cy=\"add-firmware-modal--firmwareVersion\"\n            [(ngModel)]=\"model.version\"\n            [required]=\"true\"\n            [pattern]=\"ValidationPattern.rules.noWhiteSpaceOnly.pattern\"\n          />\n        </c8y-form-group>\n\n        <c8y-form-group>\n          <div\n            class=\"legend form-block m-t-40\"\n            translate\n          >\n            Firmware file\n          </div>\n          <c8y-file-picker\n            [maxAllowedFiles]=\"1\"\n            (onFilesPicked)=\"onFile($event)\"\n            [allowedUploadChoices]=\"['uploadBinary', 'uploadUrl', 'provided']\"\n            [fileUrlPopover]=\"textForFirmwareUrlPopover\"\n          ></c8y-file-picker>\n        </c8y-form-group>\n      </div>\n    </div>\n    <div class=\"modal-footer\">\n      <button\n        class=\"btn btn-default\"\n        title=\"{{ 'Cancel' | translate }}\"\n        type=\"button\"\n        data-cy=\"add-firmware-modal--cancel-btn\"\n        (click)=\"cancel()\"\n        [disabled]=\"saving\"\n        translate\n      >\n        Cancel\n      </button>\n\n      <button\n        class=\"btn btn-primary\"\n        title=\"{{ 'Add firmware' | translate }}\"\n        type=\"submit\"\n        [ngClass]=\"{ 'btn-pending': saving }\"\n        [disabled]=\"\n          !firmwareForm.form.valid ||\n          firmwareForm.form.pristine ||\n          saving ||\n          ([null, undefined].includes(model.binary?.url) && !model.binary?.file)\n        \"\n        [actionName]=\"PRODUCT_EXPERIENCE.FIRMWARE.EVENTS.REPOSITORY\"\n        [actionData]=\"{\n          component: PRODUCT_EXPERIENCE.FIRMWARE.COMPONENTS.ADD_FIRMWARE_MODAL,\n          result:\n            firmwarePreselected || model.selected?.id\n              ? PRODUCT_EXPERIENCE.FIRMWARE.RESULTS.ADD_FIRMWARE_VERSION\n              : PRODUCT_EXPERIENCE.FIRMWARE.RESULTS.ADD_FIRMWARE\n        }\"\n        translate\n        c8yProductExperience\n      >\n        Add firmware\n      </button>\n    </div>\n  </form>\n</div>\n" }]
         }], ctorParameters: () => [{ type: i1$1.BsModalRef }, { type: i2.RepositoryService }, { type: i4.AlertService }], propDecorators: { form: [{
                 type: ViewChild,
                 args: ['firmwareForm', { static: false }]
@@ -658,7 +657,7 @@ class FirmwareDetailsComponent {
         this.destroy$.unsubscribe();
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.16", ngImport: i0, type: FirmwareDetailsComponent, deps: [{ token: i1.ActivatedRoute }, { token: i3.InventoryService }, { token: i2.RepositoryService }, { token: i4.AlertService }, { token: i5.TranslateService }, { token: i4.ModalService }, { token: i1$1.BsModalService }, { token: i4.GainsightService }, { token: i1.Router }], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "20.3.16", type: FirmwareDetailsComponent, isStandalone: true, selector: "c8y-firmware-details", ngImport: i0, template: "<c8y-title>\n  {{ (firmware$ | async)?.name }}\n</c8y-title>\n\n<c8y-breadcrumb>\n  <c8y-breadcrumb-item\n    icon=\"c8y-management\"\n    label=\"{{ 'Management' | translate }}\"\n  ></c8y-breadcrumb-item>\n  <c8y-breadcrumb-item\n    icon=\"c8y-firmware\"\n    path=\"#/firmware\"\n    label=\"{{ 'Firmware repository' | translate }}\"\n  ></c8y-breadcrumb-item>\n  <c8y-breadcrumb-item\n    icon=\"c8y-firmware\"\n    label=\"{{ (firmware$ | async)?.name }}\"\n  ></c8y-breadcrumb-item>\n</c8y-breadcrumb>\n\n<c8y-action-bar-item [placement]=\"'right'\">\n  <button\n    class=\"btn btn-link\"\n    title=\"{{ 'Add firmware' | translate }}\"\n    type=\"button\"\n    *ngIf=\"!(isLegacy$ | async)\"\n    data-cy=\"firmware-details--add-firmware-btn\"\n    (click)=\"addBaseVersion()\"\n  >\n    <i c8yIcon=\"plus-circle\"></i>\n    {{ 'Add firmware' | translate }}\n  </button>\n</c8y-action-bar-item>\n\n<c8y-action-bar-item [placement]=\"'right'\">\n  <button\n    class=\"btn btn-link\"\n    title=\"{{ 'Add firmware patch' | translate }}\"\n    type=\"button\"\n    *ngIf=\"canAddPatchVersions$ | async\"\n    data-cy=\"firmware-details--add-firmware-patch-btn\"\n    (click)=\"addPatchVersion()\"\n  >\n    <i c8yIcon=\"plus-circle\"></i>\n    {{ 'Add firmware patch' | translate }}\n  </button>\n</c8y-action-bar-item>\n\n<c8y-action-bar-item [placement]=\"'right'\">\n  <button\n    class=\"btn btn-link\"\n    title=\"{{ 'Reload' | translate }}\"\n    type=\"button\"\n    (click)=\"reload$.next()\"\n  >\n    <i\n      c8yIcon=\"refresh\"\n      [ngClass]=\"{ 'icon-spin': reloading$ | async }\"\n    ></i>\n    {{ 'Reload' | translate }}\n  </button>\n</c8y-action-bar-item>\n\n<div class=\"row\">\n  <div class=\"col-lg-12 col-lg-max\">\n    <div class=\"card card--fullpage\">\n      <div class=\"card-block bg-level-1 flex-no-shrink p-t-24 p-b-24\">\n        <div class=\"content-flex-70\">\n          <div class=\"text-center\">\n            <i class=\"c8y-icon-duocolor icon-48 c8y-icon c8y-icon-firmware\"></i>\n            <p>\n              <small class=\"label label-info\">Firmware</small>\n            </p>\n          </div>\n          <div class=\"flex-grow col-10\">\n            <div class=\"row\">\n              <div class=\"col-md-4\">\n                <c8y-form-group>\n                  <label class=\"control-label\">\n                    {{ 'Name' | translate }}\n                  </label>\n                  <div class=\"input-group input-group-editable\">\n                    <input\n                      class=\"form-control\"\n                      [ngStyle]=\"{ 'width.ch': (firmware$ | async)?.name?.length + 2 || 36 }\"\n                      placeholder=\"{{ 'e.g. My firmware' | translate }}\"\n                      type=\"text\"\n                      required\n                      #nameInput\n                      [ngModel]=\"(firmware$ | async)?.name\"\n                      #nameModel=\"ngModel\"\n                      data-cy=\"firmware-details--name-input\"\n                    />\n                    <span></span>\n                    <div class=\"input-group-btn\">\n                      <button\n                        class=\"btn btn-primary\"\n                        title=\"{{ 'Save' | translate }}\"\n                        type=\"button\"\n                        data-cy=\"firmware-details--name-save-btn\"\n                        (click)=\"updateFirmware$.next({ name: nameInput.value }); nameModel.reset()\"\n                        [disabled]=\"nameInput.value.length == 0\"\n                      >\n                        {{ 'Save' | translate }}\n                      </button>\n                    </div>\n                  </div>\n                </c8y-form-group>\n              </div>\n              <div class=\"col-md-4\">\n                <c8y-form-group>\n                  <label class=\"control-label\">\n                    {{ 'Description' | translate }}\n                  </label>\n                  <div class=\"input-group input-group-editable\">\n                    <input\n                      class=\"form-control\"\n                      [ngStyle]=\"{ 'width.ch': (firmware$ | async)?.description?.length || 36 }\"\n                      placeholder=\"{{ 'e.g. Firmware for hardware revision B' | translate }}\"\n                      type=\"text\"\n                      #descriptionInput\n                      [ngModel]=\"(firmware$ | async)?.description\"\n                      #descriptionModel=\"ngModel\"\n                      data-cy=\"firmware-details--description-input\"\n                    />\n                    <span></span>\n                    <div class=\"input-group-btn\">\n                      <button\n                        class=\"btn btn-primary\"\n                        title=\"{{ 'Save' | translate }}\"\n                        type=\"button\"\n                        data-cy=\"firmware-details--description-save-btn\"\n                        (click)=\"\n                          updateFirmware$.next({ description: descriptionInput.value });\n                          descriptionModel.reset()\n                        \"\n                      >\n                        {{ 'Save' | translate }}\n                      </button>\n                    </div>\n                  </div>\n                </c8y-form-group>\n              </div>\n              <div class=\"col-md-4\">\n                <c8y-form-group>\n                  <label class=\"control-label\">\n                    {{ 'Device type filter' | translate }}\n\n                    <button\n                      class=\"btn-help\"\n                      [attr.aria-label]=\"'Help' | translate\"\n                      popover=\"{{\n                        'If the filter is set, the firmware will show up for installation only for devices of that type. If no filter is set, it will be available for all devices.'\n                          | translate\n                      }}\"\n                      placement=\"right\"\n                      triggers=\"focus\"\n                      container=\"body\"\n                      type=\"button\"\n                    >\n                      <i c8yIcon=\"question-circle-o\"></i>\n                    </button>\n                  </label>\n                  <div class=\"input-group input-group-editable\">\n                    <input\n                      class=\"form-control\"\n                      [ngStyle]=\"{ 'width.ch': (firmware$ | async)?.type?.length || 36 }\"\n                      placeholder=\"{{ 'e.g.' | translate }} c8y_Linux\"\n                      type=\"text\"\n                      #deviceTypeInput\n                      [ngModel]=\"(firmware$ | async)?.c8y_Filter?.type\"\n                      #deviceTypeModel=\"ngModel\"\n                      data-cy=\"firmware-details--device-type-filter-input\"\n                    />\n                    <span></span>\n                    <div class=\"input-group-btn\">\n                      <button\n                        class=\"btn btn-primary\"\n                        title=\"{{ 'Save' | translate }}\"\n                        type=\"button\"\n                        data-cy=\"firmware-details--device-type-filter-save-btn\"\n                        (click)=\"\n                          updateFirmware$.next({ c8y_Filter: { type: deviceTypeInput.value } });\n                          deviceTypeModel.reset()\n                        \"\n                      >\n                        {{ 'Save' | translate }}\n                      </button>\n                    </div>\n                  </div>\n                </c8y-form-group>\n              </div>\n            </div>\n          </div>\n        </div>\n      </div>\n      <div class=\"inner-scroll\">\n        <div class=\"card-header separator-top-bottom bg-component sticky-top\">\n          <div\n            class=\"card-title\"\n            translate\n          >\n            Versions and patches\n          </div>\n        </div>\n\n        <div class=\"card-block p-t-0 p-b-24\">\n          <div *ngIf=\"(baseVersions$ | async)?.data.length === 0\">\n            <c8y-ui-empty-state\n              [icon]=\"'c8y-firmware'\"\n              [title]=\"'No versions to display.' | translate\"\n              [subtitle]=\"'Add a new version by clicking below.' | translate\"\n              [horizontal]=\"true\"\n            >\n              <button\n                class=\"btn btn-sm btn-default m-t-8\"\n                title=\"{{ 'Add firmware' | translate }}\"\n                type=\"button\"\n                (click)=\"addBaseVersion()\"\n              >\n                <i c8yIcon=\"plus-circle\"></i>\n                {{ 'Add firmware' | translate }}\n              </button>\n            </c8y-ui-empty-state>\n          </div>\n\n          <c8y-list-group *ngIf=\"(baseVersions$ | async)?.data.length > 0\">\n            <c8y-li\n              *c8yFor=\"let baseVersion of baseVersions$ | async; let i = index; loadMore: 'auto'\"\n              [emptyActions]=\"!(getPatchVersions$(baseVersion) | async)?.data.length\"\n              [collapsed]=\"!expanded[baseVersion.id]\"\n              (collapsedChange)=\"expanded[baseVersion.id] = !$event\"\n            >\n              <c8y-li-icon>\n                <i c8yIcon=\"c8y-firmware\"></i>\n              </c8y-li-icon>\n\n              <c8y-li-body class=\"content-flex-50\">\n                <div class=\"col-4\">\n                  <p\n                    class=\"text-truncate\"\n                    title=\"{{ baseVersion.c8y_Firmware.version }}\"\n                  >\n                    {{ baseVersion.c8y_Firmware.version }}\n                  </p>\n                </div>\n                <div class=\"col-5\">\n                  <p class=\"text-truncate\">\n                    <span\n                      class=\"text-label-small m-r-8\"\n                      translate\n                    >\n                      File\n                    </span>\n                    <ng-container\n                      *ngIf=\"baseVersion.c8y_Firmware.url === '$PROVIDED'; else fileDownload\"\n                    >\n                      <span title=\"{{ 'Provided by device' | translate }}\">\n                        {{ 'Provided by device' | translate }}\n                      </span>\n                    </ng-container>\n                    <ng-template #fileDownload>\n                      <span title=\"{{ getBinaryName$(baseVersion.c8y_Firmware.url) | async }}\">\n                        <c8y-file-download\n                          url=\"{{ baseVersion.c8y_Firmware.url }}\"\n                        ></c8y-file-download>\n                      </span>\n                    </ng-template>\n                  </p>\n                </div>\n                <div class=\"col-2 d-flex a-i-start\">\n                  <span\n                    class=\"label label-warning m-l-auto-sm\"\n                    *ngIf=\"isLegacy$ | async\"\n                  >\n                    {{ 'Legacy' | translate }}\n                  </span>\n\n                  <span *ngIf=\"!(isLegacy$ | async)\">\n                    <span *ngIf=\"(getPatchVersionsCount$(baseVersion) | async) === null\">\n                      <span class=\"label label-info\">\n                        <i\n                          class=\"icon-spin\"\n                          c8yIcon=\"circle-o-notch\"\n                        ></i>\n                      </span>\n                    </span>\n                    <span *ngIf=\"(getPatchVersionsCount$(baseVersion) | async) !== null\">\n                      <span [ngPlural]=\"getPatchVersionsCount$(baseVersion) | async\">\n                        <ng-template ngPluralCase=\"=0\">\n                          <span class=\"label label-default m-l-auto-sm\">\n                            <span translate>No patches</span>\n                          </span>\n                        </ng-template>\n                        <ng-template ngPluralCase=\"=1\">\n                          <span class=\"label label-info\">\n                            <span translate>1 patch</span>\n                          </span>\n                        </ng-template>\n                        <ng-template ngPluralCase=\"other\">\n                          <span class=\"label label-info\">\n                            <span\n                              ngNonBindable\n                              translate\n                              [translateParams]=\"{\n                                count: getPatchVersionsCount$(baseVersion) | async\n                              }\"\n                            >\n                              {{ count }} patches\n                            </span>\n                          </span>\n                        </ng-template>\n                      </span>\n                    </span>\n                  </span>\n                </div>\n                <div\n                  class=\"fit-h-20 visible-xs\"\n                  *ngIf=\"!(isLegacy$ | async)\"\n                >\n                  <button\n                    class=\"btn btn-default btn-sm m-t-8\"\n                    title=\"{{ 'Delete' | translate }}\"\n                    type=\"button\"\n                    (click)=\"deleteBaseVersion(baseVersion)\"\n                  >\n                    <i c8yIcon=\"delete\"></i>\n                    {{ 'Delete' | translate }}\n                  </button>\n                </div>\n                <div\n                  class=\"m-l-auto fit-h-20 p-r-8 hidden-xs\"\n                  *ngIf=\"!(isLegacy$ | async)\"\n                >\n                  <button\n                    class=\"btn btn-dot btn-dot--danger showOnHover\"\n                    [attr.aria-label]=\"'Delete' | translate\"\n                    tooltip=\"{{ 'Delete' | translate }}\"\n                    type=\"button\"\n                    data-cy=\"firmware-details--delete-base-version\"\n                    [delay]=\"500\"\n                    (click)=\"deleteBaseVersion(baseVersion)\"\n                  >\n                    <i c8yIcon=\"delete\"></i>\n                  </button>\n                </div>\n              </c8y-li-body>\n              <c8y-li-collapse *ngIf=\"(getPatchVersions$(baseVersion) | async)?.data.length\">\n                <c8y-list-group class=\"separator-top\">\n                  <c8y-li\n                    *c8yFor=\"\n                      let patchVersion of getPatchVersions$(baseVersion) | async;\n                      let i = index;\n                      loadMore: 'auto'\n                    \"\n                  >\n                    <c8y-li-icon>\n                      <i c8yIcon=\"c8y-firmware\"></i>\n                    </c8y-li-icon>\n                    <c8y-li-body class=\"content-flex-50\">\n                      <div class=\"col-4\">\n                        {{ patchVersion.c8y_Firmware.version }}\n                      </div>\n                      <div class=\"col-5\">\n                        <div class=\"text-truncate\">\n                          <span\n                            class=\"text-label-small m-r-8\"\n                            translate\n                          >\n                            File\n                          </span>\n                          <ng-container\n                            *ngIf=\"\n                              patchVersion?.c8y_Firmware?.url === '$PROVIDED';\n                              else fileDownload\n                            \"\n                          >\n                            <span title=\"{{ 'Provided by device' | translate }}\">\n                              {{ 'Provided by device' | translate }}\n                            </span>\n                          </ng-container>\n\n                          <ng-template #fileDownload>\n                            <span title=\"patchVersion.c8y_Firmware.url\">\n                              <c8y-file-download\n                                [url]=\"patchVersion.c8y_Firmware.url\"\n                              ></c8y-file-download>\n                            </span>\n                          </ng-template>\n                        </div>\n                      </div>\n                      <div class=\"visible-xs m-t-8\">\n                        <button\n                          class=\"btn btn-danger btn-xs\"\n                          title=\"{{ 'Delete' | translate }}\"\n                          type=\"button\"\n                          data-cy=\"firmware-details--delete-patch-version\"\n                          (click)=\"deletePatchVersion(patchVersion)\"\n                        >\n                          <i c8yIcon=\"delete\"></i>\n                          {{ 'Delete' | translate }}\n                        </button>\n                      </div>\n                      <div class=\"m-l-auto p-r-8 hidden-xs fit-h-20\">\n                        <button\n                          class=\"btn btn-dot text-danger showOnHover\"\n                          [attr.aria-label]=\"'Delete' | translate\"\n                          tooltip=\"{{ 'Delete' | translate }}\"\n                          placement=\"right\"\n                          type=\"button\"\n                          [delay]=\"500\"\n                          (click)=\"deletePatchVersion(patchVersion)\"\n                        >\n                          <i\n                            c8yIcon=\"delete\"\n                            data-cy=\"firmware-details--Remove-icon\"\n                          ></i>\n                        </button>\n                      </div>\n                    </c8y-li-body>\n                  </c8y-li>\n                </c8y-list-group>\n              </c8y-li-collapse>\n            </c8y-li>\n          </c8y-list-group>\n        </div>\n      </div>\n    </div>\n  </div>\n</div>\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: "directive", type: NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: IconDirective, selector: "[c8yIcon]", inputs: ["c8yIcon"] }, { kind: "directive", type: NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "component", type: FormGroupComponent, selector: "c8y-form-group", inputs: ["hasError", "hasWarning", "hasSuccess", "novalidation", "status"] }, { kind: "directive", type: RequiredInputPlaceholderDirective, selector: "input[required], input[formControlName]" }, { kind: "ngmodule", type: FormsModule }, { kind: "directive", type: i4$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: i4$1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i4$1.RequiredValidator, selector: ":not([type=checkbox])[required][formControlName],:not([type=checkbox])[required][formControl],:not([type=checkbox])[required][ngModel]", inputs: ["required"] }, { kind: "directive", type: i4$1.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "directive", type: NgStyle, selector: "[ngStyle]", inputs: ["ngStyle"] }, { 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: C8yTranslateDirective, selector: "[translate],[ngx-translate]" }, { kind: "component", type: EmptyStateComponent, selector: "c8y-ui-empty-state", inputs: ["icon", "title", "subtitle", "horizontal"] }, { kind: "component", type: ListGroupComponent, selector: "c8y-list-group" }, { kind: "directive", type: ForOfDirective, selector: "[c8yFor]", inputs: ["c8yForOf", "c8yForLoadMore", "c8yForPipe", "c8yForNotFound", "c8yForMaxIterations", "c8yForLoadingTemplate", "c8yForLoadNextLabel", "c8yForLoadingLabel", "c8yForRealtime", "c8yForRealtimeOptions", "c8yForComparator", "c8yForEnableVirtualScroll", "c8yForVirtualScrollElementSize", "c8yForVirtualScrollStrategy", "c8yForVirtualScrollContainerHeight"], outputs: ["c8yForCount", "c8yForChange", "c8yForLoadMoreComponent"] }, { kind: "component", type: ListItemComponent, selector: "c8y-list-item, c8y-li", inputs: ["active", "highlighted", "emptyActions", "dense", "collapsed", "selectable"], outputs: ["collapsedChange"] }, { kind: "component", type: ListItemIconComponent, selector: "c8y-list-item-icon, c8y-li-icon", inputs: ["icon", "status"] }, { kind: "component", type: ListItemBodyComponent, selector: "c8y-list-item-body, c8y-li-body", inputs: ["body"] }, { kind: "component", type: FileDownloadComponent, selector: "c8y-file-download", inputs: ["url"] }, { kind: "directive", type: NgPlural, selector: "[ngPlural]", inputs: ["ngPlural"] }, { kind: "directive", type: NgPluralCase, selector: "[ngPluralCase]" }, { kind: "directive", type: TooltipDirective, selector: "[tooltip], [tooltipHtml]", inputs: ["adaptivePosition", "tooltip", "placement", "triggers", "container", "containerClass", "boundariesElement", "isOpen", "isDisabled", "delay", "tooltipHtml", "tooltipPlacement", "tooltipIsOpen", "tooltipEnable", "tooltipAppendToBody", "tooltipAnimation", "tooltipClass", "tooltipContext", "tooltipPopupDelay", "tooltipFadeDuration", "tooltipTrigger"], outputs: ["tooltipChange", "onShown", "onHidden", "tooltipStateChanged"], exportAs: ["bs-tooltip"] }, { kind: "component", type: ListItemCollapseComponent, selector: "c8y-list-item-collapse, c8y-li-collapse", inputs: ["collapseWay"] }, { kind: "pipe", type: AsyncPipe, name: "async" }, { kind: "pipe", type: C8yTranslatePipe, name: "translate" }] }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.3.16", type: FirmwareDetailsComponent, isStandalone: true, selector: "c8y-firmware-details", ngImport: i0, template: "<c8y-title>\n  {{ (firmware$ | async)?.name }}\n</c8y-title>\n\n<c8y-breadcrumb>\n  <c8y-breadcrumb-item\n    icon=\"c8y-management\"\n    label=\"{{ 'Management' | translate }}\"\n  ></c8y-breadcrumb-item>\n  <c8y-breadcrumb-item\n    icon=\"c8y-firmware\"\n    path=\"#/firmware\"\n    label=\"{{ 'Firmware repository' | translate }}\"\n  ></c8y-breadcrumb-item>\n  <c8y-breadcrumb-item\n    icon=\"c8y-firmware\"\n    label=\"{{ (firmware$ | async)?.name }}\"\n  ></c8y-breadcrumb-item>\n</c8y-breadcrumb>\n\n<c8y-action-bar-item [placement]=\"'right'\">\n  @if (!(isLegacy$ | async)) {\n    <button\n      class=\"btn btn-link\"\n      title=\"{{ 'Add firmware' | translate }}\"\n      type=\"button\"\n      data-cy=\"firmware-details--add-firmware-btn\"\n      (click)=\"addBaseVersion()\"\n    >\n      <i c8yIcon=\"plus-circle\"></i>\n      {{ 'Add firmware' | translate }}\n    </button>\n  }\n</c8y-action-bar-item>\n\n<c8y-action-bar-item [placement]=\"'right'\">\n  @if (canAddPatchVersions$ | async) {\n    <button\n      class=\"btn btn-link\"\n      title=\"{{ 'Add firmware patch' | translate }}\"\n      type=\"button\"\n      data-cy=\"firmware-details--add-firmware-patch-btn\"\n      (click)=\"addPatchVersion()\"\n    >\n      <i c8yIcon=\"plus-circle\"></i>\n      {{ 'Add firmware patch' | translate }}\n    </button>\n  }\n</c8y-action-bar-item>\n\n<c8y-action-bar-item [placement]=\"'right'\">\n  <button\n    class=\"btn btn-link\"\n    title=\"{{ 'Reload' | translate }}\"\n    type=\"button\"\n    (click)=\"reload$.next()\"\n  >\n    <i\n      c8yIcon=\"refresh\"\n      [ngClass]=\"{ 'icon-spin': reloading$ | async }\"\n    ></i>\n    {{ 'Reload' | translate }}\n  </button>\n</c8y-action-bar-item>\n\n<div class=\"row\">\n  <div class=\"col-lg-12 col-lg-max\">\n    <div class=\"card card--fullpage\">\n      <div class=\"card-block bg-level-1 flex-no-shrink p-t-24 p-b-24\">\n        <div class=\"content-flex-70\">\n          <div class=\"text-center\">\n            <i class=\"c8y-icon-duocolor icon-48 c8y-icon c8y-icon-firmware\"></i>\n            <p>\n              <small class=\"label label-info\">Firmware</small>\n            </p>\n          </div>\n          <div class=\"flex-grow col-10\">\n            <div class=\"row\">\n              <div class=\"col-md-4\">\n                <c8y-form-group>\n                  <label class=\"control-label\">\n                    {{ 'Name' | translate }}\n                  </label>\n                  <div class=\"input-group input-group-editable\">\n                    <input\n                      class=\"form-control\"\n                      [ngStyle]=\"{ 'width.ch': (firmware$ | async)?.name?.length + 2 || 36 }\"\n                      placeholder=\"{{ 'e.g. My firmware' | translate }}\"\n                      type=\"text\"\n                      required\n                      #nameInput\n                      [ngModel]=\"(firmware$ | async)?.name\"\n                      #nameModel=\"ngModel\"\n                      data-cy=\"firmware-details--name-input\"\n                    />\n                    <span></span>\n                    <div class=\"input-group-btn\">\n                      <button\n                        class=\"btn btn-primary\"\n                        title=\"{{ 'Save' | translate }}\"\n                        type=\"button\"\n                        data-cy=\"firmware-details--name-save-btn\"\n                        (click)=\"updateFirmware$.next({ name: nameInput.value }); nameModel.reset()\"\n                        [disabled]=\"nameInput.value.length == 0\"\n                      >\n                        {{ 'Save' | translate }}\n                      </button>\n                    </div>\n                  </div>\n                </c8y-form-group>\n              </div>\n              <div class=\"col-md-4\">\n                <c8y-form-group>\n                  <label class=\"control-label\">\n                    {{ 'Description' | translate }}\n                  </label>\n                  <div class=\"input-group input-group-editable\">\n                    <input\n                      class=\"form-control\"\n                      [ngStyle]=\"{ 'width.ch': (firmware$ | async)?.description?.length || 36 }\"\n                      placeholder=\"{{ 'e.g. Firmware for hardware revision B' | translate }}\"\n                      type=\"text\"\n                      #descriptionInput\n                      [ngModel]=\"(firmware$ | async)?.description\"\n                      #descriptionModel=\"ngModel\"\n                      data-cy=\"firmware-details--description-input\"\n                    />\n                    <span></span>\n                    <div class=\"input-group-btn\">\n                      <button\n                        class=\"btn btn-primary\"\n                        title=\"{{ 'Save' | translate }}\"\n                        type=\"button\"\n                        data-cy=\"firmware-details--description-save-btn\"\n                        (click)=\"\n                          updateFirmware$.next({ description: descriptionInput.value });\n                          descriptionModel.reset()\n                        \"\n                      >\n                        {{ 'Save' | translate }}\n                      </button>\n                    </div>\n                  </div>\n                </c8y-form-group>\n              </div>\n              <div class=\"col-md-4\">\n                <c8y-form-group>\n                  <label class=\"control-label\">\n                    {{ 'Device type filter' | translate }}\n\n                    <button\n                      class=\"btn-help\"\n                      [attr.aria-label]=\"'Help' | translate\"\n                      popover=\"{{\n                        'If the filter is set, the firmware will show up for installation only for devices of that type. If no filter is set, it will be available for all devices.'\n                          | translate\n                      }}\"\n                      placement=\"right\"\n                      triggers=\"focus\"\n                      container=\"body\"\n                      type=\"button\"\n                    >\n                      <i c8yIcon=\"question-circle-o\"></i>\n                    </button>\n                  </label>\n                  <div class=\"input-group input-group-editable\">\n                    <input\n                      class=\"form-control\"\n                      [ngStyle]=\"{ 'width.ch': (firmware$ | async)?.type?.length || 36 }\"\n                      placeholder=\"{{ 'e.g.' | translate }} c8y_Linux\"\n                      type=\"text\"\n                      #deviceTypeInput\n                      [ngModel]=\"(firmware$ | async)?.c8y_Filter?.type\"\n                      #deviceTypeModel=\"ngModel\"\n                      data-cy=\"firmware-details--device-type-filter-input\"\n                    />\n                    <span></span>\n                    <div class=\"input-group-btn\">\n                      <button\n                        class=\"btn btn-primary\"\n                        title=\"{{ 'Save' | translate }}\"\n                        type=\"button\"\n                        data-cy=\"firmware-details--device-type-filter-save-btn\"\n                        (click)=\"\n                          updateFirmware$.next({ c8y_Filter: { type: deviceTypeInput.value } });\n                          deviceTypeModel.reset()\n                        \"\n                      >\n                        {{ 'Save' | translate }}\n                      </button>\n                    </div>\n                  </div>\n                </c8y-form-group>\n              </div>\n            </div>\n          </div>\n        </div>\n      </div>\n      <div class=\"inner-scroll\">\n        <div class=\"card-header separator-top-bottom bg-component sticky-top\">\n          <div\n            class=\"card-title\"\n            translate\n          >\n            Versions and patches\n          </div>\n        </div>\n\n        <div class=\"card-block p-t-0 p-b-24\">\n          @if ((baseVersions$ | async)?.data.length === 0) {\n            <div>\n              <c8y-ui-empty-state\n                [icon]=\"'c8y-firmware'\"\n                [title]=\"'No versions to display.' | translate\"\n                [subtitle]=\"'Add a new version by clicking below.' | translate\"\n                [horizontal]=\"true\"\n              >\n                <button\n                  class=\"btn btn-sm btn-default m-t-8\"\n                  title=\"{{ 'Add firmware' | translate }}\"\n                  type=\"button\"\n                  (click)=\"addBaseVersion()\"\n                >\n                  <i c8yIcon=\"plus-circle\"></i>\n                  {{ 'Add firmware' | translate }}\n                </button>\n              </c8y-ui-empty-state>\n            </div>\n          }\n\n          @if ((baseVersions$ | async)?.data.length > 0) {\n            <c8y-list-group>\n              <c8y-li\n                *c8yFor=\"let baseVersion of baseVersions$ | async; let i = index; loadMore: 'auto'\"\n                [emptyActions]=\"!(getPatchVersions$(baseVersion) | async)?.data.length\"\n                [collapsed]=\"!expanded[baseVersion.id]\"\n                (collapsedChange)=\"expanded[baseVersion.id] = !$event\"\n              >\n                <c8y-li-icon>\n                  <i c8yIcon=\"c8y-firmware\"></i>\n                </c8y-li-icon>\n                <c8y-li-body class=\"content-flex-50\">\n                  <div class=\"col-4\">\n                    <p\n                      class=\"text-truncate\"\n                      title=\"{{ baseVersion.c8y_Firmware.version }}\"\n                    >\n                      {{ baseVersion.c8y_Firmware.version }}\n                    </p>\n                  </div>\n                  <div class=\"col-5\">\n                    <p class=\"text-truncate\">\n                      <span\n                        class=\"text-label-small m-r-8\"\n                        translate\n                      >\n                        File\n                      </span>\n                      @if (baseVersion.c8y_Firmware.url === '') {\n                        <span title=\"{{ 'Provided by device' | translate }}\">\n                          {{ 'Provided by device' | translate }}\n                        </span>\n                      } @else {\n                        <span title=\"{{ getBinaryName$(baseVersion.c8y_Firmware.url) | async }}\">\n                          <c8y-file-download\n                            url=\"{{ baseVersion.c8y_Firmware.url }}\"\n                          ></c8y-file-download>\n                        </span>\n                      }\n                    </p>\n                  </div>\n                  <div class=\"col-2 d-flex a-i-start\">\n                    @if (isLegacy$ | async) {\n                      <span class=\"label label-warning m-l-auto-sm\">\n                        {{ 'Legacy' | translate }}\n                      </span>\n                    }\n                    @if (!(isLegacy$ | async)) {\n                      <span>\n                        @if ((getPatchVersionsCount$(baseVersion) | async) === null) {\n                          <span>\n                            <span class=\"label label-info\">\n                              <i\n                                class=\"icon-spin\"\n                                c8yIcon=\"circle-o-notch\"\n                              ></i>\n                            </span>\n                          </span>\n                        }\n                        @if ((getPatchVersionsCount$(baseVersion) | async) !== null) {\n                          <span>\n                            <span [ngPlural]=\"getPatchVersionsCount$(baseVersion) | async\">\n                              <ng-template ngPluralCase=\"=0\">\n                                <span class=\"label label-default m-l-auto-sm\">\n                                  <span translate>No patches</span>\n                                </span>\n                              </ng-template>\n                              <ng-template ngPluralCase=\"=1\">\n                                <span class=\"label label-info\">\n                                  <span translate>1 patch</span>\n                                </span>\n                              </ng-template>\n                              <ng-template ngPluralCase=\"other\">\n                                <span class=\"label label-info\">\n                                  <span\n                                    ngNonBindable\n                                    translate\n                                    [translateParams]=\"{\n                                      count: getPatchVersionsCount$(baseVersion) | async\n                                    }\"\n                                  >\n                                    {{ count }} patches\n                                  </span>\n                                </span>\n                              </ng-template>\n                            </span>\n                          </span>\n                        }\n                      </span>\n                    }\n                  </div>\n                  @if (!(isLegacy$ | async)) {\n                    <div class=\"fit-h-20 visible-xs\">\n                      <button\n                        class=\"btn btn-default btn-sm m-t-8\"\n                        title=\"{{ 'Delete' | translate }}\"\n                        type=\"button\"\n                        (click)=\"deleteBaseVersion(baseVersion)\"\n                      >\n                        <i c8yIcon=\"delete\"></i>\n                        {{ 'Delete' | translate }}\n                      </button>\n                    </div>\n                  }\n                  @if (!(isLegacy$ | async)) {\n                    <div class=\"m-l-auto fit-h-20 p-r-8 hidden-xs\">\n                      <button\n                        class=\"btn btn-dot btn-dot--danger showOnHover\"\n                        [attr.aria-label]=\"'Delete' | translate\"\n                        tooltip=\"{{ 'Delete' | translate }}\"\n                        type=\"button\"\n                        data-cy=\"firmware-details--delete-base-version\"\n                        [delay]=\"500\"\n                        (click)=\"deleteBaseVersion(baseVersion)\"\n                      >\n                        <i c8yIcon=\"delete\"></i>\n                      </button>\n                    </div>\n                  }\n                </c8y-li-body>\n                @if ((getPatchVersions$(baseVersion) | async)?.data.length) {\n                  <c8y-li-collapse>\n                    <c8y-list-group class=\"separator-top\">\n                      <c8y-li\n                        *c8yFor=\"\n                          let patchVersion of getPatchVersions$(baseVersion) | async;\n                          let i = index;\n                          loadMore: 'auto'\n                        \"\n                      >\n                        <c8y-li-icon>\n                          <i c8yIcon=\"c8y-firmware\"></i>\n                        </c8y-li-icon>\n                        <c8y-li-body class=\"content-flex-50\">\n                          <div class=\"col-4\">\n                            {{ patchVersion.c8y_Firmware.version }}\n                          </div>\n                          <div class=\"col-5\">\n                            <div class=\"text-truncate\">\n                              <span\n                                class=\"text-label-small m-r-8\"\n                                translate\n                              >\n                                File\n                              </span>\n                              @if (patchVersion?.c8y_Firmware?.url === '') {\n                                <span title=\"{{ 'Provided by device' | translate }}\">\n                                  {{ 'Provided by device' | translate }}\n                                </span>\n                              } @else {\n                                <span title=\"patchVersion.c8y_Firmware.url\">\n                                  <c8y-file-download\n                                    [url]=\"patchVersion.c8y_Firmware.url\"\n                                  ></c8y-file-download>\n                                </span>\n                              }\n                            </div>\n                          </div>\n                          <div class=\"visible-xs m-t-8\">\n                            <button\n                              class=\"btn btn-danger btn-xs\"\n                              title=\"{{ 'Delete' | translate }}\"\n                              type=\"button\"\n                              data-cy=\"firmware-details--delete-patch-version\"\n                              (click)=\"deletePatchVersion(patchVersion)\"\n                            >\n                              <i c8yIcon=\"delete\"></i>\n                              {{ 'Delete' | translate }}\n                            </button>\n                          </div>\n                          <div class=\"m-l-auto p-r-8 hidden-xs fit-h-20\">\n                            <button\n                              class=\"btn btn-dot text-danger showOnHover\"\n                              [attr.aria-label]=\"'Delete' | translate\"\n                              tooltip=\"{{ 'Delete' | translate }}\"\n                              placement=\"right\"\n                              type=\"button\"\n                              [delay]=\"500\"\n                              (click)=\"deletePatchVersion(patchVersion)\"\n                            >\n                              <i\n                                c8yIcon=\"delete\"\n                                data-cy=\"firmware-details--Remove-icon\"\n                              ></i>\n                            </button>\n                          </div>\n                        </c8y-li-body>\n                      </c8y-li>\n                    </c8y-list-group>\n                  </c8y-li-collapse>\n                }\n              </c8y-li>\n            </c8y-list-group>\n          }\n        </div>\n      </div>\n    </div>\n  </div>\n</div>\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: "directive", type: IconDirective, selector: "[c8yIcon]", inputs: ["c8yIcon"] }, { kind: "directive", type: NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "component", type: FormGroupComponent, selector: "c8y-form-group", inputs: ["hasError", "hasWarning", "hasSuccess", "novalidation", "status"] }, { kind: "directive", type: RequiredInputPlaceholderDirective, selector: "input[required], input[formControlName]" }, { kind: "ngmodule", type: FormsModule }, { kind: "directive", type: i4$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: i4$1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i4$1.RequiredValidator, selector: ":not([type=checkbox])[required][formControlName],:not([type=checkbox])[required][formControl],:not([type=checkbox])[required][ngModel]", inputs: ["required"] }, { kind: "directive", type: i4$1.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "directive", type: NgStyle, selector: "[ngStyle]", inputs: ["ngStyle"] }, { 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: C8yTranslateDirective, selector: "[translate],[ngx-translate]" }, { kind: "component", type: EmptyStateComponent, selector: "c8y-ui-empty-state", inputs: ["icon", "title", "subtitle", "horizontal"] }, { kind: "component", type: ListGroupComponent, selector: "c8y-list-group" }, { kind: "directive", type: ForOfDirective, selector: "[c8yFor]", inputs: ["c8yForOf", "c8yForLoadMore", "c8yForPipe", "c8yForNotFound", "c8yForMaxIterations", "c8yForLoadingTemplate", "c8yForLoadNextLabel", "c8yForLoadingLabel", "c8yForRealtime", "c8yForRealtimeOptions", "c8yForComparator", "c8yForEnableVirtualScroll", "c8yForVirtualScrollElementSize", "c8yForVirtualScrollStrategy", "c8yForVirtualScrollContainerHeight"], outputs: ["c8yForCount", "c8yForChange", "c8yForLoadMoreComponent"] }, { kind: "component", type: ListItemComponent, selector: "c8y-list-item, c8y-li", inputs: ["active", "highlighted", "emptyActions", "dense", "collapsed", "selectable"], outputs: ["collapsedChange"] }, { kind: "component", type: ListItemIconComponent, selector: "c8y-list-item-icon, c8y-li-icon", inputs: ["icon", "status"] }, { kind: "component", type: ListItemBodyComponent, selector: "c8y-list-item-body, c8y-li-body", inputs: ["body"] }, { kind: "component", type: FileDownloadComponent, selector: "c8y-file-download", inputs: ["url"] }, { kind: "directive", type: NgPlural, selector: "[ngPlural]", inputs: ["ngPlural"] }, { kind: "directive", type: NgPluralCase, selector: "[ngPluralCase]" }, { kind: "directive", type: TooltipDirective, selector: "[tooltip], [tooltipHtml]", inputs: ["adaptivePosition", "tooltip", "placement", "triggers", "container", "containerClass", "boundariesElement", "isOpen", "isDisabled", "delay", "tooltipHtml", "tooltipPlacement", "tooltipIsOpen", "tooltipEnable", "tooltipAppendToBody", "tooltipAnimation", "tooltipClass", "tooltipContext", "tooltipPopupDelay", "tooltipFadeDuration", "tooltipTrigger"], outputs: ["tooltipChange", "onShown", "onHidden", "tooltipStateChanged"], exportAs: ["bs-tooltip"] }, { kind: "component", type: ListItemCollapseComponent, selector: "c8y-list-item-collapse, c8y-li-collapse", inputs: ["collapseWay"] }, { kind: "pipe", type: AsyncPipe, name: "async" }, { kind: "pipe", type: C8yTranslatePipe, name: "translate" }] }); }
 }
 __decorate([
     memoize(property('id')),
@@ -685,7 +684,6 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.16", ngImpo
                         BreadcrumbComponent,
                         BreadcrumbItemComponent,
                         ActionBarItemComponent,
-                        NgIf,
                         IconDirective,
                         NgClass,
                         FormGroupComponent,
@@ -707,7 +705,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.16", ngImpo
                         ListItemCollapseComponent,
                         AsyncPipe,
                         C8yTranslatePipe
-                    ], template: "<c8y-title>\n  {{ (firmware$ | async)?.name }}\n</c8y-title>\n\n<c8y-breadcrumb>\n  <c8y-breadcrumb-item\n    icon=\"c8y-management\"\n    label=\"{{ 'Management' | translate }}\"\n  ></c8y-breadcrumb-item>\n  <c8y-breadcrumb-item\n    icon=\"c8y-firmware\"\n    path=\"#/firmware\"\n    label=\"{{ 'Firmware repository' | translate }}\"\n  ></c8y-breadcrumb-item>\n  <c8y-breadcrumb-item\n    icon=\"c8y-firmware\"\n    label=\"{{ (firmware$ | async)?.name }}\"\n  ></c8y-breadcrumb-item>\n</c8y-breadcrumb>\n\n<c8y-action-bar-item [placement]=\"'right'\">\n  <button\n    class=\"btn btn-link\"\n    title=\"{{ 'Add firmware' | translate }}\"\n    type=\"button\"\n    *ngIf=\"!(isLegacy$ | async)\"\n    data-cy=\"firmware-details--add-firmware-btn\"\n    (click)=\"addBaseVersion()\"\n  >\n    <i c8yIcon=\"plus-circle\"></i>\n    {{ 'Add firmware' | translate }}\n  </button>\n</c8y-action-bar-item>\n\n<c8y-action-bar-item [placement]=\"'right'\">\n  <button\n    class=\"btn btn-link\"\n    title=\"{{ 'Add firmware patch' | translate }}\"\n    type=\"button\"\n    *ngIf=\"canAddPatchVersions$ | async\"\n    data-cy=\"firmware-details--add-firmware-patch-btn\"\n    (click)=\"addPatchVersion()\"\n  >\n    <i c8yIcon=\"plus-circle\"></i>\n    {{ 'Add firmware patch' | translate }}\n  </button>\n</c8y-action-bar-item>\n\n<c8y-action-bar-item [placement]=\"'right'\">\n  <button\n    class=\"btn btn-link\"\n    title=\"{{ 'Reload' | translate }}\"\n    type=\"button\"\n    (click)=\"reload$.next()\"\n  >\n    <i\n      c8yIcon=\"refresh\"\n      [ngClass]=\"{ 'icon-spin': reloading$ | async }\"\n    ></i>\n    {{ 'Reload' | translate }}\n  </button>\n</c8y-action-bar-item>\n\n<div class=\"row\">\n  <div class=\"col-lg-12 col-lg-max\">\n    <div class=\"card card--fullpage\">\n      <div class=\"card-block bg-level-1 flex-no-shrink p-t-24 p-b-24\">\n        <div class=\"content-flex-70\">\n          <div class=\"text-center\">\n            <i class=\"c8y-icon-duocolor icon-48 c8y-icon c8y-icon-firmware\"></i>\n            <p>\n              <small class=\"label label-info\">Firmware</small>\n            </p>\n          </div>\n          <div class=\"flex-grow col-10\">\n            <div class=\"row\">\n              <div class=\"col-md-4\">\n                <c8y-form-group>\n                  <label class=\"control-label\">\n                    {{ 'Name' | translate }}\n                  </label>\n                  <div class=\"input-group input-group-editable\">\n                    <input\n                      class=\"form-control\"\n                      [ngStyle]=\"{ 'width.ch': (firmware$ | async)?.name?.length + 2 || 36 }\"\n                      placeholder=\"{{ 'e.g. My firmware' | translate }}\"\n                      type=\"text\"\n                      required\n                      #nameInput\n                      [ngModel]=\"(firmware$ | async)?.name\"\n                      #nameModel=\"ngModel\"\n                      data-cy=\"firmware-details--name-input\"\n                    />\n                    <span></span>\n                    <div class=\"input-group-btn\">\n                      <button\n                        class=\"btn btn-primary\"\n                        title=\"{{ 'Save' | translate }}\"\n                        type=\"button\"\n                        data-cy=\"firmware-details--name-save-btn\"\n                        (click)=\"updateFirmware$.next({ name: nameInput.value }); nameModel.reset()\"\n                        [disabled]=\"nameInput.value.length == 0\"\n                      >\n                        {{ 'Save' | translate }}\n                      </button>\n                    </div>\n                  </div>\n                </c8y-form-group>\n              </div>\n              <div class=\"col-md-4\">\n                <c8y-form-group>\n                  <label class=\"control-label\">\n                    {{ 'Description' | translate }}\n                  </label>\n                  <div class=\"input-group input-group-editable\">\n                    <input\n                      class=\"form-control\"\n                      [ngStyle]=\"{ 'width.ch': (firmware$ | async)?.description?.length || 36 }\"\n                      placeholder=\"{{ 'e.g. Firmware for hardware revision B' | translate }}\"\n                      type=\"text\"\n                      #descriptionInput\n                      [ngModel]=\"(firmware$ | async)?.description\"\n                      #descriptionModel=\"ngModel\"\n                      data-cy=\"firmware-details--description-input\"\n                    />\n                    <span></span>\n                    <div class=\"input-group-btn\">\n                      <button\n                        class=\"btn btn-primary\"\n                        title=\"{{ 'Save' | translate }}\"\n                        type=\"button\"\n                        data-cy=\"firmware-details--description-save-btn\"\n                        (click)=\"\n                          updateFirmware$.next({ description: descriptionInput.value });\n                          descriptionModel.reset()\n                        \"\n                      >\n                        {{ 'Save' | translate }}\n                      </button>\n                    </div>\n                  </div>\n                </c8y-form-group>\n              </div>\n              <div class=\"col-md-4\">\n                <c8y-form-group>\n                  <label class=\"control-label\">\n                    {{ 'Device type filter' | translate }}\n\n                    <button\n                      class=\"btn-help\"\n                      [attr.aria-label]=\"'Help' | translate\"\n                      popover=\"{{\n                        'If the filter is set, the firmware will show up for installation only for devices of that type. If no filter is set, it will be available for all devices.'\n                          | translate\n                      }}\"\n                      placement=\"right\"\n                      triggers=\"focus\"\n                      container=\"body\"\n                      type=\"button\"\n                    >\n                      <i c8yIcon=\"question-circle-o\"></i>\n                    </button>\n                  </label>\n                  <div class=\"input-group input-group-editable\">\n                    <input\n                      class=\"form-control\"\n                      [ngStyle]=\"{ 'width.ch': (firmware$ | async)?.type?.length || 36 }\"\n                      placeholder=\"{{ 'e.g.' | translate }} c8y_Linux\"\n                      type=\"text\"\n                      #deviceTypeInput\n                      [ngModel]=\"(firmware$ | async)?.c8y_Filter?.type\"\n                      #deviceTypeModel=\"ngModel\"\n                      data-cy=\"firmware-details--device-type-filter-input\"\n                    />\n                    <span></span>\n                    <div class=\"input-group-btn\">\n                      <button\n                        class=\"btn btn-primary\"\n                        title=\"{{ 'Save' | translate }}\"\n                        type=\"button\"\n                        data-cy=\"firmware-details--device-type-filter-save-btn\"\n                        (click)=\"\n                          updateFirmware$.next({ c8y_Filter: { type: deviceTypeInput.value } });\n                          deviceTypeModel.reset()\n                        \"\n                      >\n                        {{ 'Save' | translate }}\n                      </button>\n                    </div>\n                  </div>\n                </c8y-form-group>\n              </div>\n            </div>\n          </div>\n        </div>\n      </div>\n      <div class=\"inner-scroll\">\n        <div class=\"card-header separator-top-bottom bg-component sticky-top\">\n          <div\n            class=\"card-title\"\n            translate\n          >\n            Versions and patches\n          </div>\n        </div>\n\n        <div class=\"card-block p-t-0 p-b-24\">\n          <div *ngIf=\"(baseVersions$ | async)?.data.length === 0\">\n            <c8y-ui-empty-state\n              [icon]=\"'c8y-firmware'\"\n              [title]=\"'No versions to display.' | translate\"\n              [subtitle]=\"'Add a new version by clicking below.' | translate\"\n              [horizontal]=\"true\"\n            >\n              <button\n                class=\"btn btn-sm btn-default m-t-8\"\n                title=\"{{ 'Add firmware' | translate }}\"\n                type=\"button\"\n                (click)=\"addBaseVersion()\"\n              >\n                <i c8yIcon=\"plus-circle\"></i>\n                {{ 'Add firmware' | translate }}\n              </button>\n            </c8y-ui-empty-state>\n          </div>\n\n          <c8y-list-group *ngIf=\"(baseVersions$ | async)?.data.length > 0\">\n            <c8y-li\n              *c8yFor=\"let baseVersion of baseVersions$ | async; let i = index; loadMore: 'auto'\"\n              [emptyActions]=\"!(getPatchVersions$(baseVersion) | async)?.data.length\"\n              [collapsed]=\"!expanded[baseVersion.id]\"\n              (collapsedChange)=\"expanded[baseVersion.id] = !$event\"\n            >\n              <c8y-li-icon>\n                <i c8yIcon=\"c8y-firmware\"></i>\n              </c8y-li-icon>\n\n              <c8y-li-body class=\"content-flex-50\">\n                <div class=\"col-4\">\n                  <p\n                    class=\"text-truncate\"\n                    title=\"{{ baseVersion.c8y_Firmware.version }}\"\n                  >\n                    {{ baseVersion.c8y_Firmware.version }}\n                  </p>\n                </div>\n                <div class=\"col-5\">\n                  <p class=\"text-truncate\">\n                    <span\n                      class=\"text-label-small m-r-8\"\n                      translate\n                    >\n                      File\n                    </span>\n                    <ng-container\n                      *ngIf=\"baseVersion.c8y_Firmware.url === '$PROVIDED'; else fileDownload\"\n                    >\n                      <span title=\"{{ 'Provided by device' | translate }}\">\n                        {{ 'Provided by device' | translate }}\n                      </span>\n                    </ng-container>\n                    <ng-template #fileDownload>\n                      <span title=\"{{ getBinaryName$(baseVersion.c8y_Firmware.url) | async }}\">\n                        <c8y-file-download\n                          url=\"{{ baseVersion.c8y_Firmware.url }}\"\n                        ></c8y-file-download>\n                      </span>\n                    </ng-template>\n                  </p>\n                </div>\n                <div class=\"col-2 d-flex a-i-start\">\n                  <span\n                    class=\"label label-warning m-l-auto-sm\"\n                    *ngIf=\"isLegacy$ | async\"\n                  >\n                    {{ 'Legacy' | translate }}\n                  </span>\n\n                  <span *ngIf=\"!(isLegacy$ | async)\">\n                    <span *ngIf=\"(getPatchVersionsCount$(baseVersion) | async) === null\">\n                      <span class=\"label label-info\">\n                        <i\n                          class=\"icon-spin\"\n                          c8yIcon=\"circle-o-notch\"\n                        ></i>\n                      </span>\n                    </span>\n                    <span *ngIf=\"(getPatchVersionsCount$(baseVersion) | async) !== null\">\n                      <span [ngPlural]=\"getPatchVersionsCount$(baseVersion) | async\">\n                        <ng-template ngPluralCase=\"=0\">\n                          <span class=\"label label-default m-l-auto-sm\">\n                            <span translate>No patches</span>\n                          </span>\n                        </ng-template>\n                        <ng-template ngPluralCase=\"=1\">\n                          <span class=\"label label-info\">\n                            <span translate>1 patch</span>\n                          </span>\n                        </ng-template>\n                        <ng-template ngPluralCase=\"other\">\n                          <span class=\"label label-info\">\n                            <span\n                              ngNonBindable\n                              translate\n                              [translateParams]=\"{\n                                count: getPatchVersionsCount$(baseVersion) | async\n                              }\"\n                            >\n                              {{ count }} patches\n                            </span>\n                          </span>\n                        </ng-template>\n                      </span>\n                    </span>\n                  </span>\n                </div>\n                <div\n                  class=\"fit-h-20 visible-xs\"\n                  *ngIf=\"!(isLegacy$ | async)\"\n                >\n                  <button\n                    class=\"btn btn-default btn-sm m-t-8\"\n                    title=\"{{ 'Delete' | translate }}\"\n                    type=\"button\"\n                    (click)=\"deleteBaseVersion(baseVersion)\"\n                  >\n                    <i c8yIcon=\"delete\"></i>\n                    {{ 'Delete' | translate }}\n                  </button>\n                </div>\n                <div\n                  class=\"m-l-auto fit-h-20 p-r-8 hidden-xs\"\n                  *ngIf=\"!(isLegacy$ | async)\"\n                >\n                  <button\n                    class=\"btn btn-dot btn-dot--danger showOnHover\"\n                    [attr.aria-label]=\"'Delete' | translate\"\n                    tooltip=\"{{ 'Delete' | translate }}\"\n                    type=\"button\"\n                    data-cy=\"firmware-details--delete-base-version\"\n                    [delay]=\"500\"\n                    (click)=\"deleteBaseVersion(baseVersion)\"\n                  >\n                    <i c8yIcon=\"delete\"></i>\n                  </button>\n                </div>\n              </c8y-li-body>\n              <c8y-li-collapse *ngIf=\"(getPatchVersions$(baseVersion) | async)?.data.length\">\n                <c8y-list-group class=\"separator-top\">\n                  <c8y-li\n                    *c8yFor=\"\n                      let patchVersion of getPatchVersions$(baseVersion) | async;\n                      let i = index;\n                      loadMore: 'auto'\n                    \"\n                  >\n                    <c8y-li-icon>\n                      <i c8yIcon=\"c8y-firmware\"></i>\n                    </c8y-li-icon>\n                    <c8y-li-body class=\"content-flex-50\">\n                      <div class=\"col-4\">\n                        {{ patchVersion.c8y_Firmware.version }}\n                      </div>\n                      <div class=\"col-5\">\n                        <div class=\"text-truncate\">\n                          <span\n                            class=\"text-label-small m-r-8\"\n                            translate\n                          >\n                            File\n                          </span>\n                          <ng-container\n                            *ngIf=\"\n                              patchVersion?.c8y_Firmware?.url === '$PROVIDED';\n                              else fileDownload\n                            \"\n                          >\n                            <span title=\"{{ 'Provided by device' | translate }}\">\n                              {{ 'Provided by device' | translate }}\n                            </span>\n                          </ng-container>\n\n                          <ng-template #fileDownload>\n                            <span title=\"patchVersion.c8y_Firmware.url\">\n                              <c8y-file-download\n                                [url]=\"patchVersion.c8y_Firmware.url\"\n                              ></c8y-file-download>\n                            </span>\n                          </ng-template>\n                        </div>\n                      </div>\n                      <div class=\"visible-xs m-t-8\">\n                        <button\n                          class=\"btn btn-danger btn-xs\"\n                          title=\"{{ 'Delete' | translate }}\"\n                          type=\"button\"\n                          data-cy=\"firmware-details--delete-patch-version\"\n                          (click)=\"deletePatchVersion(patchVersion)\"\n                        >\n                          <i c8yIcon=\"delete\"></i>\n                          {{ 'Delete' | translate }}\n                        </button>\n                      </div>\n                      <div class=\"m-l-auto p-r-8 hidden-xs fit-h-20\">\n                        <button\n                          class=\"btn btn-dot text-danger showOnHover\"\n                          [attr.aria-label]=\"'Delete' | translate\"\n                          tooltip=\"{{ 'Delete' | translate }}\"\n                          placement=\"right\"\n                          type=\"button\"\n                          [delay]=\"500\"\n                          (click)=\"deletePatchVersion(patchVersion)\"\n                        >\n                          <i\n                            c8yIcon=\"delete\"\n                            data-cy=\"firmware-details--Remove-icon\"\n                          ></i>\n                        </button>\n                      </div>\n                    </c8y-li-body>\n                  </c8y-li>\n                </c8y-list-group>\n              </c8y-li-collapse>\n            </c8y-li>\n          </c8y-list-group>\n        </div>\n      </div>\n    </div>\n  </div>\n</div>\n" }]
+                    ], template: "<c8y-title>\n  {{ (firmware$ | async)?.name }}\n</c8y-title>\n\n<c8y-breadcrumb>\n  <c8y-breadcrumb-item\n    icon=\"c8y-management\"\n    label=\"{{ 'Management' | translate }}\"\n  ></c8y-breadcrumb-item>\n  <c8y-breadcrumb-item\n    icon=\"c8y-firmware\"\n    path=\"#/firmware\"\n    label=\"{{ 'Firmware repository' | translate }}\"\n  ></c8y-breadcrumb-item>\n  <c8y-breadcrumb-item\n    icon=\"c8y-firmware\"\n    label=\"{{ (firmware$ | async)?.name }}\"\n  ></c8y-breadcrumb-item>\n</c8y-breadcrumb>\n\n<c8y-action-bar-item [placement]=\"'right'\">\n  @if (!(isLegacy$ | async)) {\n    <button\n      class=\"btn btn-link\"\n      title=\"{{ 'Add firmware' | translate }}\"\n      type=\"button\"\n      data-cy=\"firmware-details--add-firmware-btn\"\n      (click)=\"addBaseVersion()\"\n    >\n      <i c8yIcon=\"plus-circle\"></i>\n      {{ 'Add firmware' | translate }}\n    </button>\n  }\n</c8y-action-bar-item>\n\n<c8y-action-bar-item [placement]=\"'right'\">\n  @if (canAddPatchVersions$ | async) {\n    <button\n      class=\"btn btn-link\"\n      title=\"{{ 'Add firmware patch' | translate }}\"\n      type=\"button\"\n      data-cy=\"firmware-details--add-firmware-patch-btn\"\n      (click)=\"addPatchVersion()\"\n    >\n      <i c8yIcon=\"plus-circle\"></i>\n      {{ 'Add firmware patch' | translate }}\n    </button>\n  }\n</c8y-action-bar-item>\n\n<c8y-action-bar-item [placement]=\"'right'\">\n  <button\n    class=\"btn btn-link\"\n    title=\"{{ 'Reload' | translate }}\"\n    type=\"button\"\n    (click)=\"reload$.next()\"\n  >\n    <i\n      c8yIcon=\"refresh\"\n      [ngClass]=\"{ 'icon-spin': reloading$ | async }\"\n    ></i>\n    {{ 'Reload' | translate }}\n  </button>\n</c8y-action-bar-item>\n\n<div class=\"row\">\n  <div class=\"col-lg-12 col-lg-max\">\n    <div class=\"card card--fullpage\">\n      <div class=\"card-block bg-level-1 flex-no-shrink p-t-24 p-b-24\">\n        <div class=\"content-flex-70\">\n          <div class=\"text-center\">\n            <i class=\"c8y-icon-duocolor icon-48 c8y-icon c8y-icon-firmware\"></i>\n            <p>\n              <small class=\"label label-info\">Firmware</small>\n            </p>\n          </div>\n          <div class=\"flex-grow col-10\">\n            <div class=\"row\">\n              <div class=\"col-md-4\">\n                <c8y-form-group>\n                  <label class=\"control-label\">\n                    {{ 'Name' | translate }}\n                  </label>\n                  <div class=\"input-group input-group-editable\">\n                    <input\n                      class=\"form-control\"\n                      [ngStyle]=\"{ 'width.ch': (firmware$ | async)?.name?.length + 2 || 36 }\"\n                      placeholder=\"{{ 'e.g. My firmware' | translate }}\"\n                      type=\"text\"\n                      required\n                      #nameInput\n                      [ngModel]=\"(firmware$ | async)?.name\"\n                      #nameModel=\"ngModel\"\n                      data-cy=\"firmware-details--name-input\"\n                    />\n                    <span></span>\n                    <div class=\"input-group-btn\">\n                      <button\n                        class=\"btn btn-primary\"\n                        title=\"{{ 'Save' | translate }}\"\n                        type=\"button\"\n                        data-cy=\"firmware-details--name-save-btn\"\n                        (click)=\"updateFirmware$.next({ name: nameInput.value }); nameModel.reset()\"\n                        [disabled]=\"nameInput.value.length == 0\"\n                      >\n                        {{ 'Save' | translate }}\n                      </button>\n                    </div>\n                  </div>\n                </c8y-form-group>\n              </div>\n              <div class=\"col-md-4\">\n                <c8y-form-group>\n                  <label class=\"control-label\">\n                    {{ 'Description' | translate }}\n                  </label>\n                  <div class=\"input-group input-group-editable\">\n                    <input\n                      class=\"form-control\"\n                      [ngStyle]=\"{ 'width.ch': (firmware$ | async)?.description?.length || 36 }\"\n                      placeholder=\"{{ 'e.g. Firmware for hardware revision B' | translate }}\"\n                      type=\"text\"\n                      #descriptionInput\n                      [ngModel]=\"(firmware$ | async)?.description\"\n                      #descriptionModel=\"ngModel\"\n                      data-cy=\"firmware-details--description-input\"\n                    />\n                    <span></span>\n                    <div class=\"input-group-btn\">\n                      <button\n                        class=\"btn btn-primary\"\n                        title=\"{{ 'Save' | translate }}\"\n                        type=\"button\"\n                        data-cy=\"firmware-details--description-save-btn\"\n                        (click)=\"\n                          updateFirmware$.next({ description: descriptionInput.value });\n                          descriptionModel.reset()\n                        \"\n                      >\n                        {{ 'Save' | translate }}\n                      </button>\n                    </div>\n                  </div>\n                </c8y-form-group>\n              </div>\n              <div class=\"col-md-4\">\n                <c8y-form-group>\n                  <label class=\"control-label\">\n                    {{ 'Device type filter' | translate }}\n\n                    <button\n                      class=\"btn-help\"\n                      [attr.aria-label]=\"'Help' | translate\"\n                      popover=\"{{\n                        'If the filter is set, the firmware will show up for installation only for devices of that type. If no filter is set, it will be available for all devices.'\n                          | translate\n                      }}\"\n                      placement=\"right\"\n                      triggers=\"focus\"\n                      container=\"body\"\n                      type=\"button\"\n                    >\n                      <i c8yIcon=\"question-circle-o\"></i>\n                    </button>\n                  </label>\n                  <div class=\"input-group input-group-editable\">\n                    <input\n                      class=\"form-control\"\n                      [ngStyle]=\"{ 'width.ch': (firmware$ | async)?.type?.length || 36 }\"\n                      placeholder=\"{{ 'e.g.' | translate }} c8y_Linux\"\n                      type=\"text\"\n                      #deviceTypeInput\n                      [ngModel]=\"(firmware$ | async)?.c8y_Filter?.type\"\n                      #deviceTypeModel=\"ngModel\"\n                      data-cy=\"firmware-details--device-type-filter-input\"\n                    />\n                    <span></span>\n                    <div class=\"input-group-btn\">\n                      <button\n                        class=\"btn btn-primary\"\n                        title=\"{{ 'Save' | translate }}\"\n                        type=\"button\"\n                        data-cy=\"firmware-details--device-type-filter-save-btn\"\n                        (click)=\"\n                          updateFirmware$.next({ c8y_Filter: { type: deviceTypeInput.value } });\n                          deviceTypeModel.reset()\n                        \"\n                      >\n                        {{ 'Save' | translate }}\n                      </button>\n                    </div>\n                  </div>\n                </c8y-form-group>\n              </div>\n            </div>\n          </div>\n        </div>\n      </div>\n      <div class=\"inner-scroll\">\n        <div class=\"card-header separator-top-bottom bg-component sticky-top\">\n          <div\n            class=\"card-title\"\n            translate\n          >\n            Versions and patches\n          </div>\n        </div>\n\n        <div class=\"card-block p-t-0 p-b-24\">\n          @if ((baseVersions$ | async)?.data.length === 0) {\n            <div>\n              <c8y-ui-empty-state\n                [icon]=\"'c8y-firmware'\"\n                [title]=\"'No versions to display.' | translate\"\n                [subtitle]=\"'Add a new version by clicking below.' | translate\"\n                [horizontal]=\"true\"\n              >\n                <button\n                  class=\"btn btn-sm btn-default m-t-8\"\n                  title=\"{{ 'Add firmware' | translate }}\"\n                  type=\"button\"\n                  (click)=\"addBaseVersion()\"\n                >\n                  <i c8yIcon=\"plus-circle\"></i>\n                  {{ 'Add firmware' | translate }}\n                </button>\n              </c8y-ui-empty-state>\n            </div>\n          }\n\n          @if ((baseVersions$ | async)?.data.length > 0) {\n            <c8y-list-group>\n              <c8y-li\n                *c8yFor=\"let baseVersion of baseVersions$ | async; let i = index; loadMore: 'auto'\"\n                [emptyActions]=\"!(getPatchVersions$(baseVersion) | async)?.data.length\"\n                [collapsed]=\"!expanded[baseVersion.id]\"\n                (collapsedChange)=\"expanded[baseVersion.id] = !$event\"\n              >\n                <c8y-li-icon>\n                  <i c8yIcon=\"c8y-firmware\"></i>\n                </c8y-li-icon>\n                <c8y-li-body class=\"content-flex-50\">\n                  <div class=\"col-4\">\n                    <p\n                      class=\"text-truncate\"\n                      title=\"{{ baseVersion.c8y_Firmware.version }}\"\n                    >\n                      {{ baseVersion.c8y_Firmware.version }}\n                    </p>\n                  </div>\n                  <div class=\"col-5\">\n                    <p class=\"text-truncate\">\n                      <span\n                        class=\"text-label-small m-r-8\"\n                        translate\n                      >\n                        File\n                      </span>\n                      @if (baseVersion.c8y_Firmware.url === '') {\n                        <span title=\"{{ 'Provided by device' | translate }}\">\n                          {{ 'Provided by device' | translate }}\n                        </span>\n                      } @else {\n                        <span title=\"{{ getBinaryName$(baseVersion.c8y_Firmware.url) | async }}\">\n                          <c8y-file-download\n                            url=\"{{ baseVersion.c8y_Firmware.url }}\"\n                          ></c8y-file-download>\n                        </span>\n                      }\n                    </p>\n                  </div>\n                  <div class=\"col-2 d-flex a-i-start\">\n                    @if (isLegacy$ | async) {\n                      <span class=\"label label-warning m-l-auto-sm\">\n                        {{ 'Legacy' | translate }}\n                      </span>\n                    }\n                    @if (!(isLegacy$ | async)) {\n                      <span>\n                        @if ((getPatchVersionsCount$(baseVersion) | async) === null) {\n                          <span>\n                            <span class=\"label label-info\">\n                              <i\n                                class=\"icon-spin\"\n                                c8yIcon=\"circle-o-notch\"\n                              ></i>\n                            </span>\n                          </span>\n                        }\n                        @if ((getPatchVersionsCount$(baseVersion) | async) !== null) {\n                          <span>\n                            <span [ngPlural]=\"getPatchVersionsCount$(baseVersion) | async\">\n                              <ng-template ngPluralCase=\"=0\">\n                                <span class=\"label label-default m-l-auto-sm\">\n                                  <span translate>No patches</span>\n                                </span>\n                              </ng-template>\n                              <ng-template ngPluralCase=\"=1\">\n                                <span class=\"label label-info\">\n                                  <span translate>1 patch</span>\n                                </span>\n                              </ng-template>\n                              <ng-template ngPluralCase=\"other\">\n                                <span class=\"label label-info\">\n                                  <span\n                                    ngNonBindable\n                                    translate\n                                    [translateParams]=\"{\n                                      count: getPatchVersionsCount$(baseVersion) | async\n                                    }\"\n                                  >\n                                    {{ count }} patches\n                                  </span>\n                                </span>\n                              </ng-template>\n                            </span>\n                          </span>\n                        }\n                      </span>\n                    }\n                  </div>\n                  @if (!(isLegacy$ | async)) {\n                    <div class=\"fit-h-20 visible-xs\">\n                      <button\n                        class=\"btn btn-default btn-sm m-t-8\"\n                        title=\"{{ 'Delete' | translate }}\"\n                        type=\"button\"\n                        (click)=\"deleteBaseVersion(baseVersion)\"\n                      >\n                        <i c8yIcon=\"delete\"></i>\n                        {{ 'Delete' | translate }}\n                      </button>\n                    </div>\n                  }\n                  @if (!(isLegacy$ | async)) {\n                    <div class=\"m-l-auto fit-h-20 p-r-8 hidden-xs\">\n                      <button\n                        class=\"btn btn-dot btn-dot--danger showOnHover\"\n                        [attr.aria-label]=\"'Delete' | translate\"\n                        tooltip=\"{{ 'Delete' | translate }}\"\n                        type=\"button\"\n                        data-cy=\"firmware-details--delete-base-version\"\n                        [delay]=\"500\"\n                        (click)=\"deleteBaseVersion(baseVersion)\"\n                      >\n                        <i c8yIcon=\"delete\"></i>\n                      </button>\n                    </div>\n                  }\n                </c8y-li-body>\n                @if ((getPatchVersions$(baseVersion) | async)?.data.length) {\n                  <c8y-li-collapse>\n                    <c8y-list-group class=\"separator-top\">\n                      <c8y-li\n                        *c8yFor=\"\n                          let patchVersion of getPatchVersions$(baseVersion) | async;\n                          let i = index;\n                          loadMore: 'auto'\n                        \"\n                      >\n                        <c8y-li-icon>\n                          <i c8yIcon=\"c8y-firmware\"></i>\n                        </c8y-li-icon>\n                        <c8y-li-body class=\"content-flex-50\">\n                          <div class=\"col-4\">\n                            {{ patchVersion.c8y_Firmware.version }}\n                          </div>\n                          <div class=\"col-5\">\n                            <div class=\"text-truncate\">\n                              <span\n                                class=\"text-label-small m-r-8\"\n                                translate\n                              >\n                                File\n                              </span>\n                              @if (patchVersion?.c8y_Firmware?.url === '') {\n                                <span title=\"{{ 'Provided by device' | translate }}\">\n                                  {{ 'Provided by device' | translate }}\n                                </span>\n                              } @else {\n                                <span title=\"patchVersion.c8y_Firmware.url\">\n                                  <c8y-file-download\n                                    [url]=\"patchVersion.c8y_Firmware.url\"\n                                  ></c8y-file-download>\n                                </span>\n                              }\n                            </div>\n                          </div>\n                          <div class=\"visible-xs m-t-8\">\n                            <button\n                              class=\"btn btn-danger btn-xs\"\n                              title=\"{{ 'Delete' | translate }}\"\n                              type=\"button\"\n                              data-cy=\"firmware-details--delete-patch-version\"\n                              (click)=\"deletePatchVersion(patchVersion)\"\n                            >\n                              <i c8yIcon=\"delete\"></i>\n                              {{ 'Delete' | translate }}\n                            </button>\n                          </div>\n                          <div class=\"m-l-auto p-r-8 hidden-xs fit-h-20\">\n                            <button\n                              class=\"btn btn-dot text-danger showOnHover\"\n                              [attr.aria-label]=\"'Delete' | translate\"\n                              tooltip=\"{{ 'Delete' | translate }}\"\n                              placement=\"right\"\n                              type=\"button\"\n                              [delay]=\"500\"\n                              (click)=\"deletePatchVersion(patchVersion)\"\n                            >\n                              <i\n                                c8yIcon=\"delete\"\n                                data-cy=\"firmware-details--Remove-icon\"\n                              ></i>\n                            </button>\n                          </div>\n                        </c8y-li-body>\n                      </c8y-li>\n                    </c8y-list-group>\n                  </c8y-li-collapse>\n                }\n              </c8y-li>\n            </c8y-list-group>\n          }\n        </div>\n      </div>\n    </div>\n  </div>\n</div>\n" }]
         }], ctorParameters: () => [{ type: i1.ActivatedRoute }, { type: i3.InventoryService }, { type: i2.RepositoryService }, { type: i4.AlertService }, { type: i5.TranslateService }, { type: i4.ModalService }, { type: i1$1.BsModalService }, { type: i4.GainsightService }, { type: i1.Router }], propDecorators: { getPatchVersionsCount$: [], getBinaryName$: [], getPatchVersions$: [] } });
 
 class FirmwareListComponent {