bananas-commerce-admin
Version:
What's this, an admin for apes?
49 lines • 3.23 kB
JavaScript
import React from "react";
import { useNavigate } from "react-router-dom";
import ArrowBackIcon from "@mui/icons-material/ArrowBack";
import NavigateNextIcon from "@mui/icons-material/NavigateNext";
import { AppBar, Breadcrumbs, IconButton, Link, Stack, Toolbar, Typography, } from "@mui/material";
import { useI18n } from "../../contexts/I18nContext";
import { useRouter } from "../../contexts/RouterContext";
import { useUser } from "../../contexts/UserContext";
import { hasAccess } from "../../util/has_access";
import ActionMenu from "../ActionMenu";
import { usePage } from "../Page";
export const TitleBar = ({ back = false, title, children, ...props }) => {
const { t } = useI18n();
const { navigate, getCurrent, routes } = useRouter();
const routerNavigate = useNavigate();
const page = usePage();
const { user } = useUser();
if (typeof back === "boolean" && back)
back = -1;
const { route: currentRoute } = getCurrent();
const breadcrumbRoutes = routes.filter((route) => route.id !== currentRoute.id &&
route.action === "list" &&
currentRoute.path.startsWith(route.path));
return (React.createElement(AppBar, { elevation: 0, position: "static", sx: { flexGrow: 1, bgcolor: "transparent" }, ...props },
React.createElement(Toolbar, { sx: {
display: "flex",
width: "100%",
gap: { xs: 2, sm: 1 },
flexDirection: { xs: "column", sm: "row" },
"> *": { width: "100%" },
}, variant: "dense" },
React.createElement(Stack, { alignItems: "center", direction: "row", flexGrow: 1 },
back ? (React.createElement(IconButton, { "aria-label": "back", color: "default", edge: "start", size: "large", sx: { mr: 1.5, backgroundColor: "background.paper" }, onClick: () => navigate(back) },
React.createElement(ArrowBackIcon, null))) : null,
React.createElement(Stack, null,
title ? (React.createElement(Typography, { color: "text.primary", sx: { fontWeight: 700 }, variant: "h6" }, title)) : null,
React.createElement(Breadcrumbs, { "aria-label": "breadcrumbs", separator: React.createElement(NavigateNextIcon, { fontSize: "inherit" }), sx: {
fontSize: "0.8rem",
".MuiBreadcrumbs-separator": { mx: 0.5 },
a: { cursor: "pointer" },
} },
React.createElement(Link, { key: "home", color: "inherit", underline: "hover", onClick: () => routerNavigate("/", { replace: true }) }, t("Home")),
breadcrumbRoutes.map((route) => (React.createElement(Link, { key: route.id, color: "inherit", underline: "hover", onClick: () => navigate(route) }, route.title)))))),
children,
page?.contrib.filter((operation) => operation.component?.variant === "action" &&
hasAccess(user, operation.component.permission, operation.component.group)).length > 0 && (React.createElement(Stack, { width: "fit-content" },
React.createElement(ActionMenu, null))))));
};
//# sourceMappingURL=index.js.map