fix window parameter & click behavior cursor bug

Author: jaffrepaul

src/components/docImage.tsx

@@ -16,11 +16,29 @@ export default function DocImage({
     return null;
   }
 
-  // Next.js Image component only supports images from the public folder
-  // or from a remote server with properly configured domain
+  // Handle external images early - pass through without processing
   if (src.startsWith('http')) {
-    // eslint-disable-next-line @next/next/no-img-element
-    return <img src={src} {...props} />;
+    // Use provided props or defaults for external images
+    const width = typeof propsWidth === 'number'
+      ? propsWidth
+      : typeof propsWidth === 'string'
+        ? parseInt(propsWidth, 10) || 800
+        : 800;
+    const height = typeof propsHeight === 'number'
+      ? propsHeight
+      : typeof propsHeight === 'string'
+        ? parseInt(propsHeight, 10) || 600
+        : 600;
+        
+    return (
+      <DocImageClient
+        src={src}
+        imgPath={src} // For external images, imgPath should be the same as src
+        width={width}
+        height={height}
+        {...props}
+      />
+    );
   }
 
   // If the image src is not an absolute URL, we assume it's a relative path

src/components/docImageClient.tsx

@@ -30,11 +30,12 @@ export function DocImageClient({
 
   // For external images or invalid dimensions, fall back to regular img tag
   if (src.startsWith('http') || !isValidDimensions) {
-    const handleClick = (e: React.MouseEvent) => {
-      // If Ctrl/Cmd+click, open image in new tab
-      if (e.ctrlKey || e.metaKey) {
-        window.open(imgPath, '_blank', 'noreferrer');
-        return;
+    const handleClick = () => {
+      // Always open image in new tab
+      const url = src.startsWith('http') ? src : imgPath;
+      const newWindow = window.open(url, '_blank');
+      if (newWindow) {
+        newWindow.opener = null; // Security: prevent opener access
       }
     };
 

src/components/imageLightbox.tsx

@@ -27,7 +27,11 @@ export function ImageLightbox({
   const handleClick = (e: React.MouseEvent) => {
     // If Ctrl/Cmd+click, open image in new tab
     if (e.ctrlKey || e.metaKey) {
-      window.open(imgPath, '_blank', 'noreferrer');
+      const url = src.startsWith('http') ? src : imgPath;
+      const newWindow = window.open(url, '_blank');
+      if (newWindow) {
+        newWindow.opener = null; // Security: prevent opener access
+      }
       return;
     }
     // Normal click - open lightbox