import { ChangeDetectionStrategy, Component } from '@angular/core';
import { map } from 'rxjs/operators';
import * as i0 from "@angular/core";
import * as i1 from "../../providers/alerts/alerts.service";
import * as i2 from "@angular/common";
import * as i3 from "@clr/angular";
import * as i4 from "../../shared/components/dropdown/dropdown.component";
import * as i5 from "../../shared/components/dropdown/dropdown-menu.component";
import * as i6 from "../../shared/components/dropdown/dropdown-trigger.directive";
import * as i7 from "../../shared/components/dropdown/dropdown-item.directive";
import * as i8 from "../../shared/components/status-badge/status-badge.component";
import * as i9 from "@ngx-translate/core";
export class AlertsComponent {
    constructor(alertsService) {
        this.alertsService = alertsService;
        this.hasAlerts$ = alertsService.activeAlerts$.pipe(map(alerts => alerts.filter(a => !a.hasRun).length > 0));
        this.activeAlerts$ = alertsService.activeAlerts$;
    }
    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.2.2", ngImport: i0, type: AlertsComponent, deps: [{ token: i1.AlertsService }], target: i0.ɵɵFactoryTarget.Component }); }
    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.2.2", type: AlertsComponent, selector: "vdr-alerts", ngImport: i0, template: "<vdr-dropdown>\n    <button class=\"alerts-button\" vdrDropdownTrigger>\n        <vdr-status-badge *ngIf=\"hasAlerts$ | async\" [type]=\"'warning'\"></vdr-status-badge>\n        <div class=\"user-circle\">\n            <clr-icon shape=\"bell\" size=\"16\"></clr-icon>\n        </div>\n    </button>\n    <vdr-dropdown-menu vdrPosition=\"bottom-right\">\n        <ng-container *ngIf=\"activeAlerts$ | async as activeAlerts\">\n            <ng-container *ngIf=\"activeAlerts.length; else noAlerts\">\n                <button *ngFor=\"let alert of activeAlerts\" vdrDropdownItem (click)=\"alert.runAction()\" [disabled]=\"alert.hasRun\">\n                    <clr-icon shape=\"check is-success\" *ngIf=\"alert.hasRun\"></clr-icon>\n                    {{ alert.label.text | translate : alert.label.translationVars }}\n                </button>\n            </ng-container>\n        </ng-container>\n        <ng-template #noAlerts>\n            <div class=\"no-alerts\">\n                <clr-icon shape=\"check\" class=\"mr-1\" /><span>{{ 'common.no-alerts' | translate }}</span>\n            </div></ng-template\n        >\n    </vdr-dropdown-menu>\n</vdr-dropdown>\n", styles: [".alerts-button{position:relative;display:flex;align-items:center;justify-content:space-between;border:none;font-size:var(--font-size-sm);width:100%;line-height:100%;height:40px;color:var(--color-text-100);background-color:var(--color-page-header-item-bg);border-radius:var(--border-radius-lg);cursor:pointer;padding:calc(var(--space-unit) * 1.5)}.alerts-button:hover{color:var(--color-text-200)}vdr-status-badge{position:absolute;top:9px;right:9px}.no-alerts{display:flex;align-items:center;justify-content:center;height:100%;width:100%;color:var(--color-text-300);font-size:var(--font-size-sm);padding:0 calc(var(--space-unit) * 1.5)}\n"], dependencies: [{ kind: "directive", type: i2.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i2.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i3.ClrIconCustomTag, selector: "clr-icon" }, { kind: "component", type: i4.DropdownComponent, selector: "vdr-dropdown", inputs: ["manualToggle"] }, { kind: "component", type: i5.DropdownMenuComponent, selector: "vdr-dropdown-menu", inputs: ["vdrPosition", "customClasses"] }, { kind: "directive", type: i6.DropdownTriggerDirective, selector: "[vdrDropdownTrigger]" }, { kind: "directive", type: i7.DropdownItemDirective, selector: "[vdrDropdownItem]" }, { kind: "component", type: i8.StatusBadgeComponent, selector: "vdr-status-badge", inputs: ["type"] }, { kind: "pipe", type: i2.AsyncPipe, name: "async" }, { kind: "pipe", type: i9.TranslatePipe, name: "translate" }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
}
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.2", ngImport: i0, type: AlertsComponent, decorators: [{
            type: Component,
            args: [{ selector: 'vdr-alerts', changeDetection: ChangeDetectionStrategy.OnPush, template: "<vdr-dropdown>\n    <button class=\"alerts-button\" vdrDropdownTrigger>\n        <vdr-status-badge *ngIf=\"hasAlerts$ | async\" [type]=\"'warning'\"></vdr-status-badge>\n        <div class=\"user-circle\">\n            <clr-icon shape=\"bell\" size=\"16\"></clr-icon>\n        </div>\n    </button>\n    <vdr-dropdown-menu vdrPosition=\"bottom-right\">\n        <ng-container *ngIf=\"activeAlerts$ | async as activeAlerts\">\n            <ng-container *ngIf=\"activeAlerts.length; else noAlerts\">\n                <button *ngFor=\"let alert of activeAlerts\" vdrDropdownItem (click)=\"alert.runAction()\" [disabled]=\"alert.hasRun\">\n                    <clr-icon shape=\"check is-success\" *ngIf=\"alert.hasRun\"></clr-icon>\n                    {{ alert.label.text | translate : alert.label.translationVars }}\n                </button>\n            </ng-container>\n        </ng-container>\n        <ng-template #noAlerts>\n            <div class=\"no-alerts\">\n                <clr-icon shape=\"check\" class=\"mr-1\" /><span>{{ 'common.no-alerts' | translate }}</span>\n            </div></ng-template\n        >\n    </vdr-dropdown-menu>\n</vdr-dropdown>\n", styles: [".alerts-button{position:relative;display:flex;align-items:center;justify-content:space-between;border:none;font-size:var(--font-size-sm);width:100%;line-height:100%;height:40px;color:var(--color-text-100);background-color:var(--color-page-header-item-bg);border-radius:var(--border-radius-lg);cursor:pointer;padding:calc(var(--space-unit) * 1.5)}.alerts-button:hover{color:var(--color-text-200)}vdr-status-badge{position:absolute;top:9px;right:9px}.no-alerts{display:flex;align-items:center;justify-content:center;height:100%;width:100%;color:var(--color-text-300);font-size:var(--font-size-sm);padding:0 calc(var(--space-unit) * 1.5)}\n"] }]
        }], ctorParameters: function () { return [{ type: i1.AlertsService }]; } });
//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoiYWxlcnRzLmNvbXBvbmVudC5qcyIsInNvdXJjZVJvb3QiOiIiLCJzb3VyY2VzIjpbIi4uLy4uLy4uLy4uLy4uL3NyYy9saWIvY29yZS9zcmMvY29tcG9uZW50cy9hbGVydHMvYWxlcnRzLmNvbXBvbmVudC50cyIsIi4uLy4uLy4uLy4uLy4uL3NyYy9saWIvY29yZS9zcmMvY29tcG9uZW50cy9hbGVydHMvYWxlcnRzLmNvbXBvbmVudC5odG1sIl0sIm5hbWVzIjpbXSwibWFwcGluZ3MiOiJBQUFBLE9BQU8sRUFBRSx1QkFBdUIsRUFBRSxTQUFTLEVBQUUsTUFBTSxlQUFlLENBQUM7QUFFbkUsT0FBTyxFQUFFLEdBQUcsRUFBRSxNQUFNLGdCQUFnQixDQUFDOzs7Ozs7Ozs7OztBQVNyQyxNQUFNLE9BQU8sZUFBZTtJQUd4QixZQUFzQixhQUE0QjtRQUE1QixrQkFBYSxHQUFiLGFBQWEsQ0FBZTtRQUM5QyxJQUFJLENBQUMsVUFBVSxHQUFHLGFBQWEsQ0FBQyxhQUFhLENBQUMsSUFBSSxDQUM5QyxHQUFHLENBQUMsTUFBTSxDQUFDLEVBQUUsQ0FBQyxNQUFNLENBQUMsTUFBTSxDQUFDLENBQUMsQ0FBQyxFQUFFLENBQUMsQ0FBQyxDQUFDLENBQUMsTUFBTSxDQUFDLENBQUMsTUFBTSxHQUFHLENBQUMsQ0FBQyxDQUMxRCxDQUFDO1FBQ0YsSUFBSSxDQUFDLGFBQWEsR0FBRyxhQUFhLENBQUMsYUFBYSxDQUFDO0lBQ3JELENBQUM7OEdBUlEsZUFBZTtrR0FBZixlQUFlLGtEQ1g1Qiwrb0NBdUJBOzsyRkRaYSxlQUFlO2tCQU4zQixTQUFTOytCQUNJLFlBQVksbUJBR0wsdUJBQXVCLENBQUMsTUFBTSIsInNvdXJjZXNDb250ZW50IjpbImltcG9ydCB7IENoYW5nZURldGVjdGlvblN0cmF0ZWd5LCBDb21wb25lbnQgfSBmcm9tICdAYW5ndWxhci9jb3JlJztcbmltcG9ydCB7IE9ic2VydmFibGUgfSBmcm9tICdyeGpzJztcbmltcG9ydCB7IG1hcCB9IGZyb20gJ3J4anMvb3BlcmF0b3JzJztcbmltcG9ydCB7IEFjdGl2ZUFsZXJ0LCBBbGVydHNTZXJ2aWNlIH0gZnJvbSAnLi4vLi4vcHJvdmlkZXJzL2FsZXJ0cy9hbGVydHMuc2VydmljZSc7XG5cbkBDb21wb25lbnQoe1xuICAgIHNlbGVjdG9yOiAndmRyLWFsZXJ0cycsXG4gICAgdGVtcGxhdGVVcmw6ICcuL2FsZXJ0cy5jb21wb25lbnQuaHRtbCcsXG4gICAgc3R5bGVVcmxzOiBbJy4vYWxlcnRzLmNvbXBvbmVudC5zY3NzJ10sXG4gICAgY2hhbmdlRGV0ZWN0aW9uOiBDaGFuZ2VEZXRlY3Rpb25TdHJhdGVneS5PblB1c2gsXG59KVxuZXhwb3J0IGNsYXNzIEFsZXJ0c0NvbXBvbmVudCB7XG4gICAgcHJvdGVjdGVkIGhhc0FsZXJ0cyQ6IE9ic2VydmFibGU8Ym9vbGVhbj47XG4gICAgcHJvdGVjdGVkIGFjdGl2ZUFsZXJ0cyQ6IE9ic2VydmFibGU8QWN0aXZlQWxlcnRbXT47XG4gICAgY29uc3RydWN0b3IocHJvdGVjdGVkIGFsZXJ0c1NlcnZpY2U6IEFsZXJ0c1NlcnZpY2UpIHtcbiAgICAgICAgdGhpcy5oYXNBbGVydHMkID0gYWxlcnRzU2VydmljZS5hY3RpdmVBbGVydHMkLnBpcGUoXG4gICAgICAgICAgICBtYXAoYWxlcnRzID0+IGFsZXJ0cy5maWx0ZXIoYSA9PiAhYS5oYXNSdW4pLmxlbmd0aCA+IDApLFxuICAgICAgICApO1xuICAgICAgICB0aGlzLmFjdGl2ZUFsZXJ0cyQgPSBhbGVydHNTZXJ2aWNlLmFjdGl2ZUFsZXJ0cyQ7XG4gICAgfVxufVxuIiwiPHZkci1kcm9wZG93bj5cbiAgICA8YnV0dG9uIGNsYXNzPVwiYWxlcnRzLWJ1dHRvblwiIHZkckRyb3Bkb3duVHJpZ2dlcj5cbiAgICAgICAgPHZkci1zdGF0dXMtYmFkZ2UgKm5nSWY9XCJoYXNBbGVydHMkIHwgYXN5bmNcIiBbdHlwZV09XCInd2FybmluZydcIj48L3Zkci1zdGF0dXMtYmFkZ2U+XG4gICAgICAgIDxkaXYgY2xhc3M9XCJ1c2VyLWNpcmNsZVwiPlxuICAgICAgICAgICAgPGNsci1pY29uIHNoYXBlPVwiYmVsbFwiIHNpemU9XCIxNlwiPjwvY2xyLWljb24+XG4gICAgICAgIDwvZGl2PlxuICAgIDwvYnV0dG9uPlxuICAgIDx2ZHItZHJvcGRvd24tbWVudSB2ZHJQb3NpdGlvbj1cImJvdHRvbS1yaWdodFwiPlxuICAgICAgICA8bmctY29udGFpbmVyICpuZ0lmPVwiYWN0aXZlQWxlcnRzJCB8IGFzeW5jIGFzIGFjdGl2ZUFsZXJ0c1wiPlxuICAgICAgICAgICAgPG5nLWNvbnRhaW5lciAqbmdJZj1cImFjdGl2ZUFsZXJ0cy5sZW5ndGg7IGVsc2Ugbm9BbGVydHNcIj5cbiAgICAgICAgICAgICAgICA8YnV0dG9uICpuZ0Zvcj1cImxldCBhbGVydCBvZiBhY3RpdmVBbGVydHNcIiB2ZHJEcm9wZG93bkl0ZW0gKGNsaWNrKT1cImFsZXJ0LnJ1bkFjdGlvbigpXCIgW2Rpc2FibGVkXT1cImFsZXJ0Lmhhc1J1blwiPlxuICAgICAgICAgICAgICAgICAgICA8Y2xyLWljb24gc2hhcGU9XCJjaGVjayBpcy1zdWNjZXNzXCIgKm5nSWY9XCJhbGVydC5oYXNSdW5cIj48L2Nsci1pY29uPlxuICAgICAgICAgICAgICAgICAgICB7eyBhbGVydC5sYWJlbC50ZXh0IHwgdHJhbnNsYXRlIDogYWxlcnQubGFiZWwudHJhbnNsYXRpb25WYXJzIH19XG4gICAgICAgICAgICAgICAgPC9idXR0b24+XG4gICAgICAgICAgICA8L25nLWNvbnRhaW5lcj5cbiAgICAgICAgPC9uZy1jb250YWluZXI+XG4gICAgICAgIDxuZy10ZW1wbGF0ZSAjbm9BbGVydHM+XG4gICAgICAgICAgICA8ZGl2IGNsYXNzPVwibm8tYWxlcnRzXCI+XG4gICAgICAgICAgICAgICAgPGNsci1pY29uIHNoYXBlPVwiY2hlY2tcIiBjbGFzcz1cIm1yLTFcIiAvPjxzcGFuPnt7ICdjb21tb24ubm8tYWxlcnRzJyB8IHRyYW5zbGF0ZSB9fTwvc3Bhbj5cbiAgICAgICAgICAgIDwvZGl2PjwvbmctdGVtcGxhdGVcbiAgICAgICAgPlxuICAgIDwvdmRyLWRyb3Bkb3duLW1lbnU+XG48L3Zkci1kcm9wZG93bj5cbiJdfQ==