import { jsx as _jsx } from "react/jsx-runtime";
// (C) 2007-2026 GoodData Corporation
import { useIntl } from "react-intl";
import { Dropdown, DropdownButton } from "@gooddata/sdk-ui-kit";
import { InsightList } from "../../insightList/InsightList.js";
const DROPDOWN_ALIGN_POINTS = [
    {
        align: "bl tl",
        offset: {
            x: 0,
            y: 4,
        },
    },
    {
        align: "tl bl",
        offset: {
            x: 0,
            y: -4,
        },
    },
];
function getButtonValue(title, intl, ref) {
    if (!ref) {
        return intl.formatMessage({ id: "configurationPanel.drillConfig.selectInsight" });
    }
    return title || intl.formatMessage({ id: "loading" });
}
export function InsightDropdown({ insight, insightRef, insightType, onSelect }) {
    const intl = useIntl();
    const buttonText = getButtonValue(insight?.insight.title ?? "", intl, insightRef);
    return (_jsx(Dropdown, { className: "s-report_select report-select", closeOnMouseDrag: true, closeOnParentScroll: true, alignPoints: DROPDOWN_ALIGN_POINTS, renderButton: ({ isOpen, toggleDropdown }) => (_jsx(DropdownButton, { value: buttonText, onClick: toggleDropdown, isOpen: isOpen, isSmall: false, iconLeft: insightType ? `gd-vis-type-${insightType}` : undefined, className: "gd-button-small s-visualization-button-target-insight" })), renderBody: ({ closeDropdown }) => {
            return (_jsx("div", { className: "open-visualizations s-open-visualizations", children: _jsx(InsightList, { selectedRef: insightRef, height: 300, width: 275, searchAutofocus: true, onSelect: (insight) => {
                        onSelect(insight);
                        closeDropdown();
                    } }) }));
        } }));
}
