blockmatic/src/components/menubar/index.tsx

47 lines
1.3 KiB
TypeScript

import { useContext } from "react";
import { Link } from "react-router";
import { DialogProvider } from "@/context/Dialog";
import { ThemeContext } from "@/context/Theme";
import { Menubar as UIMenubar } from "@/components/ui/menubar";
import FileMenu from "./FileMenu";
import EditMenu from "./EditMenu";
import SelectMenu from "./SelectMenu";
import ViewMenu from "./ViewMenu";
import ThemeIcon from "@/components/ThemeIcon";
import BlockmaticIcon from "@/assets/blockmatic-icon-colored.svg?react";
import BlockmaticText from "@/assets/blockmatic-text-colored.svg?react";
import GithubIcon from "@/assets/github.svg?react";
function Menubar() {
const { isDark } = useContext(ThemeContext);
return (
<DialogProvider>
<UIMenubar className="rounded-none border-t-0 border-x-0 col-span-3">
<Link to={{ pathname: "/" }} className="px-4 w-40 flex gap-2 items-center">
<BlockmaticIcon className="h-full w-8" />
<BlockmaticText className="h-full w-full" />
</Link>
<FileMenu />
<EditMenu />
<SelectMenu />
<ViewMenu />
<div className="absolute right-3 flex items-center gap-1">
<ThemeIcon inApp />
<a href="https://github.com/trafficlunar/blockmatic" className="w-5">
<GithubIcon fill={isDark ? "white" : "black"} />
</a>
</div>
</UIMenubar>
</DialogProvider>
);
}
export default Menubar;