From ffc8a42a5c51bc32cc8ee3b05b35cbda997f95ca Mon Sep 17 00:00:00 2001
From: Ken-ichi <kenichi.ueda@gmail.com>
Date: Fri, 6 Sep 2024 16:55:36 -0700
Subject: [PATCH] fix: reduce image flickering on Suggestions (#2049)

Stabilizes some of the props to prevent some re-renders.

Closes #1878
---
 .../Suggestions/SuggestionsContainer.tsx           |  5 ++++-
 src/sharedHooks/useLocationPermission.tsx          | 14 +++++++-------
 2 files changed, 11 insertions(+), 8 deletions(-)

diff --git a/src/components/Suggestions/SuggestionsContainer.tsx b/src/components/Suggestions/SuggestionsContainer.tsx
index fd3772198..e53920a18 100644
--- a/src/components/Suggestions/SuggestionsContainer.tsx
+++ b/src/components/Suggestions/SuggestionsContainer.tsx
@@ -129,7 +129,10 @@ const SuggestionsContainer = ( ) => {
   useClearComputerVisionDirectory( );
   const currentObservation = useStore( state => state.currentObservation );
   const innerPhotos = ObservationPhoto.mapInnerPhotos( currentObservation );
-  const photoUris = ObservationPhoto.mapObsPhotoUris( currentObservation );
+  const photoUris = useMemo(
+    () => ObservationPhoto.mapObsPhotoUris( currentObservation ),
+    [currentObservation]
+  );
   const updateObservationKeys = useStore( state => state.updateObservationKeys );
 
   const evidenceHasLocation = !!currentObservation?.latitude;
diff --git a/src/sharedHooks/useLocationPermission.tsx b/src/sharedHooks/useLocationPermission.tsx
index 12cc64290..540fae92b 100644
--- a/src/sharedHooks/useLocationPermission.tsx
+++ b/src/sharedHooks/useLocationPermission.tsx
@@ -72,11 +72,12 @@ const useLocationPermission = ( ) => {
     );
   }, [showPermissionGate] );
 
-  function requestPermissions() {
-    setShowPermissionGate( true );
-  }
+  const requestPermissions = useCallback(
+    ( ) => setShowPermissionGate( true ),
+    []
+  );
 
-  async function checkPermissions() {
+  const checkPermissions = useCallback( async () => {
     const permissionsResult = permissionResultFromMultiple(
       await checkMultiple( LOCATION_PERMISSIONS )
     );
@@ -87,14 +88,13 @@ const useLocationPermission = ( ) => {
       setHasBlockedPermissions( true );
     } else {
       setHasPermissions( false );
-      console.log( "Location permissions have not been granted." );
     }
-  }
+  }, [] );
 
   // Check permissions on mount
   useEffect( () => {
     checkPermissions();
-  }, [] );
+  }, [checkPermissions] );
 
   return {
     hasPermissions,