import React, { useState } from 'react';
import { Badge, Popover, MenuItem, Typography, Tooltip } from '@material-ui/core';
import { FluentButton } from '../inputs/buttons/FluentButton';
import { ChevronDownIcon } from '@fluentui/react-icons';
import { FluentIcon } from '../../utilities/iconLibrary/FluentIcon';
import { AppIconDefaultIcon, ErrorIcon } from '@fluentui/react-icons';
export const BulkActionsGridButton = (props) => {
    const { numSelectedRows, bulkActions, triggerAction, domain } = props;
    const [actionsAnchorEl, setActionsAnchorEl] = useState(null);
    const handleBulkActionsClick = (event) => {
        setActionsAnchorEl(event.currentTarget);
    };
    const triggerBulkAction = (actionId) => {
        triggerAction(actionId);
    };
    const filterAction = (action) => {
        var _a;
        return !!domain
            ? ((_a = JSON.parse(action === null || action === void 0 ? void 0 : action.parameters)) === null || _a === void 0 ? void 0 : _a.entityName) === domain
            : true;
    };
    return (React.createElement("div", { style: { marginTop: 5, marginLeft: 20 } }, React.createElement(Badge, { badgeContent: numSelectedRows, color: "secondary" }, React.createElement(FluentButton, { type: "button", onClick: handleBulkActionsClick, variant: "outlined", color: "primary", endIcon: React.createElement(FluentIcon, { component: ChevronDownIcon, size: "small" }) }, "With Selecte")), React.createElement(Popover, { id: 'actions', open: Boolean(actionsAnchorEl), anchorEl: actionsAnchorEl, onClose: () => setActionsAnchorEl(null), anchorOrigin: {
            vertical: 'bottom',
            horizontal: 'right'
        }, transformOrigin: {
            vertical: 'top',
            horizontal: 'right'
        } }, bulkActions &&
        bulkActions.map((action) => {
            var _a;
            const valid = filterAction(action);
            return (React.createElement(Tooltip, { placement: "right", title: !valid ? 'Action entity does not match data grid entity' : '' }, React.createElement("span", null, React.createElement(MenuItem, { onClick: () => triggerBulkAction(action.actionId), style: {
                    display: 'flex',
                    justifyContent: 'space-between'
                }, disabled: !valid }, React.createElement(Typography, null, action.name), React.createElement(FluentIcon, { component: valid ? (_a = action.icon) !== null && _a !== void 0 ? _a : AppIconDefaultIcon : ErrorIcon, style: { marginLeft: 7 }, color: !valid && 'red' })))));
        }))));
};
//# sourceMappingURL=BulkActionsGridButton.js.map