simplify previewzoomoverlay clicks

frontend/src/detail/PreviewZoomOverlay.jsx

@@ -1,7 +1,6 @@
 import React, { useEffect, useRef, useState } from 'react';
 import { createPortal } from 'react-dom';
 import { ArrowLeftIcon, ArrowRightIcon } from '../ui/icons';
-import usePointerTap from '../ui/usePointerTap';
 
 const noop = () => {};
 
@@ -18,8 +17,6 @@ const ensureDocumentRoot = () => {
   return document.body;
 };
 
-const CLICK_DELAY_MS = 240;
-
 const PreviewZoomOverlay = ({
   open = false,
   display = null,
@@ -233,19 +230,9 @@ const PreviewZoomOverlay = ({
     });
   };
 
-  const pointerTapHandler = usePointerTap({
+  const handleImageClick = (event) => {
-    delay: CLICK_DELAY_MS,
-    onSingle: () => {
-      onClose();
-    },
-    onDouble: ({ clientX, clientY }) => {
-      toggleZoomAtPoint(clientX, clientY);
-    },
-  });
-
-  const handleImagePointerDown = (event) => {
     event.stopPropagation();
-    pointerTapHandler(event);
+    toggleZoomAtPoint(event.clientX ?? 0, event.clientY ?? 0);
   };
 
   if (!renderBackdrop || !activeDisplay?.url || !portalTarget) {
@@ -301,13 +288,13 @@ const PreviewZoomOverlay = ({
       >
       <div
         className={stageClassName}
-        onClick={(event) => event.stopPropagation()}
         onKeyDown={handleKeyDown}
       >
         <div
           className={containerClassName}
           ref={scrollRef}
           tabIndex={-1}
+          onClick={(event) => event.stopPropagation()}
         >
           <img
             src={effectiveDisplay.url}
@@ -321,7 +308,7 @@ const PreviewZoomOverlay = ({
                 height: event.currentTarget.naturalHeight || null,
               });
             }}
-            onPointerDown={handleImagePointerDown}
+            onClick={handleImageClick}
             style={imageStyle}
           />
         </div>