bananas-commerce-admin
Version:
What's this, an admin for apes?
86 lines • 3.58 kB
JavaScript
import * as React from "react";
import { useCallback, useState } from "react";
import { useParams } from "react-router-dom";
import { KeyboardArrowDown as KeyboardArrowDownIcon } from "@mui/icons-material";
import { Button } from "@mui/material";
import Menu from "@mui/material/Menu";
import { enqueueSnackbar } from "notistack";
import { useApi } from "../../contexts/ApiContext";
import { useI18n } from "../../contexts/I18nContext";
import { useUser } from "../../contexts/UserContext";
import { hasAccess } from "../../util/has_access";
import { usePage } from "../Page";
import ActionMenuItem from "./ActionMenuItem";
export const ActionMenu = () => {
const [anchorEl, setAnchorEl] = useState(null);
const [renderedComponent, setRenderedComponent] = useState();
const params = useParams();
const page = usePage();
const { user } = useUser();
const api = useApi();
const { t } = useI18n();
const title = useCallback((operation) => t(operation.component?.title ?? operation.summary ?? operation.id), [t]);
const open = Boolean(anchorEl);
const handleClick = (event) => {
setAnchorEl(event.currentTarget);
};
const handleClose = () => {
setAnchorEl(null);
};
const handleAction = async (operation) => {
if (operation.component != null) {
let component = operation.component.component;
setAnchorEl(null);
if (component instanceof Promise) {
component = await component;
}
setRenderedComponent(() => component);
return;
}
try {
const action = api.operations[operation.id];
const response = await action.call({ params });
if (response.ok) {
enqueueSnackbar(t(`Completed successfully: ${title(action)}`), {
variant: "success",
});
handleClose();
}
else {
enqueueSnackbar(t(`Action failed: ${title(action)}`), {
variant: "error",
});
throw response;
}
}
catch (error) {
enqueueSnackbar(t("Action failed"), {
variant: "error",
});
console.error(error);
}
};
return (React.createElement(React.Fragment, null,
React.createElement(Menu, { anchorEl: anchorEl, open: open, slotProps: {
paper: {
style: {
width: "fit-content",
},
},
}, onClose: handleClose }, page?.contrib
.filter((operation) => operation.component?.variant === "action" &&
hasAccess(user, operation.component.permission, operation.component.group))
.map((operation) => (React.createElement(ActionMenuItem, { key: operation.id, operation: operation, onAction: handleAction })))),
React.createElement(Button, { "aria-haspopup": true, disableElevation: true, "aria-expanded": open ? "true" : "false", endIcon: React.createElement(KeyboardArrowDownIcon, null), sx: {
borderRadius: 6,
height: 46,
}, variant: "outlined", onClick: handleClick }, "Actions"),
renderedComponent &&
React.createElement(renderedComponent, {
close: () => setRenderedComponent(undefined),
data: {},
refresh: () => { },
})));
};
export default ActionMenu;
//# sourceMappingURL=index.js.map