import { Component, forwardRef, input, ViewChild } from '@angular/core';
import { ActivatedRoute } from '@angular/router';
import { CoreModule, gettext, OperationRealtimeService, PRODUCT_EXPERIENCE_EVENT_SOURCE } from '@c8y/ngx-components';
import { SINGLE_OPERATION_EVENT_DEVICE_TAB, SINGLE_OPERATION_EVENT_OVERVIEW } from '@c8y/ngx-components/operations/product-experience';
import { OPERATION_STATUS_OPTIONS_MAP } from '@c8y/ngx-components/operations/shared';
import { StatusFilterComponent, StatusFilterModule } from '@c8y/ngx-components/operations/status-filter';
import { flatten } from 'lodash-es';
import { BehaviorSubject, combineLatest, pipe } from 'rxjs';
import { map, shareReplay, switchMap, tap } from 'rxjs/operators';
import { OperationsListItemComponent } from './operations-list-item.component';
import { OperationsListService } from './operations-list.service';
import * as i0 from "@angular/core";
import * as i1 from "@c8y/ngx-components";
import * as i2 from "./operations-list.service";
import * as i3 from "@angular/router";
import * as i4 from "@angular/common";
import * as i5 from "@c8y/ngx-components/operations/status-filter";
export class OperationsListComponent {
    constructor(realtime, operationsListService, route) {
        this.realtime = realtime;
        this.operationsListService = operationsListService;
        this.route = route;
        this.fragmentType = input();
        this.readOnlyItems = input(false);
        this.deviceId = this.route.snapshot.parent.data.contextData?.id;
        this.OPERATION_STATUS_OPTIONS_MAP = OPERATION_STATUS_OPTIONS_MAP;
        this.refreshLoading = false;
        this.isSmartRulesMicroserviceAvailable = false;
        this.showOverviewBreadcrumbs = false;
        this.statusFilter$ = new BehaviorSubject(null);
        this.reload$ = new BehaviorSubject(null);
        this.operations$ = combineLatest(this.statusFilter$, this.reload$).pipe(tap(() => {
            this.refreshLoading = true;
        }), switchMap(([statusFilters]) => this.filter(statusFilters)), tap(() => {
            this.refreshLoading = false;
        }), shareReplay(1));
        this.operationsFilterPipe = pipe(map((operations) => {
            const statusFilters = this.statusFilter$.getValue();
            if (!statusFilters || !statusFilters.length) {
                return operations;
            }
            const allowedStatuses = flatten(statusFilters.map(sf => sf.status));
            return operations.filter(op => allowedStatuses.includes(op.status));
        }));
        this.productExperienceEvent = {
            eventName: !!this.deviceId ? SINGLE_OPERATION_EVENT_DEVICE_TAB : SINGLE_OPERATION_EVENT_OVERVIEW
        };
        this.title = this.route.snapshot.parent.data.contextData
            ? this.route.snapshot.parent.data.contextData.name
            : gettext('Single operations');
        this.showOverviewBreadcrumbs = !this.deviceId;
    }
    async ngOnInit() {
        this.isSmartRulesMicroserviceAvailable =
            await this.operationsListService.isSmartRulesMicroserviceAvailable();
    }
    filter(statusFilters) {
        const status = statusFilters && statusFilters.length > 0
            ? {
                status: flatten(statusFilters.map(statusFilter => statusFilter.status))
            }
            : {};
        return this.getOperations(status);
    }
    getOperations(filter) {
        let queryFilter = this.deviceId ? { ...filter, deviceId: this.deviceId } : filter;
        if (this.fragmentType()) {
            queryFilter = { ...queryFilter, fragmentType: this.fragmentType() };
        }
        return this.operationsListService.getOperations(queryFilter);
    }
    compareOperations(operationA, operationB) {
        return (new Date(operationA.creationTime).getTime() - new Date(operationB.creationTime).getTime());
    }
    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: OperationsListComponent, deps: [{ token: i1.OperationRealtimeService }, { token: i2.OperationsListService }, { token: i3.ActivatedRoute }], target: i0.ɵɵFactoryTarget.Component }); }
    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "18.2.13", type: OperationsListComponent, isStandalone: true, selector: "c8y-operations-list", inputs: { fragmentType: { classPropertyName: "fragmentType", publicName: "fragmentType", isSignal: true, isRequired: false, transformFunction: null }, readOnlyItems: { classPropertyName: "readOnlyItems", publicName: "readOnlyItems", isSignal: true, isRequired: false, transformFunction: null } }, providers: [
            OperationRealtimeService,
            {
                provide: PRODUCT_EXPERIENCE_EVENT_SOURCE,
                useExisting: forwardRef(() => OperationsListComponent)
            }
        ], viewQueries: [{ propertyName: "statusFilter", first: true, predicate: ["statusFilter"], descendants: true, static: true }], ngImport: i0, template: "<c8y-title>{{ title | translate }}</c8y-title>\n\n<c8y-breadcrumb *ngIf=\"showOverviewBreadcrumbs\">\n  <c8y-breadcrumb-item\n    [icon]=\"'c8y-overviews'\"\n    [label]=\"'Overviews' | translate\"\n  ></c8y-breadcrumb-item>\n  <c8y-breadcrumb-item\n    [icon]=\"'c8y-device-control'\"\n    [label]=\"'Device Control' | translate\"\n    [path]=\"'devicecontrol/single'\"\n  ></c8y-breadcrumb-item>\n  <c8y-breadcrumb-item\n    [icon]=\"'c8y-device-control'\"\n    [label]=\"'Single operations' | translate\"\n  ></c8y-breadcrumb-item>\n</c8y-breadcrumb>\n\n<c8y-action-bar-item\n  [placement]=\"'left'\"\n  itemClass=\"navbar-form\"\n>\n  <c8y-status-filter\n    #statusFilter\n    [options]=\"OPERATION_STATUS_OPTIONS_MAP\"\n    (onFilterChanged)=\"statusFilter$.next($event)\"\n    c8yProductExperience\n    inherit\n  ></c8y-status-filter>\n</c8y-action-bar-item>\n\n<c8y-action-bar-item [placement]=\"'right'\">\n  <c8y-realtime-btn [service]=\"realtime\"></c8y-realtime-btn>\n</c8y-action-bar-item>\n\n<c8y-action-bar-item [placement]=\"'right'\">\n  <button\n    class=\"btn btn-link d-flex a-i-center\"\n    title=\"{{ 'Reload' | translate }}\"\n    (click)=\"reload$.next()\"\n  >\n    <i\n      class=\"m-r-4\"\n      c8yIcon=\"refresh\"\n      [ngClass]=\"{ 'icon-spin': refreshLoading }\"\n    ></i>\n    <span class=\"text-truncate\">\n      {{ 'Reload' | translate }}\n    </span>\n  </button>\n</c8y-action-bar-item>\n\n<ng-content select=\"c8y-help\">\n  <c8y-help\n    src=\"/docs/device-management-application/monitoring-and-controlling-devices/#to-view-single-operations\"\n  ></c8y-help>\n</ng-content>\n\n<!-- Empty state  -->\n<c8y-ui-empty-state\n  [icon]=\"'c8y-energy'\"\n  [title]=\"'No items to display.' | translate\"\n  [subtitle]=\"'Operations will be displayed here.' | translate\"\n  *ngIf=\"(operations$ | async)?.data.length === 0 && !(statusFilter$ | async)\"\n></c8y-ui-empty-state>\n<!-- No results empty state -->\n<c8y-ui-empty-state\n  [icon]=\"'search'\"\n  [title]=\"'No results to display.' | translate\"\n  [subtitle]=\"'Adjust or reset the filter.' | translate\"\n  *ngIf=\"(operations$ | async)?.data.length === 0 && (statusFilter$ | async)\"\n>\n  <button\n    class=\"btn btn-primary\"\n    title=\"{{ 'Reset filter' | translate }}\"\n    type=\"button\"\n    (click)=\"statusFilter.reset()\"\n    translate\n  >\n    Reset filter\n  </button>\n</c8y-ui-empty-state>\n\n<!-- Detailed list of operations + load more button -->\n<c8y-list-group class=\"m-b-24\">\n  <div\n    class=\"page-sticky-header c8y-list__item c8y-list__item--double-actions hidden-xs\"\n    *ngIf=\"(operations$ | async)?.data.length\"\n  >\n    <div class=\"c8y-list__item__block\">\n      <div class=\"c8y-list__item__icon\">\n        <i class=\"p-l-24\"></i>\n      </div>\n      <div class=\"c8y-list__item__body text-truncate-wrap\">\n        <div class=\"content-flex-57\">\n          <div class=\"col-5\">\n            {{ 'Operation' | translate }}\n          </div>\n          <div\n            class=\"flex-grow\"\n            *ngIf=\"!deviceId\"\n          >\n            {{ 'Device' | translate }}\n          </div>\n          <div class=\"col-4\">\n            {{ 'Date created' | translate }}\n          </div>\n        </div>\n      </div>\n      <div class=\"c8y-list__item__actions\"></div>\n    </div>\n  </div>\n  <div\n    class=\"d-contents\"\n    *c8yFor=\"\n      let op of operations$ | async;\n      let i = index;\n      realtime: realtime;\n      realtimeOptions: { entityOrId: deviceId, removeOnUpdate: true, insertOnUpdate: true };\n      comparator: compareOperations.bind(this);\n      loadMore: 'auto';\n      pipe: operationsFilterPipe\n    \"\n  >\n    <c8y-operations-list-item\n      class=\"d-contents\"\n      [operation]=\"op\"\n      [readOnly]=\"readOnlyItems()\"\n      [isSmartRulesMicroserviceAvailable]=\"isSmartRulesMicroserviceAvailable\"\n      (reload)=\"reload$.next()\"\n      c8yProductExperience\n      inherit\n    ></c8y-operations-list-item>\n  </div>\n</c8y-list-group>\n", dependencies: [{ kind: "ngmodule", type: CoreModule }, { kind: "component", type: i1.ActionBarItemComponent, selector: "c8y-action-bar-item", inputs: ["placement", "priority", "itemClass", "injector", "groupId", "inGroupPriority"] }, { kind: "component", type: i1.BreadcrumbComponent, selector: "c8y-breadcrumb" }, { kind: "component", type: i1.BreadcrumbItemComponent, selector: "c8y-breadcrumb-item", inputs: ["icon", "translate", "label", "path", "injector"] }, { kind: "component", type: i1.EmptyStateComponent, selector: "c8y-ui-empty-state", inputs: ["icon", "title", "subtitle", "horizontal"] }, { kind: "directive", type: i1.IconDirective, selector: "[c8yIcon]", inputs: ["c8yIcon"] }, { kind: "pipe", type: i1.C8yTranslatePipe, name: "translate" }, { kind: "directive", type: i1.C8yTranslateDirective, selector: "[translate],[ngx-translate]" }, { kind: "directive", type: i4.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i4.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "pipe", type: i4.AsyncPipe, name: "async" }, { 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.TitleComponent, selector: "c8y-title", inputs: ["pageTitleUpdate"] }, { kind: "component", type: i1.ListGroupComponent, selector: "c8y-list-group" }, { kind: "directive", type: i1.ProductExperienceDirective, selector: "[c8yProductExperience]", inputs: ["actionName", "actionData", "inherit", "suppressDataOverriding"] }, { kind: "component", type: i1.HelpComponent, selector: "c8y-help", inputs: ["src", "isCollapsed", "priority", "icon"] }, { kind: "component", type: i1.RealtimeButtonComponent, selector: "c8y-realtime-btn", inputs: ["service", "label", "title", "disabled"], outputs: ["onToggle"] }, { kind: "ngmodule", type: StatusFilterModule }, { kind: "component", type: i5.StatusFilterComponent, selector: "c8y-status-filter", inputs: ["options", "multiple", "small"], outputs: ["onFilterChanged"] }, { kind: "component", type: OperationsListItemComponent, selector: "c8y-operations-list-item", inputs: ["operation", "collapsed", "readOnly", "noExpandToggle", "isSmartRulesMicroserviceAvailable"] }] }); }
}
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: OperationsListComponent, decorators: [{
            type: Component,
            args: [{ selector: 'c8y-operations-list', standalone: true, imports: [CoreModule, StatusFilterModule, OperationsListItemComponent], providers: [
                        OperationRealtimeService,
                        {
                            provide: PRODUCT_EXPERIENCE_EVENT_SOURCE,
                            useExisting: forwardRef(() => OperationsListComponent)
                        }
                    ], template: "<c8y-title>{{ title | translate }}</c8y-title>\n\n<c8y-breadcrumb *ngIf=\"showOverviewBreadcrumbs\">\n  <c8y-breadcrumb-item\n    [icon]=\"'c8y-overviews'\"\n    [label]=\"'Overviews' | translate\"\n  ></c8y-breadcrumb-item>\n  <c8y-breadcrumb-item\n    [icon]=\"'c8y-device-control'\"\n    [label]=\"'Device Control' | translate\"\n    [path]=\"'devicecontrol/single'\"\n  ></c8y-breadcrumb-item>\n  <c8y-breadcrumb-item\n    [icon]=\"'c8y-device-control'\"\n    [label]=\"'Single operations' | translate\"\n  ></c8y-breadcrumb-item>\n</c8y-breadcrumb>\n\n<c8y-action-bar-item\n  [placement]=\"'left'\"\n  itemClass=\"navbar-form\"\n>\n  <c8y-status-filter\n    #statusFilter\n    [options]=\"OPERATION_STATUS_OPTIONS_MAP\"\n    (onFilterChanged)=\"statusFilter$.next($event)\"\n    c8yProductExperience\n    inherit\n  ></c8y-status-filter>\n</c8y-action-bar-item>\n\n<c8y-action-bar-item [placement]=\"'right'\">\n  <c8y-realtime-btn [service]=\"realtime\"></c8y-realtime-btn>\n</c8y-action-bar-item>\n\n<c8y-action-bar-item [placement]=\"'right'\">\n  <button\n    class=\"btn btn-link d-flex a-i-center\"\n    title=\"{{ 'Reload' | translate }}\"\n    (click)=\"reload$.next()\"\n  >\n    <i\n      class=\"m-r-4\"\n      c8yIcon=\"refresh\"\n      [ngClass]=\"{ 'icon-spin': refreshLoading }\"\n    ></i>\n    <span class=\"text-truncate\">\n      {{ 'Reload' | translate }}\n    </span>\n  </button>\n</c8y-action-bar-item>\n\n<ng-content select=\"c8y-help\">\n  <c8y-help\n    src=\"/docs/device-management-application/monitoring-and-controlling-devices/#to-view-single-operations\"\n  ></c8y-help>\n</ng-content>\n\n<!-- Empty state  -->\n<c8y-ui-empty-state\n  [icon]=\"'c8y-energy'\"\n  [title]=\"'No items to display.' | translate\"\n  [subtitle]=\"'Operations will be displayed here.' | translate\"\n  *ngIf=\"(operations$ | async)?.data.length === 0 && !(statusFilter$ | async)\"\n></c8y-ui-empty-state>\n<!-- No results empty state -->\n<c8y-ui-empty-state\n  [icon]=\"'search'\"\n  [title]=\"'No results to display.' | translate\"\n  [subtitle]=\"'Adjust or reset the filter.' | translate\"\n  *ngIf=\"(operations$ | async)?.data.length === 0 && (statusFilter$ | async)\"\n>\n  <button\n    class=\"btn btn-primary\"\n    title=\"{{ 'Reset filter' | translate }}\"\n    type=\"button\"\n    (click)=\"statusFilter.reset()\"\n    translate\n  >\n    Reset filter\n  </button>\n</c8y-ui-empty-state>\n\n<!-- Detailed list of operations + load more button -->\n<c8y-list-group class=\"m-b-24\">\n  <div\n    class=\"page-sticky-header c8y-list__item c8y-list__item--double-actions hidden-xs\"\n    *ngIf=\"(operations$ | async)?.data.length\"\n  >\n    <div class=\"c8y-list__item__block\">\n      <div class=\"c8y-list__item__icon\">\n        <i class=\"p-l-24\"></i>\n      </div>\n      <div class=\"c8y-list__item__body text-truncate-wrap\">\n        <div class=\"content-flex-57\">\n          <div class=\"col-5\">\n            {{ 'Operation' | translate }}\n          </div>\n          <div\n            class=\"flex-grow\"\n            *ngIf=\"!deviceId\"\n          >\n            {{ 'Device' | translate }}\n          </div>\n          <div class=\"col-4\">\n            {{ 'Date created' | translate }}\n          </div>\n        </div>\n      </div>\n      <div class=\"c8y-list__item__actions\"></div>\n    </div>\n  </div>\n  <div\n    class=\"d-contents\"\n    *c8yFor=\"\n      let op of operations$ | async;\n      let i = index;\n      realtime: realtime;\n      realtimeOptions: { entityOrId: deviceId, removeOnUpdate: true, insertOnUpdate: true };\n      comparator: compareOperations.bind(this);\n      loadMore: 'auto';\n      pipe: operationsFilterPipe\n    \"\n  >\n    <c8y-operations-list-item\n      class=\"d-contents\"\n      [operation]=\"op\"\n      [readOnly]=\"readOnlyItems()\"\n      [isSmartRulesMicroserviceAvailable]=\"isSmartRulesMicroserviceAvailable\"\n      (reload)=\"reload$.next()\"\n      c8yProductExperience\n      inherit\n    ></c8y-operations-list-item>\n  </div>\n</c8y-list-group>\n" }]
        }], ctorParameters: () => [{ type: i1.OperationRealtimeService }, { type: i2.OperationsListService }, { type: i3.ActivatedRoute }], propDecorators: { statusFilter: [{
                type: ViewChild,
                args: ['statusFilter', { static: true }]
            }] } });
//# sourceMappingURL=data:application/json;base64, 