feat: add dialogs to menubar

can't put dialogs inside menubar components so we import each dialog
dynamically

src/components/menubar/FileMenu.tsx

@@ -1,3 +1,5 @@
+import { useContext } from "react";
+
 import {
 	MenubarContent,
 	MenubarItem,
@@ -9,14 +11,17 @@ import {
 	MenubarTrigger,
 } from "@/components/ui/menubar";
 
+import { DialogContext } from "@/context/DialogContext";
+
 function FileMenu() {
+	const openDialog = useContext(DialogContext);
+
 	return (
 		<MenubarMenu>
 			<MenubarTrigger>File</MenubarTrigger>
 			<MenubarContent>
 				<MenubarItem>Open Schematic</MenubarItem>
-				<MenubarItem>Open Image</MenubarItem>
-
+				<MenubarItem onClick={() => openDialog("OpenImage")}>Open Image</MenubarItem>
 				<MenubarSeparator />
 
 				<MenubarSub>

src/components/menubar/index.tsx

@@ -1,20 +1,24 @@
 import { Menubar as UIMenubar } from "@/components/ui/menubar";
 
+import { DialogProvider } from "@/context/DialogContext";
+
 import FileMenu from "./FileMenu";
 import ViewMenu from "./ViewMenu";
 import MoreMenu from "./MoreMenu";
 
 function Menubar() {
 	return (
-		<UIMenubar className="rounded-none border-t-0 border-x-0 col-span-2">
-			<a href="https://github.com/trafficlunar/blockmatic" className="ml-4 mr-2">
-				blockmatic
-			</a>
+		<DialogProvider>
+			<UIMenubar className="rounded-none border-t-0 border-x-0 col-span-2">
+				<a href="https://github.com/trafficlunar/blockmatic" className="ml-4 mr-2">
+					blockmatic
+				</a>
 
-			<FileMenu />
-			<ViewMenu />
-			<MoreMenu />
-		</UIMenubar>
+				<FileMenu />
+				<ViewMenu />
+				<MoreMenu />
+			</UIMenubar>
+		</DialogProvider>
 	);
 }