From adad2473ce4e53a0c5508f1bbce9aafb9f1e5856 Mon Sep 17 00:00:00 2001
From: Bojan Mojsilovic <bmojsilovic@itekako.com>
Date: Fri, 15 Sep 2023 15:00:18 +0200
Subject: [PATCH] Remove image zoom

---
 .../NoteImage/NoteImage.module.scss           |  1 -
 src/components/NoteImage/NoteImage.tsx        | 42 +------------------
 2 files changed, 1 insertion(+), 42 deletions(-)

diff --git a/src/components/NoteImage/NoteImage.module.scss b/src/components/NoteImage/NoteImage.module.scss
index bc94c5b..b7240e1 100644
--- a/src/components/NoteImage/NoteImage.module.scss
+++ b/src/components/NoteImage/NoteImage.module.scss
@@ -4,5 +4,4 @@
   object-fit: cover;
   border-radius: 8px;
   z-index: 22;
-  cursor: pointer;
 }
diff --git a/src/components/NoteImage/NoteImage.tsx b/src/components/NoteImage/NoteImage.tsx
index da45f78..043b180 100644
--- a/src/components/NoteImage/NoteImage.tsx
+++ b/src/components/NoteImage/NoteImage.tsx
@@ -1,7 +1,5 @@
-import { Component, JSX, onCleanup, onMount } from "solid-js";
+import { Component, JSX } from "solid-js";
 import styles from "./NoteImage.module.scss";
-import mediumZoom from "medium-zoom";
-import type { Zoom } from 'medium-zoom';
 // @ts-ignore Bad types in nostr-tools
 import { generatePrivateKey } from "nostr-tools";
 
@@ -12,46 +10,8 @@ const NoteImage: Component<{
 }> = (props) => {
   const imgId = generatePrivateKey();
 
-  const imgRef = () => {
-    return document.getElementById(imgId)
-  };
-
-  let zoomRef: Zoom | undefined;
-
   const klass = () => `${styles.noteImage} ${props.isDev ? 'redBorder' : ''}`;
 
-  const doZoom = (e: MouseEvent) => {
-    if (!e.target || (e.target as HTMLImageElement).id !== imgId) {
-      return;
-    }
-
-    zoomRef?.open();
-  };
-
-  const getZoom = () => {
-    const iRef = imgRef();
-    if (zoomRef || !iRef) {
-      return zoomRef;
-    }
-
-   zoomRef = mediumZoom(iRef, {
-        background: "var(--background-site)",
-    });
-
-    zoomRef.attach(iRef);
-  }
-
-  onMount(() => {
-    getZoom();
-    document.addEventListener('click', doZoom)
-  });
-
-  onCleanup(() => {
-    const iRef = imgRef();
-    iRef && zoomRef && zoomRef.detach(iRef);
-    document.removeEventListener('click', doZoom)
-  });
-
   return <img id={imgId} src={props.src} class={klass()} onerror={props.onError} />;
 }