import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
// (C) 2023-2025 GoodData Corporation
import { useCallback, useMemo } from "react";
import cx from "classnames";
import { useIntl } from "react-intl";
import { dataSourcePermissionMessages } from "./locales.js";
import { QuestionMarkIcon } from "./QuestionMarkIcon.js";
export function PermissionDropdownItem({ permission, selectedPermission, toggleDropdown, onSelect, bubbleTextId, }) {
    const intl = useIntl();
    const handleOnChange = useCallback(() => {
        if (permission.enabled) {
            toggleDropdown();
            onSelect(permission.id);
        }
    }, [permission, onSelect, toggleDropdown]);
    const isSelected = useMemo(() => permission.id === selectedPermission, [permission, selectedPermission]);
    return (_jsxs("div", { onClick: handleOnChange, className: cx("gd-list-item", "gd-menu-item", "gd-granular-permission-select-item", "gd-user-management-permission-item", "s-user-management-permission-item", {
            "is-disabled": !permission.enabled,
            "is-selected": isSelected,
        }), children: [
            _jsx("div", { children: intl.formatMessage(dataSourcePermissionMessages[permission.id]) }), _jsx("div", { className: "gd-user-management-help-icon-wrapper", children: _jsx(QuestionMarkIcon, { bubbleTextId: bubbleTextId }) })
        ] }));
}
//# sourceMappingURL=PermissionsDropdownItem.js.map