import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
// (C) 2026 GoodData Corporation
import { useState } from "react";
import { defineMessages, useIntl } from "react-intl";
import { Dropdown, UiIcon, UiIconButton, UiSubmenuHeader } from "@gooddata/sdk-ui-kit";
import { DashboardParameterPicker } from "./DashboardParameterPicker.js";
const messages = defineMessages({
    addFilter: { id: "dashboard_add_filter.button.aria_label" },
    addFilterTitle: { id: "dashboard_add_filter.menu.title" },
    parameter: { id: "dashboard_add_filter.menu.parameter" },
});
/**
 * KD-local "+" filter menu.
 *
 * @internal
 */
export function AddFilterMenu() {
    const intl = useIntl();
    return (_jsx(Dropdown, { className: "gd-add-filter-menu", alignPoints: [{ align: "bl tl", offset: { x: 0, y: 5 } }], renderButton: ({ isOpen, toggleDropdown }) => (_jsx(UiIconButton, { icon: "plus", variant: "secondary", size: "medium", isActive: isOpen, onClick: toggleDropdown, accessibilityConfig: {
                ariaLabel: intl.formatMessage(messages.addFilter),
                isExpanded: isOpen,
                ariaExpanded: isOpen,
                ariaHaspopup: true,
            } })), renderBody: ({ closeDropdown }) => _jsx(AddFilterMenuBody, { onClose: closeDropdown }) }));
}
function AddFilterMenuBody({ onClose }) {
    const intl = useIntl();
    const [activeView, setActiveView] = useState("menu");
    if (activeView === "menu") {
        return (_jsxs("div", { className: "gd-add-filter-menu-body", children: [
                _jsx(UiSubmenuHeader, { title: intl.formatMessage(messages.addFilterTitle), onClose: onClose }), _jsx("div", { className: "gd-add-filter-menu-content", children: _jsxs("button", { type: "button", className: "gd-add-filter-menu-item", onClick: () => setActiveView("parameters"), children: [
                            _jsx(UiIcon, { type: "parameter", size: 18, color: "currentColor" }), _jsx("span", { children: intl.formatMessage(messages.parameter) })
                        ] }) })
            ] }));
    }
    return (_jsxs("div", { className: "gd-add-filter-menu-body", children: [
            _jsx(UiSubmenuHeader, { title: intl.formatMessage(messages.parameter), onBack: () => setActiveView("menu"), onClose: onClose }), _jsx(DashboardParameterPicker, { onAdd: onClose, onCancel: () => setActiveView("menu") })
        ] }));
}
