import { Component, forwardRef } from '@angular/core';
import { ActivatedRoute } from '@angular/router';
import { AlertService, gettext, ManagedObjectRealtimeService, OperationRealtimeService, PRODUCT_EXPERIENCE_EVENT_SOURCE } from '@c8y/ngx-components';
import { pipe } from 'rxjs';
import { filter, map } from 'rxjs/operators';
import { PRODUCT_EXPERIENCE_DEVICE_PROFILE } from '../device-profile.model';
import { DeviceProfileService } from '../device-profile.service';
import * as i0 from "@angular/core";
import * as i1 from "@c8y/ngx-components";
import * as i2 from "../device-profile.service";
import * as i3 from "@angular/router";
import * as i4 from "@angular/common";
import * as i5 from "@angular/forms";
import * as i6 from "@c8y/ngx-components/operations/operation-details";
import * as i7 from "./device-tab-profile-detail.component";
export class DeviceTabProfileComponent {
    constructor(deviceRealtime, deviceProfileService, route, operationRealtime, alertService) {
        this.deviceRealtime = deviceRealtime;
        this.deviceProfileService = deviceProfileService;
        this.route = route;
        this.operationRealtime = operationRealtime;
        this.alertService = alertService;
        this.PRODUCT_EXPERIENCE = PRODUCT_EXPERIENCE_DEVICE_PROFILE;
        this.firmwareItems = [];
        this.softwareItems = [];
        this.configurationItems = [];
        this.pattern = '';
        this.reloading = false;
        this.productExperienceEvent = {
            eventName: PRODUCT_EXPERIENCE_DEVICE_PROFILE.EVENTS.DEVICE_TAB,
            data: {
                component: PRODUCT_EXPERIENCE_DEVICE_PROFILE.COMPONENTS.DEVICE_TAB_PROFILE
            }
        };
    }
    async ngOnInit() {
        this.device = this.route.snapshot.parent.data.contextData;
        this.getDeviceProfilesAndUpdateProfileItems();
        this.subscribeToManagedObjects();
    }
    async getDeviceProfilesAndUpdateProfileItems() {
        this.reloading = true;
        this.deviceProfiles = await this.deviceProfileService.getDeviceProfilesByDeviceType(this.device.type);
        if (this.device.c8y_Profile) {
            const profileId = this.device.c8y_Profile.profileId;
            this.selectedProfile = this.deviceProfiles.data.find(mo => mo.id === profileId);
        }
        this.updateProfileItems(this.device, this.selectedProfile);
        this.operation = await this.deviceProfileService.getProfileOperation(this.device.id);
        this.subscribeToOperations();
        this.reloading = false;
    }
    selectProfile(mo) {
        this.selectedProfile = mo;
        this.updateProfileItems(this.device, this.selectedProfile);
    }
    async createOperation() {
        this.operation = await this.deviceProfileService.createProfileOperation(this.device, this.selectedProfile);
    }
    setPipe(filterStr) {
        this.pattern = filterStr;
        this.filterPipe = pipe(map(data => {
            return data.filter(mo => mo.name && mo.name.toLowerCase().indexOf(filterStr.toLowerCase()) > -1);
        }));
    }
    ngOnDestroy() {
        this.operationsSubscription.unsubscribe();
        this.moOnUpdateSubscription.unsubscribe();
        this.moOnDeleteSubscription.unsubscribe();
    }
    updateProfileItems(device, profile) {
        this.firmwareItems = this.deviceProfileService.getFirmwareItems(device, profile);
        this.softwareItems = this.deviceProfileService.getSoftwareItems(device, profile);
        this.configurationItems = this.deviceProfileService.getConfigurationItems(device, profile);
    }
    subscribeToManagedObjects() {
        this.moOnUpdateSubscription = this.deviceRealtime
            .onUpdate$(this.device.id)
            .subscribe((managedObject) => {
            this.updateProfileItems(managedObject, this.selectedProfile);
        });
        this.moOnDeleteSubscription = this.deviceRealtime.onDelete$(this.device.id).subscribe(() => {
            this.alertService.danger(gettext('This device has just been deleted. You will be redirected to "All devices" page now.'));
            window.location.href = '#/device';
        });
    }
    subscribeToOperations() {
        this.operationsSubscription = this.operationRealtime
            .onAll$(this.device.id)
            .pipe(map(({ data }) => data), filter(operation => operation.c8y_DeviceProfile))
            .subscribe(operation => {
            this.operation = operation;
        });
    }
    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.9", ngImport: i0, type: DeviceTabProfileComponent, deps: [{ token: i1.ManagedObjectRealtimeService }, { token: i2.DeviceProfileService }, { token: i3.ActivatedRoute }, { token: i1.OperationRealtimeService }, { token: i1.AlertService }], target: i0.ɵɵFactoryTarget.Component }); }
    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "18.2.9", type: DeviceTabProfileComponent, selector: "c8y-device-tab-profile", providers: [
            ManagedObjectRealtimeService,
            {
                provide: PRODUCT_EXPERIENCE_EVENT_SOURCE,
                useExisting: forwardRef(() => DeviceTabProfileComponent)
            }
        ], ngImport: i0, template: "<c8y-action-bar-item [placement]=\"'right'\">\n  <button\n    class=\"btn btn-link\"\n    title=\"{{ 'Reload' | translate }}\"\n    type=\"button\"\n    (click)=\"getDeviceProfilesAndUpdateProfileItems()\"\n  >\n    <i c8yIcon=\"refresh\" [ngClass]=\"{ 'icon-spin': reloading }\"></i>\n    {{ 'Reload' | translate }}\n  </button>\n</c8y-action-bar-item>\n<c8y-action-bar-item [placement]=\"'right'\">\n  <c8y-realtime-btn [service]=\"deviceRealtime\"></c8y-realtime-btn>\n</c8y-action-bar-item>\n\n<div class=\"card card--grid--fullpage card--grid--fullpage card--grid grid__row--2-10--md\">\n  <div class=\"card--grid grid__col--6-6--md\">\n    <!-- AVAILABLE PROFILES -->\n    <div class=\"bg-level-0\">\n      <div class=\"card-header separator\">\n        <div class=\"card-title\" translate>Device profile</div>\n      </div>\n      <div class=\"p-16\">\n        <form #deviceProfileForm=\"ngForm\">\n          <div class=\"input-group\">\n            <c8y-typeahead\n              class=\"flex-grow\"\n              name=\"selectProfile\"\n              data-cy=\"device-tab-profile--select-device-profile\"\n              [(ngModel)]=\"selectedProfile\"\n              placeholder=\"{{ 'Select device profile' | translate }}\"\n              (onSearch)=\"setPipe($event)\"\n              [allowFreeEntries]=\"false\"\n            >\n              <c8y-li\n                *c8yFor=\"let profile of deviceProfiles; pipe: filterPipe\"\n                class=\"p-l-8 p-r-8 c8y-list__item--link\"\n                (click)=\"selectProfile(profile); setPipe('')\"\n              >\n                <c8y-highlight\n                  [text]=\"profile.name || '&#45;&#45;'\"\n                  [pattern]=\"pattern\"\n                ></c8y-highlight>\n              </c8y-li>\n            </c8y-typeahead>\n            <div class=\"input-group-btn\">\n              <button\n                class=\"btn btn-primary\"\n                (click)=\"createOperation()\"\n                data-cy=\"device-tab-profile--Assign-device-profile-button\"\n                title=\"{{ 'Assign device profile' | translate }}\"\n                type=\"button\"\n                [disabled]=\"!selectedProfile?.id\"\n                c8yProductExperience\n                inherit\n                [actionData]=\"{ action: PRODUCT_EXPERIENCE.ACTIONS.ASSIGN_DEVICE_PROFILE }\"\n              >\n                <span>{{ 'Assign device profile' | translate }}</span>\n              </button>\n            </div>\n          </div>\n        </form>\n      </div>\n    </div>\n\n    <!-- INSTALL PROFILE OPERATION -->\n    <div class=\"bg-level-1\">\n      <div class=\"card-header separator\">\n        <div class=\"card-title\" translate>Currently installed</div>\n      </div>\n      <div class=\"card-block\">\n        <c8y-operation-details\n          [operation]=\"operation\"\n          c8yProductExperience\n          inherit\n          suppressDataOverriding\n        ></c8y-operation-details>\n      </div>\n    </div>\n  </div>\n  <div class=\"card--grid__inner-scroll d-col no-align-items\">\n    <div class=\"d-contents\">\n      <!-- FIRMWARE -->\n      <c8y-device-tab-profile-detail\n        [sectionTitle]=\"'Firmware' | translate\"\n        [sectionIcon]=\"'c8y-firmware'\"\n        [emptyStateText]=\"'No firmware to display.' | translate\"\n        [emptyStateDetails]=\"'No firmware assigned.' | translate\"\n        [isProfileSelected]=\"!!selectedProfile\"\n        [items]=\"firmwareItems\"\n        [isEmpty]=\"!selectedProfile?.c8y_DeviceProfile?.firmware?.name\"\n        class=\"d-contents\"\n      ></c8y-device-tab-profile-detail>\n    </div>\n    <div class=\"d-contents\">\n      <!-- SOFTWARE -->\n      <c8y-device-tab-profile-detail\n        [sectionTitle]=\"'Software' | translate\"\n        [sectionIcon]=\"'c8y-tools'\"\n        [emptyStateText]=\"'No software to display.' | translate\"\n        [emptyStateDetails]=\"'No software assigned.' | translate\"\n        [isProfileSelected]=\"!!selectedProfile\"\n        [items]=\"softwareItems\"\n        [isEmpty]=\"\n          !selectedProfile?.c8y_DeviceProfile?.software ||\n          selectedProfile?.c8y_DeviceProfile?.software?.length === 0\n        \"\n        class=\"d-contents\"\n      ></c8y-device-tab-profile-detail>\n    </div>\n    <div class=\"d-contents\">\n      <!-- CONFIGURATION -->\n      <c8y-device-tab-profile-detail\n        [sectionTitle]=\"'Configuration' | translate\"\n        [sectionIcon]=\"'gears'\"\n        [emptyStateText]=\"'No configuration to display' | translate\"\n        [emptyStateDetails]=\"'No configuration assigned' | translate\"\n        [isProfileSelected]=\"!!selectedProfile\"\n        [items]=\"configurationItems\"\n        [isEmpty]=\"\n          !selectedProfile?.c8y_DeviceProfile?.configuration ||\n          selectedProfile?.c8y_DeviceProfile?.configuration?.length === 0\n        \"\n        [showTextLabel]=\"false\"\n        class=\"d-contents\"\n      ></c8y-device-tab-profile-detail>\n    </div>\n    <!-- fill in the remanining vertical space when empty -->\n    <div class=\"card--grid grid__col--6-6--md flex-grow\">\n      <div class=\"bg-level-0\"></div>\n      <div class=\"bg-level-1\"></div>\n    </div>\n  </div>\n</div>\n", dependencies: [{ kind: "component", type: i1.ActionBarItemComponent, selector: "c8y-action-bar-item", inputs: ["placement", "priority", "itemClass", "injector", "groupId", "inGroupPriority"] }, { kind: "directive", type: i1.IconDirective, selector: "[c8yIcon]", inputs: ["c8yIcon"] }, { kind: "directive", type: i1.C8yTranslateDirective, selector: "[translate],[ngx-translate]" }, { kind: "directive", type: i4.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i1.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: i1.HighlightComponent, selector: "c8y-highlight", inputs: ["pattern", "text", "elementClass", "shouldTrimPattern"] }, { kind: "component", type: i1.TypeaheadComponent, selector: "c8y-typeahead", inputs: ["required", "maxlength", "disabled", "allowFreeEntries", "placeholder", "displayProperty", "icon", "name", "autoClose", "hideNew", "container", "selected", "highlightFirstItem"], outputs: ["onSearch", "onIconClick"] }, { kind: "directive", type: i5.ɵNgNoValidate, selector: "form:not([ngNoForm]):not([ngNativeValidate])" }, { kind: "directive", type: i5.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i5.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { kind: "directive", type: i5.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "directive", type: i5.NgForm, selector: "form:not([ngNoForm]):not([formGroup]),ng-form,[ngForm]", inputs: ["ngFormOptions"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { kind: "component", type: i1.ListItemComponent, selector: "c8y-list-item, c8y-li", inputs: ["active", "highlighted", "emptyActions", "dense", "collapsed", "selectable"], outputs: ["collapsedChange"] }, { kind: "directive", type: i1.ProductExperienceDirective, selector: "[c8yProductExperience]", inputs: ["actionName", "actionData", "inherit", "suppressDataOverriding"] }, { kind: "component", type: i1.RealtimeButtonComponent, selector: "c8y-realtime-btn", inputs: ["service", "label", "title", "disabled"], outputs: ["onToggle"] }, { kind: "component", type: i6.OperationDetailsComponent, selector: "c8y-operation-details", inputs: ["operation"] }, { kind: "component", type: i7.DeviceTabProfileDetailComponent, selector: "c8y-device-tab-profile-detail", inputs: ["sectionTitle", "sectionIcon", "emptyStateText", "emptyStateDetails", "isProfileSelected", "isEmpty", "items", "showTextLabel"] }, { kind: "pipe", type: i1.C8yTranslatePipe, name: "translate" }] }); }
}
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.9", ngImport: i0, type: DeviceTabProfileComponent, decorators: [{
            type: Component,
            args: [{ selector: 'c8y-device-tab-profile', providers: [
                        ManagedObjectRealtimeService,
                        {
                            provide: PRODUCT_EXPERIENCE_EVENT_SOURCE,
                            useExisting: forwardRef(() => DeviceTabProfileComponent)
                        }
                    ], template: "<c8y-action-bar-item [placement]=\"'right'\">\n  <button\n    class=\"btn btn-link\"\n    title=\"{{ 'Reload' | translate }}\"\n    type=\"button\"\n    (click)=\"getDeviceProfilesAndUpdateProfileItems()\"\n  >\n    <i c8yIcon=\"refresh\" [ngClass]=\"{ 'icon-spin': reloading }\"></i>\n    {{ 'Reload' | translate }}\n  </button>\n</c8y-action-bar-item>\n<c8y-action-bar-item [placement]=\"'right'\">\n  <c8y-realtime-btn [service]=\"deviceRealtime\"></c8y-realtime-btn>\n</c8y-action-bar-item>\n\n<div class=\"card card--grid--fullpage card--grid--fullpage card--grid grid__row--2-10--md\">\n  <div class=\"card--grid grid__col--6-6--md\">\n    <!-- AVAILABLE PROFILES -->\n    <div class=\"bg-level-0\">\n      <div class=\"card-header separator\">\n        <div class=\"card-title\" translate>Device profile</div>\n      </div>\n      <div class=\"p-16\">\n        <form #deviceProfileForm=\"ngForm\">\n          <div class=\"input-group\">\n            <c8y-typeahead\n              class=\"flex-grow\"\n              name=\"selectProfile\"\n              data-cy=\"device-tab-profile--select-device-profile\"\n              [(ngModel)]=\"selectedProfile\"\n              placeholder=\"{{ 'Select device profile' | translate }}\"\n              (onSearch)=\"setPipe($event)\"\n              [allowFreeEntries]=\"false\"\n            >\n              <c8y-li\n                *c8yFor=\"let profile of deviceProfiles; pipe: filterPipe\"\n                class=\"p-l-8 p-r-8 c8y-list__item--link\"\n                (click)=\"selectProfile(profile); setPipe('')\"\n              >\n                <c8y-highlight\n                  [text]=\"profile.name || '&#45;&#45;'\"\n                  [pattern]=\"pattern\"\n                ></c8y-highlight>\n              </c8y-li>\n            </c8y-typeahead>\n            <div class=\"input-group-btn\">\n              <button\n                class=\"btn btn-primary\"\n                (click)=\"createOperation()\"\n                data-cy=\"device-tab-profile--Assign-device-profile-button\"\n                title=\"{{ 'Assign device profile' | translate }}\"\n                type=\"button\"\n                [disabled]=\"!selectedProfile?.id\"\n                c8yProductExperience\n                inherit\n                [actionData]=\"{ action: PRODUCT_EXPERIENCE.ACTIONS.ASSIGN_DEVICE_PROFILE }\"\n              >\n                <span>{{ 'Assign device profile' | translate }}</span>\n              </button>\n            </div>\n          </div>\n        </form>\n      </div>\n    </div>\n\n    <!-- INSTALL PROFILE OPERATION -->\n    <div class=\"bg-level-1\">\n      <div class=\"card-header separator\">\n        <div class=\"card-title\" translate>Currently installed</div>\n      </div>\n      <div class=\"card-block\">\n        <c8y-operation-details\n          [operation]=\"operation\"\n          c8yProductExperience\n          inherit\n          suppressDataOverriding\n        ></c8y-operation-details>\n      </div>\n    </div>\n  </div>\n  <div class=\"card--grid__inner-scroll d-col no-align-items\">\n    <div class=\"d-contents\">\n      <!-- FIRMWARE -->\n      <c8y-device-tab-profile-detail\n        [sectionTitle]=\"'Firmware' | translate\"\n        [sectionIcon]=\"'c8y-firmware'\"\n        [emptyStateText]=\"'No firmware to display.' | translate\"\n        [emptyStateDetails]=\"'No firmware assigned.' | translate\"\n        [isProfileSelected]=\"!!selectedProfile\"\n        [items]=\"firmwareItems\"\n        [isEmpty]=\"!selectedProfile?.c8y_DeviceProfile?.firmware?.name\"\n        class=\"d-contents\"\n      ></c8y-device-tab-profile-detail>\n    </div>\n    <div class=\"d-contents\">\n      <!-- SOFTWARE -->\n      <c8y-device-tab-profile-detail\n        [sectionTitle]=\"'Software' | translate\"\n        [sectionIcon]=\"'c8y-tools'\"\n        [emptyStateText]=\"'No software to display.' | translate\"\n        [emptyStateDetails]=\"'No software assigned.' | translate\"\n        [isProfileSelected]=\"!!selectedProfile\"\n        [items]=\"softwareItems\"\n        [isEmpty]=\"\n          !selectedProfile?.c8y_DeviceProfile?.software ||\n          selectedProfile?.c8y_DeviceProfile?.software?.length === 0\n        \"\n        class=\"d-contents\"\n      ></c8y-device-tab-profile-detail>\n    </div>\n    <div class=\"d-contents\">\n      <!-- CONFIGURATION -->\n      <c8y-device-tab-profile-detail\n        [sectionTitle]=\"'Configuration' | translate\"\n        [sectionIcon]=\"'gears'\"\n        [emptyStateText]=\"'No configuration to display' | translate\"\n        [emptyStateDetails]=\"'No configuration assigned' | translate\"\n        [isProfileSelected]=\"!!selectedProfile\"\n        [items]=\"configurationItems\"\n        [isEmpty]=\"\n          !selectedProfile?.c8y_DeviceProfile?.configuration ||\n          selectedProfile?.c8y_DeviceProfile?.configuration?.length === 0\n        \"\n        [showTextLabel]=\"false\"\n        class=\"d-contents\"\n      ></c8y-device-tab-profile-detail>\n    </div>\n    <!-- fill in the remanining vertical space when empty -->\n    <div class=\"card--grid grid__col--6-6--md flex-grow\">\n      <div class=\"bg-level-0\"></div>\n      <div class=\"bg-level-1\"></div>\n    </div>\n  </div>\n</div>\n" }]
        }], ctorParameters: () => [{ type: i1.ManagedObjectRealtimeService }, { type: i2.DeviceProfileService }, { type: i3.ActivatedRoute }, { type: i1.OperationRealtimeService }, { type: i1.AlertService }] });
//# sourceMappingURL=data:application/json;base64, 