feat: port ImageViewer

src/components/common/messaging/embed/Embed.tsx

@@ -7,6 +7,7 @@ import { useContext } from "preact/hooks";
 import { useIntermediate } from "../../../../context/intermediate/Intermediate";
 
 import { useClient } from "../../../../controllers/client/ClientController";
+import { modalController } from "../../../../controllers/modals/ModalController";
 import { MessageAreaWidthContext } from "../../../../pages/channels/messaging/MessageArea";
 import Markdown from "../../../markdown/Markdown";
 import Attachment from "../attachments/Attachment";
@@ -24,7 +25,7 @@ const MAX_PREVIEW_SIZE = 150;
 export default function Embed({ embed }: Props) {
     const client = useClient();
 
-    const { openScreen, openLink } = useIntermediate();
+    const { openLink } = useIntermediate();
     const maxWidth = Math.min(
         useContext(MessageAreaWidthContext) - CONTAINER_PADDING,
         MAX_EMBED_WIDTH,
@@ -191,7 +192,9 @@ export default function Embed({ embed }: Props) {
                     type="text/html"
                     frameBorder="0"
                     loading="lazy"
-                    onClick={() => openScreen({ id: "image_viewer", embed })}
+                    onClick={() =>
+                        modalController.push({ type: "image_viewer", embed })
+                    }
                     onMouseDown={(ev) => ev.button === 1 && openLink(embed.url)}
                 />
             );