/**
 * @fileoverview added by tsickle
 * @suppress {checkTypes,extraRequire,missingReturn,unusedPrivateMembers,uselessCode} checked by tsc
 */
import * as tslib_1 from "tslib";
import { Component, Input } from '@angular/core';
import { Store } from '@ngrx/store';
import { format } from 'date-fns';
import { map, tap } from 'rxjs/operators';
import { NotificationService } from '../notification.service';
import { ReadNotifications } from '../ngrx/actions';
var NotificationsComponent = /** @class */ (function () {
    function NotificationsComponent(notificationService, store) {
        this.notificationService = notificationService;
        this.store = store;
        this.reading = false;
    }
    /**
     * @return {?}
     */
    NotificationsComponent.prototype.ngOnInit = /**
     * @return {?}
     */
    function () {
        var _this = this;
        this.notifications$ = this.notificationService.list$.pipe(tap(function () { return _this.readIfReading(); }), map(function (notifications) { return tslib_1.__spread(notifications).reverse()
            .map(function (notification) { return (tslib_1.__assign({}, notification, { formattedDate: format(new Date(notification.timestamp), 'DD/MM/YY H:mm') })); }); }));
    };
    /**
     * @param {?} changes
     * @return {?}
     */
    NotificationsComponent.prototype.ngOnChanges = /**
     * @param {?} changes
     * @return {?}
     */
    function (changes) {
        this.readIfReading();
    };
    /**
     * @return {?}
     */
    NotificationsComponent.prototype.readIfReading = /**
     * @return {?}
     */
    function () {
        if (this.reading) {
            this.store.dispatch(new ReadNotifications());
        }
    };
    NotificationsComponent.decorators = [
        { type: Component, args: [{
                    selector: 'bidi-notifications',
                    template: "<div class=\"is-flex has-column-direction\">\n  <h2 class=\"has-text-light is-uppercase is-size-6\">Notificaciones</h2>\n  <div class=\"notification-list flex-1\">\n    <div\n      *ngFor=\"let notification of notifications$ | async\"\n      class=\"card\"\n      [ngClass]=\"{\n        'has-text-info': notification.type === 'info',\n        'has-text-success': notification.type === 'success',\n        'has-text-warning': notification.type === 'warning',\n        'has-text-danger': notification.type === 'error',\n        'has-text-white': ['info', 'success', 'error'].includes(notification.type)\n      }\"\n    >\n      <header class=\"card-header\">\n        <div class=\"has-text-right\">\n          <span class=\"has-text-grey-light is-size-7\">\n            {{ notification.formattedDate }}\n          </span>\n        </div>\n      </header>\n      <div class=\"card-content\">\n        <p class=\"has-text-white\">{{ notification.text }}</p>\n      </div>\n    </div>\n  </div>\n</div>\n",
                    styles: [":host>div{width:340px;background:rgba(30,54,72,.95);height:calc(100vh - 35px)}:host>div h2{padding:25px}.notification-list{overflow-y:auto}.notification-list .card{margin:10px;border-left:2px solid;border-bottom:1px solid rgba(255,255,255,.2);background:0 0;box-shadow:none}.notification-list .card .card-content{padding:0 1rem .5rem}.card-header{display:block;box-shadow:none}.card-content{padding:0 1rem 1rem}"]
                }] }
    ];
    /** @nocollapse */
    NotificationsComponent.ctorParameters = function () { return [
        { type: NotificationService },
        { type: Store }
    ]; };
    NotificationsComponent.propDecorators = {
        reading: [{ type: Input }]
    };
    return NotificationsComponent;
}());
export { NotificationsComponent };
if (false) {
    /** @type {?} */
    NotificationsComponent.prototype.reading;
    /** @type {?} */
    NotificationsComponent.prototype.notifications$;
    /**
     * @type {?}
     * @private
     */
    NotificationsComponent.prototype.notificationService;
    /**
     * @type {?}
     * @private
     */
    NotificationsComponent.prototype.store;
}
//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoibm90aWZpY2F0aW9ucy5jb21wb25lbnQuanMiLCJzb3VyY2VSb290Ijoibmc6Ly9AYmlkaS9jb21tb24tY29tcG9uZW50cy8iLCJzb3VyY2VzIjpbImxpYi9tb2R1bGVzL25vdGlmaWNhdGlvbi9ub3RpZmljYXRpb25zL25vdGlmaWNhdGlvbnMuY29tcG9uZW50LnRzIl0sIm5hbWVzIjpbXSwibWFwcGluZ3MiOiI7Ozs7O0FBQUEsT0FBTyxFQUFFLFNBQVMsRUFBRSxLQUFLLEVBQW9DLE1BQU0sZUFBZSxDQUFDO0FBQ25GLE9BQU8sRUFBRSxLQUFLLEVBQUUsTUFBTSxhQUFhLENBQUM7QUFDcEMsT0FBTyxFQUFFLE1BQU0sRUFBRSxNQUFNLFVBQVUsQ0FBQztBQUVsQyxPQUFPLEVBQUUsR0FBRyxFQUFFLEdBQUcsRUFBRSxNQUFNLGdCQUFnQixDQUFDO0FBRTFDLE9BQU8sRUFBRSxtQkFBbUIsRUFBRSxNQUFNLHlCQUF5QixDQUFDO0FBQzlELE9BQU8sRUFBRSxpQkFBaUIsRUFBRSxNQUFNLGlCQUFpQixDQUFDO0FBR3BEO0lBU0UsZ0NBQ1UsbUJBQXdDLEVBQ3hDLEtBQW1CO1FBRG5CLHdCQUFtQixHQUFuQixtQkFBbUIsQ0FBcUI7UUFDeEMsVUFBSyxHQUFMLEtBQUssQ0FBYztRQUxwQixZQUFPLEdBQUcsS0FBSyxDQUFDO0lBT3pCLENBQUM7Ozs7SUFFRCx5Q0FBUTs7O0lBQVI7UUFBQSxpQkFTQztRQVJDLElBQUksQ0FBQyxjQUFjLEdBQUcsSUFBSSxDQUFDLG1CQUFtQixDQUFDLEtBQUssQ0FBQyxJQUFJLENBQ3ZELEdBQUcsQ0FBQyxjQUFNLE9BQUEsS0FBSSxDQUFDLGFBQWEsRUFBRSxFQUFwQixDQUFvQixDQUFDLEVBQy9CLEdBQUcsQ0FBQyxVQUFBLGFBQWEsSUFBSSxPQUFBLGlCQUFJLGFBQWEsRUFBRSxPQUFPLEVBQUU7YUFDOUMsR0FBRyxDQUFDLFVBQUEsWUFBWSxJQUFJLE9BQUEsc0JBQ2hCLFlBQVksSUFDZixhQUFhLEVBQUUsTUFBTSxDQUFDLElBQUksSUFBSSxDQUFDLFlBQVksQ0FBQyxTQUFTLENBQUMsRUFBRSxlQUFlLENBQUMsSUFDeEUsRUFIbUIsQ0FHbkIsQ0FBQyxFQUpnQixDQUloQixDQUFDLENBQ1AsQ0FBQztJQUNKLENBQUM7Ozs7O0lBRUQsNENBQVc7Ozs7SUFBWCxVQUFhLE9BQXNCO1FBQ2pDLElBQUksQ0FBQyxhQUFhLEVBQUUsQ0FBQztJQUN2QixDQUFDOzs7O0lBRUQsOENBQWE7OztJQUFiO1FBQ0UsSUFBSSxJQUFJLENBQUMsT0FBTyxFQUFFO1lBQ2hCLElBQUksQ0FBQyxLQUFLLENBQUMsUUFBUSxDQUFDLElBQUksaUJBQWlCLEVBQUUsQ0FBQyxDQUFDO1NBQzlDO0lBQ0gsQ0FBQzs7Z0JBbENGLFNBQVMsU0FBQztvQkFDVCxRQUFRLEVBQUUsb0JBQW9CO29CQUM5QixtL0JBQTZDOztpQkFFOUM7Ozs7Z0JBUlEsbUJBQW1CO2dCQUxuQixLQUFLOzs7MEJBZVgsS0FBSzs7SUE2QlIsNkJBQUM7Q0FBQSxBQW5DRCxJQW1DQztTQTlCWSxzQkFBc0I7OztJQUNqQyx5Q0FBeUI7O0lBQ3pCLGdEQUEyQzs7Ozs7SUFHekMscURBQWdEOzs7OztJQUNoRCx1Q0FBMkIiLCJzb3VyY2VzQ29udGVudCI6WyJpbXBvcnQgeyBDb21wb25lbnQsIElucHV0LCBPbkNoYW5nZXMsIE9uSW5pdCwgU2ltcGxlQ2hhbmdlcyB9IGZyb20gJ0Bhbmd1bGFyL2NvcmUnO1xuaW1wb3J0IHsgU3RvcmUgfSBmcm9tICdAbmdyeC9zdG9yZSc7XG5pbXBvcnQgeyBmb3JtYXQgfSBmcm9tICdkYXRlLWZucyc7XG5pbXBvcnQgeyBPYnNlcnZhYmxlIH0gZnJvbSAncnhqcyc7XG5pbXBvcnQgeyBtYXAsIHRhcCB9IGZyb20gJ3J4anMvb3BlcmF0b3JzJztcbmltcG9ydCB7IE5vdGlmaWNhdGlvbiB9IGZyb20gJy4uLy4uLy4uL21vZGVscyc7XG5pbXBvcnQgeyBOb3RpZmljYXRpb25TZXJ2aWNlIH0gZnJvbSAnLi4vbm90aWZpY2F0aW9uLnNlcnZpY2UnO1xuaW1wb3J0IHsgUmVhZE5vdGlmaWNhdGlvbnMgfSBmcm9tICcuLi9uZ3J4L2FjdGlvbnMnO1xuaW1wb3J0IHsgU3RhdGUgfSBmcm9tICcuLi9uZ3J4L3JlZHVjZXJzJztcblxuQENvbXBvbmVudCh7XG4gIHNlbGVjdG9yOiAnYmlkaS1ub3RpZmljYXRpb25zJyxcbiAgdGVtcGxhdGVVcmw6ICcuL25vdGlmaWNhdGlvbnMuY29tcG9uZW50Lmh0bWwnLFxuICBzdHlsZVVybHM6IFsnLi9ub3RpZmljYXRpb25zLmNvbXBvbmVudC5zY3NzJ11cbn0pXG5leHBvcnQgY2xhc3MgTm90aWZpY2F0aW9uc0NvbXBvbmVudCBpbXBsZW1lbnRzIE9uSW5pdCwgT25DaGFuZ2VzIHtcbiAgQElucHV0KCkgcmVhZGluZyA9IGZhbHNlO1xuICBub3RpZmljYXRpb25zJDogT2JzZXJ2YWJsZTxOb3RpZmljYXRpb25bXT47XG5cbiAgY29uc3RydWN0b3IgKFxuICAgIHByaXZhdGUgbm90aWZpY2F0aW9uU2VydmljZTogTm90aWZpY2F0aW9uU2VydmljZSxcbiAgICBwcml2YXRlIHN0b3JlOiBTdG9yZTxTdGF0ZT5cbiAgKSB7XG4gIH1cblxuICBuZ09uSW5pdCAoKSB7XG4gICAgdGhpcy5ub3RpZmljYXRpb25zJCA9IHRoaXMubm90aWZpY2F0aW9uU2VydmljZS5saXN0JC5waXBlKFxuICAgICAgdGFwKCgpID0+IHRoaXMucmVhZElmUmVhZGluZygpKSxcbiAgICAgIG1hcChub3RpZmljYXRpb25zID0+IFsuLi5ub3RpZmljYXRpb25zXS5yZXZlcnNlKClcbiAgICAgICAgLm1hcChub3RpZmljYXRpb24gPT4gKHtcbiAgICAgICAgICAuLi5ub3RpZmljYXRpb24sXG4gICAgICAgICAgZm9ybWF0dGVkRGF0ZTogZm9ybWF0KG5ldyBEYXRlKG5vdGlmaWNhdGlvbi50aW1lc3RhbXApLCAnREQvTU0vWVkgSDptbScpXG4gICAgICAgIH0pKSlcbiAgICApO1xuICB9XG5cbiAgbmdPbkNoYW5nZXMgKGNoYW5nZXM6IFNpbXBsZUNoYW5nZXMpIHtcbiAgICB0aGlzLnJlYWRJZlJlYWRpbmcoKTtcbiAgfVxuXG4gIHJlYWRJZlJlYWRpbmcgKCkge1xuICAgIGlmICh0aGlzLnJlYWRpbmcpIHtcbiAgICAgIHRoaXMuc3RvcmUuZGlzcGF0Y2gobmV3IFJlYWROb3RpZmljYXRpb25zKCkpO1xuICAgIH1cbiAgfVxufVxuIl19