import React, { memo } from "react";
import { mapDefaultAggrMethod } from "../../../../utils/fill-missing-data";
import { parseChartString } from "../../utils/parse-chart-string";
import { sortObjectByPriority, prioritySort } from "../../utils/sorting";
import { HeadMain } from "../head-main";
import { ChartWrapper } from "../chart-wrapper";
import { renderSubmenuName } from "./render-submenu-name";
import { generateHeadCharts } from "./generate-head-charts";
const emptyNodeIDs = [];
const SubSection = memo(({ chartsMetadata, dropdownMenu, duration, host, menu, menuName, pcentWidth, renderCustomElementForDygraph, onAttributesChange, renderBeforeCharts, shouldDisplayHeadMain, attributesOverrides, commonAttributesOverrides, nodeIDs = emptyNodeIDs, }) => {
    const disableHeads = menuName.startsWith("Kubernetes");
    const submenuNames = sortObjectByPriority(menu.submenus);
    return (React.createElement("div", { role: "region", className: "dashboard-subsection" },
        React.createElement("span", { dangerouslySetInnerHTML: { __html: menu.info } }),
        renderBeforeCharts &&
            renderBeforeCharts({
                menuName,
                chartIds: submenuNames
                    .flatMap((name) => menu.submenus[name].charts)
                    .sort(prioritySort)
                    .map((chart) => chart.id),
                chartsAttributes: attributesOverrides,
                chartsMetadata,
                onAttributesChange,
                host,
                nodeIDs,
            }),
        React.createElement("div", { className: "netdata-chart-row" },
            shouldDisplayHeadMain && (React.createElement(HeadMain, { getChart: id => chartsMetadata.charts[id], duration: duration, host: host, nodeIDs: nodeIDs, commonAttributesOverrides: commonAttributesOverrides })),
            !disableHeads &&
                submenuNames.flatMap(submenu => menu.submenus[submenu].charts
                    .concat()
                    .sort(prioritySort) // shallow clone, sort by priority
                    .flatMap(chart => generateHeadCharts("mainheads", chart, duration))
                    .map(parseChartString)
                    .map((attributes) => attributes && (React.createElement(ChartWrapper, { attributes: {
                        ...attributes,
                        forceTimeWindow: true,
                        aggrMethod: mapDefaultAggrMethod(chartsMetadata.charts[attributes.id].units),
                        host,
                        nodeIDs,
                        ...commonAttributesOverrides,
                    }, key: `${attributes.id}-${attributes.dimensions}`, chartMetadata: chartsMetadata.charts[attributes.id] }))))),
        submenuNames.map(renderSubmenuName({
            disableHeads,
            chartsMetadata,
            renderCustomElementForDygraph,
            onAttributesChange,
            dropdownMenu,
            duration,
            host,
            menu,
            menuName,
            pcentWidth,
            attributesOverrides,
            nodeIDs,
            commonAttributesOverrides,
        }))));
});
export default SubSection;
//# sourceMappingURL=subSection.js.map