import { __decorate } from "tslib";
import { Component, Output, EventEmitter, Input } from '@angular/core';
import { BehaviorSubject } from 'rxjs';
import { debounceTime, distinctUntilChanged, tap, switchMap, shareReplay } from 'rxjs/operators';
import { memoize } from '@c8y/ngx-components';
import { RepositoryService, RepositoryType } from '@c8y/ngx-components/repository';
import { gettext } from '@c8y/ngx-components';
import { TranslateService } from '@ngx-translate/core';
import { property, get } from 'lodash-es';
import { BulkOperationsService } from '@c8y/ngx-components/operations/bulk-operations-service';
export class SelectFirmwareComponent {
    constructor(repositoryService, bulkOpsService, translate) {
        this.repositoryService = repositoryService;
        this.bulkOpsService = bulkOpsService;
        this.translate = translate;
        this.firmware = new EventEmitter();
        this.elementCount = 0;
        this.DD_LOW_COUNT = 10;
        this.textFilter$ = new BehaviorSubject('');
        this.firmwares$ = this.textFilter$
            .pipe(debounceTime(400), distinctUntilChanged())
            .pipe(switchMap(text => this.getFirmwares(text)), tap(resp => {
            this.elementCount = resp.data ? resp.data.length : 0;
        }), shareReplay(1));
        this.isLegacy = this.repositoryService.isLegacyEntry.bind(this.repositoryService);
        this.DEVICE_TYPE_NOT_AVAILABLE = gettext('No device type available.');
        this.DESCRIPTION_NOT_AVAILABLE = gettext('No description available.');
    }
    ngOnInit() {
        this.DD_LOW_COUNT = this.bulkOpsService.DD_LOW_COUNT;
    }
    selectFirmware(selected, fw) {
        if (selected) {
            this.firmware.emit(fw);
        }
    }
    getBaseVersionsCount$(firmware) {
        return this.firmwares$.pipe(switchMap(() => this.repositoryService.getBaseVersionsCount$(firmware)), shareReplay(1));
    }
    getDescriptionTitle(firmware) {
        return get(firmware, 'description', this.translate.instant(this.DESCRIPTION_NOT_AVAILABLE));
    }
    getDeviceTypeTitle(firmware) {
        return get(firmware, 'c8y_Filter.type', this.translate.instant(this.DEVICE_TYPE_NOT_AVAILABLE));
    }
    getFirmwares(partialName) {
        return this.repositoryService.listRepositoryEntries(RepositoryType.FIRMWARE, { partialName });
    }
}
SelectFirmwareComponent.decorators = [
    { type: Component, args: [{
                selector: 'c8y-select-firmware-step',
                template: "<div class=\"card-block p-t-0 flex-no-shrink separator-bottom col-xs-12\">\n  <div class=\"row p-b-16\">\n    <div class=\"col-md-6 col-md-offset-3 col-lg-4 col-lg-offset-4\">\n      <h4 class=\"text-center m-b-16\">{{ 'Select firmware' | translate }}</h4>\n      <div class=\"input-group input-group-search\">\n        <input\n          type=\"search\"\n          class=\"form-control\"\n          title=\"{{ 'Filter firmware\u2026' | translate }}\"\n          placeholder=\"{{ 'Filter firmware\u2026' | translate }}\"\n          [ngModel]=\"textFilter$ | async\"\n          (ngModelChange)=\"textFilter$.next($event)\"\n        />\n        <span class=\"input-group-addon\">\n          <i c8yIcon=\"filter\" *ngIf=\"(textFilter$ | async).length === 0\"></i>\n          <i\n            c8yIcon=\"times\"\n            class=\"text-muted\"\n            *ngIf=\"(textFilter$ | async).length > 0\"\n            (click)=\"textFilter$.next('')\"\n          ></i>\n        </span>\n      </div>\n    </div>\n  </div>\n</div>\n<c8y-search-result-empty *ngIf=\"(textFilter$ | async).length > 0 && elementCount===0\">\n</c8y-search-result-empty>\n<div class=\"col-xs-12 flex-grow no-gutter\">\n  <div class=\"card-inner-scroll fit-h\">\n    <div class=\"card-block p-t-0 p-b-0\">\n      <c8y-list-group [ngClass]=\"{ 'dd-low': elementCount <= DD_LOW_COUNT }\">\n        <c8y-li *c8yFor=\"let firmware of firmwares$ | async; let i = index; loadMore: 'auto'\">\n          <c8y-li-radio (onSelect)=\"selectFirmware($event, firmware)\" [selected]=\"firmware === selected\"></c8y-li-radio>\n          <c8y-li-icon>\n            <i c8yIcon=\"c8y-firmware\"></i>\n          </c8y-li-icon>\n\n          <c8y-li-body class=\"content-flex-60\">\n            <div class=\"col-3\">\n              <div class=\"text-truncate\" title=\"{{ firmware.name }}\">\n                {{ firmware.name }}\n              </div>\n            </div>\n            <div class=\"col-4\">\n              <div class=\"text-truncate\" title=\"{{ getDescriptionTitle(firmware) }}\">\n                <small *ngIf=\"firmware.description; else noDesc\">\n                  {{ firmware.description }}\n                </small>\n                <ng-template #noDesc>\n                  <small>\n                    <em class=\"text-muted\" translate>No description available.</em>\n                  </small>\n                </ng-template>\n              </div>\n            </div>\n            <div class=\"col-3\">\n              <div class=\"text-truncate\" title=\"{{ 'Device type' | translate }}: {{ getDeviceTypeTitle(firmware) }}\">\n                <span class=\"text-label-small m-r-8\" translate>\n                  Device type\n                </span>\n                <span *ngIf=\"firmware.c8y_Filter?.type; else noType\">\n                  {{ firmware.c8y_Filter?.type }}\n                </span>\n                <ng-template #noType>\n                  <em class=\"text-muted\" translate>Undefined`device type`</em>\n                </ng-template>\n              </div>\n            </div>\n            <div class=\"col-2\">\n              <span *ngIf=\"isLegacy(firmware)\" class=\"label label-warning\">\n                <span translate>Legacy</span>\n              </span>\n\n              <span *ngIf=\"!isLegacy(firmware)\">\n                <span *ngIf=\"(getBaseVersionsCount$(firmware) | async) === null\">\n                  <span class=\"label label-info\">\n                    <i c8yIcon=\"circle-o-notch\" class=\"icon-spin\"></i>\n                  </span>\n                </span>\n                <span *ngIf=\"(getBaseVersionsCount$(firmware) | async) !== null\">\n                  <span [ngPlural]=\"getBaseVersionsCount$(firmware) | async\">\n                    <ng-template ngPluralCase=\"=0\">\n                      <span class=\"label label-default\">\n                        <span translate>No versions</span>\n                      </span>\n                    </ng-template>\n                    <ng-template ngPluralCase=\"=1\">\n                      <span class=\"label label-info\"><span translate>1 version</span></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: getBaseVersionsCount$(firmware) | async\n                          }\"\n                          >{{ count }} versions</span\n                        >\n                      </span>\n                    </ng-template>\n                  </span>\n                </span>\n              </span>\n            </div>\n          </c8y-li-body>\n        </c8y-li>\n      </c8y-list-group>\n    </div>\n  </div>\n</div>\n"
            },] }
];
SelectFirmwareComponent.ctorParameters = () => [
    { type: RepositoryService },
    { type: BulkOperationsService },
    { type: TranslateService }
];
SelectFirmwareComponent.propDecorators = {
    selected: [{ type: Input }],
    firmware: [{ type: Output }]
};
__decorate([
    memoize(property('id'))
], SelectFirmwareComponent.prototype, "getBaseVersionsCount$", null);
//# sourceMappingURL=data:application/json;base64, 