From 3402ea4112205a56f43e9f9f7902fb83484ba7cd Mon Sep 17 00:00:00 2001
From: sepeterson <10458078+sepeterson@users.noreply.github.com>
Date: Tue, 16 Dec 2025 17:00:24 -0600
Subject: [PATCH] MOB-535: hide gradient for group photo view and tweak icon
 drop shadows

---
 .../ObservationsFlashList/ObsImagePreview.tsx       | 13 ++++++++++---
 src/components/PhotoImporter/GroupPhotoImage.js     |  1 +
 2 files changed, 11 insertions(+), 3 deletions(-)

diff --git a/src/components/ObservationsFlashList/ObsImagePreview.tsx b/src/components/ObservationsFlashList/ObsImagePreview.tsx
index de1f505ac..8e5cb1c2a 100644
--- a/src/components/ObservationsFlashList/ObsImagePreview.tsx
+++ b/src/components/ObservationsFlashList/ObsImagePreview.tsx
@@ -11,7 +11,9 @@ import colors from "styles/tailwindColors";
 import ObsImage from "./ObsImage";
 
 const ICON_DROP_SHADOW = getShadow( {
-  offsetHeight: 1
+  offsetHeight: 1,
+  shadowOpacity: 1,
+  shadowRadius: 1
 } );
 
 interface Props extends PropsWithChildren {
@@ -35,6 +37,7 @@ interface Props extends PropsWithChildren {
   useShortGradient?: boolean;
   white?: boolean;
   width?: string;
+  hideGradientOverlay?: boolean;
 }
 
 const ObsImagePreview = ( {
@@ -56,7 +59,8 @@ const ObsImagePreview = ( {
   testID,
   useShortGradient,
   white = false,
-  width = "w-[62px]"
+  width = "w-[62px]",
+  hideGradientOverlay = false
 }: Props ) => {
   const borderRadius = isSmall
     ? "rounded-lg"
@@ -85,6 +89,7 @@ const ObsImagePreview = ( {
               ? "top-1"
               : "bottom-1"
           )}
+          style={ICON_DROP_SHADOW}
         >
           <INatIcon name="photos-outline" color={colors.white} size={16} />
         </View>
@@ -101,6 +106,7 @@ const ObsImagePreview = ( {
             ? "top-0"
             : "bottom-0"
         )}
+        style={ICON_DROP_SHADOW}
       >
         { obsPhotosCount !== 0
           && <PhotoCount count={obsPhotosCount} /> }
@@ -139,6 +145,7 @@ const ObsImagePreview = ( {
   }, [selectable, selected] );
 
   const renderGradient = useCallback( ( ) => {
+    if ( hideGradientOverlay ) return null;
     if ( isSmall ) return null;
     if ( useShortGradient ) {
       return (
@@ -158,7 +165,7 @@ const ObsImagePreview = ( {
         end={{ x: 0, y: 0.75 }}
       />
     );
-  }, [isSmall, useShortGradient] );
+  }, [isSmall, useShortGradient, hideGradientOverlay] );
 
   const renderSoundIcon = useCallback( ( ) => {
     if ( !hasSound ) return null;
diff --git a/src/components/PhotoImporter/GroupPhotoImage.js b/src/components/PhotoImporter/GroupPhotoImage.js
index eea7912b7..f87da1ec9 100644
--- a/src/components/PhotoImporter/GroupPhotoImage.js
+++ b/src/components/PhotoImporter/GroupPhotoImage.js
@@ -37,6 +37,7 @@ const GroupPhotoImage = ( {
         selected={isSelected}
         obsPhotosCount={item.photos.length}
         selectable
+        hideGradientOverlay
       />
     </Pressable>
   );