import { jsx as _jsx } from "react/jsx-runtime";
import { useIntl } from "react-intl";
import { DropdownList, UiTooltip } from "@gooddata/sdk-ui-kit";
import { messages } from "../../../../../locales.js";
import { useDashboardUserInteraction } from "../../../../../model/react/useDashboardUserInteraction.js";
import { AttributeHierarchyListFooter } from "./AttributeHierarchyListFooter.js";
import { AttributeHierarchyListItem } from "./AttributeHierarchyListItem.js";
const ITEM_HEIGHT = 28;
const DROPDOWN_BODY_WIDTH = 187;
export function AttributeHierarchyList({ hierarchies, onSelect, closeDropdown, onOpenAttributeHierarchyDialog, }) {
    const intl = useIntl();
    const userInteraction = useDashboardUserInteraction();
    const onClick = (item) => {
        if (!item.isDisabled) {
            onSelect(item.hierarchy);
        }
    };
    const handleFooterButtonClick = () => {
        onOpenAttributeHierarchyDialog();
        closeDropdown();
        userInteraction.attributeHierarchiesInteraction("attributeHierarchyDrillDownCreateClicked");
    };
    return (_jsx(DropdownList, { className: "hierarchies-dropdown-body s-hierarchies-dropdown-body", width: DROPDOWN_BODY_WIDTH, itemHeight: ITEM_HEIGHT, showSearch: false, items: hierarchies, footer: () => _jsx(AttributeHierarchyListFooter, { onClick: handleFooterButtonClick }), renderItem: ({ item }) => {
            return (_jsx(UiTooltip, { disabled: !item.isDisabled, triggerBy: ["hover"], arrowPlacement: "left", optimalPlacement: true, anchorWrapperStyles: { width: "100%" }, anchor: _jsx(AttributeHierarchyListItem, { item: item.hierarchy, isDisabled: item.isDisabled, onEdit: onOpenAttributeHierarchyDialog, onClick: () => {
                        onClick(item);
                    } }), content: intl.formatMessage(messages.disableUsedDrillDownTooltip, {
                    strong: (chunks) => _jsx("strong", { children: chunks }),
                }) }));
        } }));
}
