From 6f924a7bb19c7480d558bbbba164dbb1cfc8dfe8 Mon Sep 17 00:00:00 2001
From: carlobortolan <carlobortolan@gmail.com>
Date: Sat, 25 Jan 2025 21:52:36 +0100
Subject: [PATCH] Move ImageActions component from ImageLarge.tsx to
 PhotoLarge.tsx and revert ImageProps

---
 src/components/image/ImageLarge.tsx | 21 +++++++--------------
 src/components/image/index.ts       |  1 -
 src/photo/PhotoLarge.tsx            | 27 ++++++++++++++++-----------
 3 files changed, 23 insertions(+), 26 deletions(-)

diff --git a/src/components/image/ImageLarge.tsx b/src/components/image/ImageLarge.tsx
index 6e178bcb..339e9ba9 100644
--- a/src/components/image/ImageLarge.tsx
+++ b/src/components/image/ImageLarge.tsx
@@ -1,25 +1,18 @@
 import { IMAGE_WIDTH_LARGE, ImageProps } from '.';
 import ImageWithFallback from './ImageWithFallback';
-import ImageActions from './ImageActions';
 
 export default function ImageLarge(props: ImageProps) {
   const {
     aspectRatio,
     blurCompatibilityMode,
-    enableImageActions = false,
     ...rest
   } = props;
   return (
-    <ImageActions
-      enableImageActions={enableImageActions}
-      className="flex relative items-center justify-center h-full"
-    >
-      <ImageWithFallback {...{
-        ...rest,
-        blurCompatibilityLevel: blurCompatibilityMode ? 'high' : 'none',
-        width: IMAGE_WIDTH_LARGE,
-        height: Math.round(IMAGE_WIDTH_LARGE / aspectRatio),
-      }} />
-    </ImageActions>
+    <ImageWithFallback {...{
+      ...rest,
+      blurCompatibilityLevel: blurCompatibilityMode ? 'high' : 'none',
+      width: IMAGE_WIDTH_LARGE,
+      height: Math.round(IMAGE_WIDTH_LARGE / aspectRatio),
+    }} />
   );
-};
+};
\ No newline at end of file
diff --git a/src/components/image/index.ts b/src/components/image/index.ts
index 8a46d1ac..eb7d6582 100644
--- a/src/components/image/index.ts
+++ b/src/components/image/index.ts
@@ -14,5 +14,4 @@ export interface ImageProps {
   alt: string
   blurDataURL?: string
   priority?: boolean
-  enableImageActions?: boolean
 }
diff --git a/src/photo/PhotoLarge.tsx b/src/photo/PhotoLarge.tsx
index 9bb49d1b..32702d94 100644
--- a/src/photo/PhotoLarge.tsx
+++ b/src/photo/PhotoLarge.tsx
@@ -36,6 +36,7 @@ import { useRef } from 'react';
 import useOnVisible from '@/utility/useOnVisible';
 import PhotoDate from './PhotoDate';
 import { useAppState } from '@/state/AppState';
+import ImageActions from '@/components/image/ImageActions';
 
 export default function PhotoLarge({
   photo,
@@ -136,18 +137,22 @@ export default function PhotoLarge({
               ? 'h-[80%]'
               : 'h-[90%]',
           )}>
-            <ImageLarge
-              className={clsx(arePhotosMatted && 'h-full')}
-              imgClassName={clsx(arePhotosMatted &&
-                'object-contain w-full h-full')}
-              alt={altTextForPhoto(photo)}
-              src={photo.url}
-              aspectRatio={photo.aspectRatio}
-              blurDataURL={photo.blurData}
-              blurCompatibilityMode={doesPhotoNeedBlurCompatibility(photo)}
-              priority={priority}
+            <ImageActions
               enableImageActions={enableImageActions}
-            />
+              className="flex relative items-center justify-center h-full"
+            >
+              <ImageLarge
+                className={clsx(arePhotosMatted && 'h-full')}
+                imgClassName={clsx(arePhotosMatted &&
+                'object-contain w-full h-full')}
+                alt={altTextForPhoto(photo)}
+                src={photo.url}
+                aspectRatio={photo.aspectRatio}
+                blurDataURL={photo.blurData}
+                blurCompatibilityMode={doesPhotoNeedBlurCompatibility(photo)}
+                priority={priority}
+              />
+            </ImageActions>
           </div>
         </Link>}
       contentSide={