feat: remove medium-zoom temporarily

Author: transitive-bullshit

package.json

@@ -58,7 +58,6 @@
     "typescript": "^3.9.7"
   },
   "dependencies": {
-    "medium-zoom": "^1.0.5",
     "prismjs": "^1.20.0"
   }
 }

src/block.tsx

@@ -61,7 +61,6 @@ interface Block {
   mapImageUrl: MapImageUrl;
 
   fullPage?: boolean;
-  zoom?: any;
 }
 
 export const Block: React.FC<Block> = props => {
@@ -71,7 +70,6 @@ export const Block: React.FC<Block> = props => {
     level,
     fullPage,
     blockMap,
-    zoom,
     mapPageUrl,
     mapImageUrl
   } = props;
@@ -246,7 +244,7 @@ export const Block: React.FC<Block> = props => {
           className="notion-asset-wrapper"
           style={{ width: value.format.block_width }}
         >
-          <Asset block={block} zoom={zoom} mapImageUrl={mapImageUrl} />
+          <Asset block={block} mapImageUrl={mapImageUrl} />
 
           {value.properties.caption && (
             <figcaption className="notion-image-caption">

src/components/asset.tsx

@@ -6,9 +6,7 @@ const types = ["video", "image", "embed"];
 const Asset: React.FC<{
   block: BlockType;
   mapImageUrl: MapImageUrl;
-  zoom?: any;
-}> = ({ block, mapImageUrl, zoom }) => {
-  const zoomRef = React.useRef(zoom ? zoom.clone() : null);
+}> = ({ block, mapImageUrl }) => {
   const value = block.value as ContentValueType;
   const type = block.value.type;
 
@@ -41,12 +39,6 @@ const Asset: React.FC<{
 
   const src = mapImageUrl(value.properties.source[0][0]);
 
-  function attachZoom(image: any) {
-    if (zoomRef.current) {
-      (zoomRef.current as any).attach(image);
-    }
-  }
-
   if (type === "image") {
     const caption = value.properties.caption?.[0][0];
 
@@ -62,12 +54,11 @@ const Asset: React.FC<{
             className="notion-image-inset"
             alt={caption || "notion image"}
             src={src}
-            ref={attachZoom}
           />
         </div>
       );
     } else {
-      return <img alt={caption} src={src} ref={attachZoom} />;
+      return <img alt={caption} src={src} />;
     }
   }
 

src/renderer.tsx

@@ -1,8 +1,7 @@
 import React from "react";
-import mediumZoom from "medium-zoom";
 import { BlockMapType, MapPageUrl, MapImageUrl } from "./types";
 import { Block } from "./block";
-import { defaultMapImageUrl, defaultMapPageUrl } from "utils";
+import { defaultMapImageUrl, defaultMapPageUrl } from "./utils";
 
 export interface NotionRendererProps {
   blockMap: BlockMapType;
@@ -12,7 +11,6 @@ export interface NotionRendererProps {
 
   currentId?: string;
   level?: number;
-  zoom?: any;
 }
 
 export const NotionRenderer: React.FC<NotionRendererProps> = ({
@@ -33,21 +31,11 @@ export const NotionRenderer: React.FC<NotionRendererProps> = ({
     return null;
   }
 
-  const zoom =
-    props.zoom ||
-    (typeof window !== "undefined" &&
-      mediumZoom({
-        container: ".notion",
-        background: "rgba(0, 0, 0, 0.8)",
-        margin: getMediumZoomMargin()
-      }));
-
   return (
     <Block
       key={id}
       level={level}
       block={currentBlock}
-      zoom={zoom}
       mapPageUrl={mapPageUrl}
       mapImageUrl={mapImageUrl}
       {...props}
@@ -57,7 +45,6 @@ export const NotionRenderer: React.FC<NotionRendererProps> = ({
           key={contentId}
           currentId={contentId}
           level={level + 1}
-          zoom={zoom}
           mapPageUrl={mapPageUrl}
           mapImageUrl={mapImageUrl}
           {...props}
@@ -66,21 +53,3 @@ export const NotionRenderer: React.FC<NotionRendererProps> = ({
     </Block>
   );
 };
-
-function getMediumZoomMargin() {
-  const width = window.innerWidth;
-
-  if (width < 500) {
-    return 8;
-  } else if (width < 800) {
-    return 20;
-  } else if (width < 1280) {
-    return 30;
-  } else if (width < 1600) {
-    return 40;
-  } else if (width < 1920) {
-    return 48;
-  } else {
-    return 72;
-  }
-}

yarn.lock

@@ -4112,11 +4112,6 @@ map-visit@^1.0.0:
   dependencies:
     object-visit "^1.0.0"
 
-medium-zoom@^1.0.5:
-  version "1.0.5"
-  resolved "https://registry.yarnpkg.com/medium-zoom/-/medium-zoom-1.0.5.tgz#81413dda20ccdd857141ff420cfab788dd32e20e"
-  integrity sha512-aLGa6WlTuFKWvH88bqTrY5ztJMN+D0hd8UX6BYc4YSoPayppzETjZUcdVcksgaoQEMg4cZSmXPg846fTp2rjRQ==
-
 merge-stream@^2.0.0:
   version "2.0.0"
   resolved "https://registry.yarnpkg.com/merge-stream/-/merge-stream-2.0.0.tgz#52823629a14dd00c9770fb6ad47dc6310f2c1f60"