From 0ad0524a0e29024a8641235a5d400aeb707e93f4 Mon Sep 17 00:00:00 2001
From: DomW <domw30@gmail.com>
Date: Fri, 13 Sep 2024 11:44:22 +0100
Subject: [PATCH] fix(messenger-feed): resolve unnecessary image reloads by
 memoizing functions in media rendering (#2278)

---
 src/components/messenger/feed/components/post/index.tsx | 8 ++++----
 1 file changed, 4 insertions(+), 4 deletions(-)

diff --git a/src/components/messenger/feed/components/post/index.tsx b/src/components/messenger/feed/components/post/index.tsx
index b6564c130..a6903bfd6 100644
--- a/src/components/messenger/feed/components/post/index.tsx
+++ b/src/components/messenger/feed/components/post/index.tsx
@@ -43,11 +43,11 @@ export const Post = ({
     [text]
   );
 
-  const handleImageLoad = (event: React.SyntheticEvent<HTMLImageElement>) => {
+  const handleImageLoad = useCallback((event: React.SyntheticEvent<HTMLImageElement>) => {
     const { naturalWidth: width, naturalHeight: height } = event.currentTarget;
     handleMediaAspectRatio(width, height);
     setIsImageLoaded(true);
-  };
+  }, []);
 
   const handleMediaAspectRatio = (width: number, height: number) => {
     const aspectRatio = width / height;
@@ -72,11 +72,11 @@ export const Post = ({
     return { width: finalWidth, height: finalHeight };
   };
 
-  const getPlaceholderDimensions = (w: number, h: number) => {
+  const getPlaceholderDimensions = useCallback((w: number, h: number) => {
     const maxWidth = 420;
     const maxHeight = 520;
     return handlePlaceholderAspectRatio(w, h, maxWidth, maxHeight);
-  };
+  }, []);
 
   const renderMedia = useCallback(
     (media) => {