@nova-ui/dashboards/sdk/atoms/src/lib/components/proportional-widget/proportional-donut-content/proportional-donut-content.component.js

Nova Dashboards is a framework designed to provide feature developers with a common solution for presenting data coming from various sources within a single view, as well as a set of predefined widget visualizations that are 100% configuration-driven and

"use strict";
// © 2022 SolarWinds Worldwide, LLC. All rights reserved.
//
// Permission is hereby granted, free of charge, to any person obtaining a copy
//  of this software and associated documentation files (the "Software"), to
//  deal in the Software without restriction, including without limitation the
//  rights to use, copy, modify, merge, publish, distribute, sublicense, and/or
//  sell copies of the Software, and to permit persons to whom the Software is
//  furnished to do so, subject to the following conditions:
//
// The above copyright notice and this permission notice shall be included in
//  all copies or substantial portions of the Software.
//
// THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
//  IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
//  FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
//  AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
//  LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
//  OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN
//  THE SOFTWARE.
Object.defineProperty(exports, "__esModule", { value: true });
exports.ProportionalDonutContentComponent = void 0;
const tslib_1 = require("tslib");
const core_1 = require("@angular/core");
const rxjs_1 = require("rxjs");
const operators_1 = require("rxjs/operators");
const bits_1 = require("@nova-ui/bits");
const charts_1 = require("@nova-ui/charts");
const map_data_to_formatter_properties_1 = require("../../../functions/map-data-to-formatter-properties");
const proportional_content_aggregators_registry_service_1 = require("../../../services/proportional-content-aggregators-registry.service");
const public_api_1 = require("../../../services/public-api");
let ProportionalDonutContentComponent = class ProportionalDonutContentComponent {
    static { this.lateLoadKey = "ProportionalDonutContentComponent"; }
    constructor(aggregatorRegistry, formatterRegistry, changeDetector, logger) {
        this.aggregatorRegistry = aggregatorRegistry;
        this.formatterRegistry = formatterRegistry;
        this.changeDetector = changeDetector;
        this.logger = logger;
        this.destroy$ = new rxjs_1.Subject();
    }
    ngOnChanges(changes) {
        if (changes.donutConfig) {
            const donutConfig = changes.donutConfig.currentValue;
            const { formatter, aggregator } = donutConfig;
            if (aggregator?.aggregatorType) {
                this.updateAggregatorDefinition(aggregator);
                this.updateAggregatedValue();
            }
            if (formatter?.componentType) {
                this.contentFormatter = formatter;
                this.updateFormatterDefinition(formatter);
                this.updateFormatterProperties();
            }
        }
        if (changes.widgetData) {
            this.updateAggregatedValue();
            this.updateFormatterProperties();
        }
        if (changes.chartAssist) {
            this.subscribeToChartAssist();
        }
    }
    ngOnDestroy() {
        this.destroy$.next();
        this.destroy$.complete();
    }
    /**
     * Iterates over formatters and maps their properties from the data
     *
     * @param formattersConfiguration
     */
    getFormatterProperties(formatter) {
        if (!formatter) {
            return undefined;
        }
        return {
            ...this.contentFormatterDefinition?.properties,
            data: (0, map_data_to_formatter_properties_1.mapDataToFormatterProperties)(formatter, {
                // add "aggregatedValue" as "value" so that formatter processes it by default
                value: this.aggregatedValue,
            }),
        };
    }
    updateAggregatorDefinition(aggregatorConfig) {
        const fromRegistry = this.aggregatorRegistry.getItem(aggregatorConfig.aggregatorType);
        if (fromRegistry) {
            this.contentAggregatorDefinition = fromRegistry;
        }
        else {
            this.logger.warn(`No aggregator with key ${aggregatorConfig.aggregatorType} found in registry.`);
        }
    }
    updateFormatterDefinition(formatterConfig) {
        const fromRegistry = this.formatterRegistry.getItem(formatterConfig.componentType);
        if (fromRegistry) {
            this.contentFormatterDefinition = fromRegistry;
        }
        else {
            this.logger.warn(`No aggregator with key ${formatterConfig.componentType} found in registry.`);
        }
    }
    updateAggregatedValue() {
        if (!this.widgetData || !this.contentAggregatorDefinition) {
            this.logger.warn(`Can't aggregate value. Aggregator key: ${this.contentAggregatorDefinition?.aggregatorType}. Data: ${this.widgetData}`);
            return;
        }
        const properties = this.getAggregatorProperties();
        this.aggregatedValue = this.contentAggregatorDefinition
            .fn(this.widgetData, {
            ...properties,
            // prioritize emphasizedSeriesId if series is hovered on the chart
            activeMetricId: this.emphasizedSeriesId || properties.activeMetricId,
        })
            .toString();
    }
    updateFormatterProperties() {
        this.contentFormatterProperties = this.getFormatterProperties(this.contentFormatter);
    }
    getAggregatorProperties() {
        return {
            ...this.contentAggregatorDefinition?.properties,
            ...this.donutConfig?.aggregator?.properties,
        };
    }
    subscribeToChartAssist() {
        this.chartAssistSubscription?.unsubscribe();
        this.chartAssistSubscription = this.chartAssist?.chartAssistSubject
            ?.pipe((0, operators_1.takeUntil)(this.destroy$))
            .subscribe((data) => {
            this.emphasizedSeriesId = data.payload?.seriesId;
            this.updateAggregatedValue();
            this.updateFormatterProperties();
            this.changeDetector.detectChanges();
        });
    }
};
exports.ProportionalDonutContentComponent = ProportionalDonutContentComponent;
tslib_1.__decorate([
    (0, core_1.Input)(),
    tslib_1.__metadata("design:type", Array)
], ProportionalDonutContentComponent.prototype, "widgetData", void 0);
tslib_1.__decorate([
    (0, core_1.Input)(),
    tslib_1.__metadata("design:type", Object)
], ProportionalDonutContentComponent.prototype, "donutConfig", void 0);
tslib_1.__decorate([
    (0, core_1.Input)(),
    tslib_1.__metadata("design:type", charts_1.ChartAssist)
], ProportionalDonutContentComponent.prototype, "chartAssist", void 0);
exports.ProportionalDonutContentComponent = ProportionalDonutContentComponent = tslib_1.__decorate([
    (0, core_1.Component)({
        selector: "nui-proportional-donut-content",
        templateUrl: "./proportional-donut-content.component.html",
        styleUrls: ["./proportional-donut-content.component.less"],
        changeDetection: core_1.ChangeDetectionStrategy.OnPush,
        standalone: false,
    }),
    tslib_1.__metadata("design:paramtypes", [proportional_content_aggregators_registry_service_1.ProportionalContentAggregatorsRegistryService,
        public_api_1.ProportionalDonutContentFormattersRegistryService,
        core_1.ChangeDetectorRef,
        bits_1.LoggerService])
], ProportionalDonutContentComponent);
//# sourceMappingURL=proportional-donut-content.component.js.map