36 lines
1.1 KiB
TypeScript
36 lines
1.1 KiB
TypeScript
import { Dropdown, IconButton, Menu, MenuButton } from "@mui/joy";
|
|
import { useNavigate } from "react-router-dom";
|
|
import { useTranslate } from "@/utils/i18n";
|
|
import Icon from "./Icon";
|
|
|
|
const FloatingNavButton = () => {
|
|
const navigate = useNavigate();
|
|
const t = useTranslate();
|
|
|
|
return (
|
|
<>
|
|
<Dropdown>
|
|
<div className="fixed bottom-6 right-6">
|
|
<MenuButton
|
|
slots={{ root: IconButton }}
|
|
slotProps={{
|
|
root: { className: "!bg-white dark:!bg-zinc-900 drop-shadow", size: "sm", variant: "outlined", color: "neutral" },
|
|
}}
|
|
>
|
|
<Icon.MoreVertical className="w-4 h-auto" />
|
|
</MenuButton>
|
|
</div>
|
|
<Menu placement="top-end">
|
|
<button
|
|
className="w-full text-left text-sm whitespace-nowrap leading-6 py-1 px-3 cursor-pointer hover:bg-gray-100 dark:hover:bg-zinc-600"
|
|
onClick={() => navigate("/")}
|
|
>
|
|
{t("router.back-to-home")}
|
|
</button>
|
|
</Menu>
|
|
</Dropdown>
|
|
</>
|
|
);
|
|
};
|
|
|
|
export default FloatingNavButton;
|