From 984121d6823a17245a5aab30a099eca2764c67fd Mon Sep 17 00:00:00 2001
From: Mary Hipp <maryhipp@Marys-MacBook-Air.local>
Date: Wed, 5 Jul 2023 10:47:20 -0400
Subject: [PATCH] only show delete icon if big enough

---
 .../web/src/features/gallery/components/GalleryImage.tsx | 9 +++++++--
 1 file changed, 7 insertions(+), 2 deletions(-)

diff --git a/invokeai/frontend/web/src/features/gallery/components/GalleryImage.tsx b/invokeai/frontend/web/src/features/gallery/components/GalleryImage.tsx
index ea0b3b0fd8..41c536759a 100644
--- a/invokeai/frontend/web/src/features/gallery/components/GalleryImage.tsx
+++ b/invokeai/frontend/web/src/features/gallery/components/GalleryImage.tsx
@@ -23,9 +23,11 @@ export const makeSelector = (image_name: string) =>
     ({ gallery }) => {
       const isSelected = gallery.selection.includes(image_name);
       const selectionCount = gallery.selection.length;
+      const galleryImageMinimumWidth = gallery.galleryImageMinimumWidth;
       return {
         isSelected,
         selectionCount,
+        galleryImageMinimumWidth,
       };
     },
     defaultSelectorOptions
@@ -44,7 +46,8 @@ const GalleryImage = (props: HoverableImageProps) => {
 
   const localSelector = useMemo(() => makeSelector(image_name), [image_name]);
 
-  const { isSelected, selectionCount } = useAppSelector(localSelector);
+  const { isSelected, selectionCount, galleryImageMinimumWidth } =
+    useAppSelector(localSelector);
 
   const dispatch = useAppDispatch();
 
@@ -113,7 +116,9 @@ const GalleryImage = (props: HoverableImageProps) => {
               draggableData={draggableData}
               isSelected={isSelected}
               minSize={0}
-              onClickReset={handleDelete}
+              onClickReset={
+                galleryImageMinimumWidth > 60 ? handleDelete : undefined
+              }
               resetIcon={<FaTrash />}
               resetTooltip="Delete image"
               imageSx={{ w: 'full', h: 'full' }}