import { ChangeDetectionStrategy, Component } from '@angular/core';
import { HealthCheckService } from '@ishop/admin-ui/core';
export class HealthCheckComponent {
    constructor(healthCheckService) {
        this.healthCheckService = healthCheckService;
    }
}
HealthCheckComponent.decorators = [
    { type: Component, args: [{
                selector: 'vdr-health-check',
                template: "<vdr-action-bar>\r\n    <vdr-ab-left>\r\n        <div class=\"system-status-header\" *ngIf=\"healthCheckService.status$ | async as status\">\r\n            <div class=\"status-icon\">\r\n                <clr-icon\r\n                    [attr.shape]=\"status === 'ok' ? 'check-circle' : 'exclamation-circle'\"\r\n                    [ngClass]=\"{ 'is-success': status === 'ok', 'is-danger': status !== 'ok' }\"\r\n                    size=\"48\"\r\n                ></clr-icon>\r\n            </div>\r\n            <div class=\"status-detail\">\r\n                <ng-container *ngIf=\"status === 'ok'; else error\">\r\n                    {{ 'system.health-all-systems-up' | translate }}\r\n                </ng-container>\r\n                <ng-template #error>\r\n                    {{ 'system.health-error' | translate }}\r\n                </ng-template>\r\n                <div class=\"last-checked\">\r\n                    {{ 'system.health-last-checked' | translate }}:\r\n                    {{ healthCheckService.lastCheck$ | async | localeDate: 'mediumTime' }}\r\n                </div>\r\n            </div>\r\n        </div>\r\n    </vdr-ab-left>\r\n    <vdr-ab-right>\r\n        <vdr-action-bar-items locationId=\"system-status\"></vdr-action-bar-items>\r\n        <button class=\"btn btn-secondary\" (click)=\"healthCheckService.refresh()\">\r\n            <clr-icon shape=\"refresh\"></clr-icon> {{ 'system.health-refresh' | translate }}\r\n        </button>\r\n    </vdr-ab-right>\r\n</vdr-action-bar>\r\n\r\n<table class=\"table\">\r\n    <thead>\r\n        <tr>\r\n            <th class=\"left\">\r\n                {{ 'common.name' | translate }}\r\n            </th>\r\n            <th class=\"left\">\r\n                {{ 'system.health-status' | translate }}\r\n            </th>\r\n            <th class=\"left\">\r\n                {{ 'system.health-message' | translate }}\r\n            </th>\r\n        </tr>\r\n    </thead>\r\n    <tbody>\r\n        <tr *ngFor=\"let row of healthCheckService.details$ | async\">\r\n            <td class=\"align-middle left\">{{ row.key }}</td>\r\n            <td class=\"align-middle left\">\r\n                <vdr-chip [colorType]=\"row.result.status === 'up' ? 'success' : 'error'\">\r\n                    <ng-container *ngIf=\"row.result.status === 'up'; else down\">\r\n                        <clr-icon shape=\"check-circle\"></clr-icon>\r\n                        {{ 'system.health-status-up' | translate }}\r\n                    </ng-container>\r\n                    <ng-template #down>\r\n                        <clr-icon shape=\"exclamation-circle\"></clr-icon>\r\n                        {{ 'system.health-status-down' | translate }}\r\n                    </ng-template>\r\n                </vdr-chip>\r\n            </td>\r\n            <td class=\"align-middle left\">{{ row.result.message }}</td>\r\n        </tr>\r\n    </tbody>\r\n</table>\r\n",
                changeDetection: ChangeDetectionStrategy.OnPush,
                styles: [".system-status-header{display:flex;justify-content:space-between;align-items:flex-start}.system-status-header .status-detail{font-weight:700}.system-status-header .last-checked{font-weight:400;color:var(--color-grey-500)}"]
            },] }
];
HealthCheckComponent.ctorParameters = () => [
    { type: HealthCheckService }
];
//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoiaGVhbHRoLWNoZWNrLmNvbXBvbmVudC5qcyIsInNvdXJjZVJvb3QiOiIiLCJzb3VyY2VzIjpbIi4uLy4uLy4uLy4uLy4uL3NyYy9saWIvc3lzdGVtL3NyYy9jb21wb25lbnRzL2hlYWx0aC1jaGVjay9oZWFsdGgtY2hlY2suY29tcG9uZW50LnRzIl0sIm5hbWVzIjpbXSwibWFwcGluZ3MiOiJBQUFBLE9BQU8sRUFBRSx1QkFBdUIsRUFBRSxTQUFTLEVBQUUsTUFBTSxlQUFlLENBQUM7QUFDbkUsT0FBTyxFQUFFLGtCQUFrQixFQUFFLE1BQU0sc0JBQXNCLENBQUM7QUFRMUQsTUFBTSxPQUFPLG9CQUFvQjtJQUM3QixZQUFtQixrQkFBc0M7UUFBdEMsdUJBQWtCLEdBQWxCLGtCQUFrQixDQUFvQjtJQUFHLENBQUM7OztZQVBoRSxTQUFTLFNBQUM7Z0JBQ1AsUUFBUSxFQUFFLGtCQUFrQjtnQkFDNUIsODNGQUE0QztnQkFFNUMsZUFBZSxFQUFFLHVCQUF1QixDQUFDLE1BQU07O2FBQ2xEOzs7WUFQUSxrQkFBa0IiLCJzb3VyY2VzQ29udGVudCI6WyJpbXBvcnQgeyBDaGFuZ2VEZXRlY3Rpb25TdHJhdGVneSwgQ29tcG9uZW50IH0gZnJvbSAnQGFuZ3VsYXIvY29yZSc7XHJcbmltcG9ydCB7IEhlYWx0aENoZWNrU2VydmljZSB9IGZyb20gJ0Bpc2hvcC9hZG1pbi11aS9jb3JlJztcclxuXHJcbkBDb21wb25lbnQoe1xyXG4gICAgc2VsZWN0b3I6ICd2ZHItaGVhbHRoLWNoZWNrJyxcclxuICAgIHRlbXBsYXRlVXJsOiAnLi9oZWFsdGgtY2hlY2suY29tcG9uZW50Lmh0bWwnLFxyXG4gICAgc3R5bGVVcmxzOiBbJy4vaGVhbHRoLWNoZWNrLmNvbXBvbmVudC5zY3NzJ10sXHJcbiAgICBjaGFuZ2VEZXRlY3Rpb246IENoYW5nZURldGVjdGlvblN0cmF0ZWd5Lk9uUHVzaCxcclxufSlcclxuZXhwb3J0IGNsYXNzIEhlYWx0aENoZWNrQ29tcG9uZW50IHtcclxuICAgIGNvbnN0cnVjdG9yKHB1YmxpYyBoZWFsdGhDaGVja1NlcnZpY2U6IEhlYWx0aENoZWNrU2VydmljZSkge31cclxufVxyXG4iXX0=