import React from "react";
import { name2id } from "../../../../utils/name-2-id";
import { LEGEND_BOTTOM_SINGLE_LINE_HEIGHT } from "../../../chart/utils/legend-utils";
import { NODE_VIEW_DYGRAPH_TITLE_HEIGHT } from "../../../../utils/utils";
import { mapDefaultAggrMethod } from "../../../../utils/fill-missing-data";
import { prioritySort } from "../../utils/sorting";
import { parseChartString } from "../../utils/parse-chart-string";
import { netdataDashboard, options } from "../../utils/netdata-dashboard";
import { ChartWrapper } from "../chart-wrapper";
import { generateHeadCharts } from "./generate-head-charts";
export const chartCommonMin = (family, context, units) => (netdataDashboard.anyAttribute(netdataDashboard.context, "commonMin", context, undefined) === undefined
    ? ""
    : `${family}/${context}/${units}`);
export const chartCommonMax = (family, context, units) => (netdataDashboard.anyAttribute(netdataDashboard.context, "commonMax", context, undefined) === undefined
    ? ""
    : `${family}/${context}/${units}`);
export const renderSubmenuName = ({ disableHeads, chartsMetadata, dropdownMenu, duration, host, menu, menuName, pcentWidth, renderCustomElementForDygraph, onAttributesChange, attributesOverrides, nodeIDs, commonAttributesOverrides, }) => (submenuName) => {
    const submenuID = name2id(`menu_${menuName}_submenu_${submenuName}`);
    const submenu = menu.submenus[submenuName];
    const chartsSorted = submenu.charts
        .concat() // shallow clone
        .sort(prioritySort);
    const submenuInfo = submenu.info;
    return (React.createElement("div", { role: "region", className: "dashboard-section-container", id: submenuID, key: submenuName, "data-menuid": menuName, "data-submenuid": submenuName },
        React.createElement("h2", { id: submenuID, "data-menuid": menuName, "data-submenuid": submenuName }, submenu.title),
        submenuInfo && (React.createElement("div", { className: "dashboard-submenu-info", role: "document", 
            // eslint-disable-next-line react/no-danger
            dangerouslySetInnerHTML: {
                __html: submenuInfo,
            } })),
        React.createElement("div", { className: "netdata-chart-row" }, !disableHeads && chartsSorted
            .flatMap((chart) => generateHeadCharts("heads", chart, duration))
            .map(parseChartString)
            .map((attributes) => attributes && (React.createElement(ChartWrapper, { attributes: {
                ...attributes,
                ...commonAttributesOverrides,
                aggrMethod: mapDefaultAggrMethod(chartsMetadata.charts[attributes.id].units),
                host,
                nodeIDs
            }, key: `${attributes.id}-${attributes.dimensions}`, chartMetadata: chartsMetadata.charts[attributes.id] })))),
        chartsSorted.map((chart) => {
            var _a;
            const commonMin = chartCommonMin(chart.family, chart.context, chart.units);
            const commonMax = chartCommonMax(chart.family, chart.context, chart.units);
            const chartAdditionalHeight = ((_a = commonAttributesOverrides) === null || _a === void 0 ? void 0 : _a.legendPosition) === "bottom"
                ? LEGEND_BOTTOM_SINGLE_LINE_HEIGHT
                : 0;
            return (React.createElement("div", { className: "netdata-chartblock-container", style: { width: `${pcentWidth}%` }, key: `${chart.id}-${chart.dimensions}` },
                React.createElement("span", { dangerouslySetInnerHTML: {
                        __html: netdataDashboard.contextInfo(chart.context),
                    } }),
                React.createElement(ChartWrapper, { id: `chart_${name2id(chart.id)}`, attributes: {
                        host,
                        id: chart.id,
                        chartLibrary: "dygraph",
                        width: "100%",
                        height: netdataDashboard.contextHeight(chart.context, options.chartsHeight) + chartAdditionalHeight,
                        dygraphValueRange: netdataDashboard.contextValueRange(chart.context),
                        dygraphTitleHeight: NODE_VIEW_DYGRAPH_TITLE_HEIGHT,
                        heightId: `${name2id(`${options.hostname}/${chart.id}`)}`,
                        colors: `${netdataDashboard.anyAttribute(netdataDashboard.context, "colors", chart.context, "")}`,
                        decimalDigits: netdataDashboard.contextDecimalDigits(chart.context, -1),
                        forceTimeWindow: true,
                        // add commonMin/commonMax attributes only if they are set
                        ...(commonMin ? { commonMin } : {}),
                        ...(commonMax ? { commonMax } : {}),
                        ...commonAttributesOverrides,
                        nodeIDs,
                        ...attributesOverrides[chart.id],
                    }, chartMetadata: chartsMetadata.charts[chart.id], dropdownMenu: dropdownMenu, renderCustomElementForDygraph: renderCustomElementForDygraph, onAttributesChange: (value) => onAttributesChange({ ...attributesOverrides, [chart.id]: value }) })));
        })));
};
//# sourceMappingURL=render-submenu-name.js.map