2026-05-02 13:02:57 +08:00

47 lines
1.4 KiB
JavaScript

import Tooltip from "@mui/material/Tooltip";
import { HostOrgFilters } from "@/features/host-org/components/HostOrgFilters.jsx";
import styles from "@/features/host-org/host-org.module.css";
import { IconButton } from "@/shared/ui/IconButton.jsx";
export function HostOrgToolbar({ actions = [], filters }) {
return (
<div className={styles.toolbar}>
<div className={styles.toolbarLeft}>
<HostOrgFilters {...filters} />
</div>
{actions.length ? (
<div className={styles.toolbarActions}>
{actions.map((action) => (
<Tooltip arrow key={action.label} title={action.label}>
<span>
<IconButton
className={styles.toolbarAction}
disabled={action.disabled}
label={action.label}
tone={action.tone}
onClick={action.onClick}
sx={action.variant === "primary" ? primaryActionSx : undefined}
>
{action.icon}
</IconButton>
</span>
</Tooltip>
))}
</div>
) : null}
</div>
);
}
const primaryActionSx = {
borderColor: "var(--primary)",
backgroundColor: "var(--primary)",
color: "var(--active-contrast)",
"&:hover": {
borderColor: "var(--primary-strong)",
backgroundColor: "var(--primary-strong)",
color: "var(--active-contrast)"
}
};