From 340361f2d9d0502d3b0f08e1f8c31474a344a682 Mon Sep 17 00:00:00 2001
From: yougotwill <willmgrant@gmail.com>
Date: Tue, 20 Aug 2024 11:13:55 +1000
Subject: [PATCH] fix: cleanup

---
 ts/components/conversation/Image.tsx | 17 +++++------------
 ts/hooks/useEncryptedFileFetch.ts    | 16 ++++++----------
 2 files changed, 11 insertions(+), 22 deletions(-)

diff --git a/ts/components/conversation/Image.tsx b/ts/components/conversation/Image.tsx
index bfee52c74..b66c3ca4d 100644
--- a/ts/components/conversation/Image.tsx
+++ b/ts/components/conversation/Image.tsx
@@ -13,7 +13,8 @@ import { useEncryptedFileFetch } from '../../hooks/useEncryptedFileFetch';
 type Props = {
   alt: string;
   attachment: AttachmentTypeWithPath | AttachmentType;
-  url: string | undefined; // url is undefined if the message is not visible yet
+  /** undefined if the message is not visible yet, '' if the attachment is broken */
+  url: string | undefined;
   imageBroken?: boolean;
 
   height?: number | string;
@@ -36,6 +37,7 @@ type Props = {
   onClickClose?: (attachment: AttachmentTypeWithPath | AttachmentType) => void;
   onError?: () => void;
 
+  /** used for debugging */
   timestamp?: number;
 };
 
@@ -104,27 +106,18 @@ export const Image = (props: Props) => {
     if (mounted && url === '') {
       setPending(false);
       onErrorUrlFilterering();
-      window.log.debug(
-        `WIP: [Image] timestamp ${timestamp} fail  url ${url !== '' ? url : 'empty'} urlToLoad ${urlToLoad !== '' ? urlToLoad : 'empty'} loading ${loading} pending ${pending} imageBroken ${imageBroken}`
-      );
     }
 
     if (mounted && imageBroken && urlToLoad === '') {
       setPending(false);
       onErrorUrlFilterering();
-      window.log.debug(
-        `WIP: [Image] timestamp ${timestamp} fail  url ${url !== '' ? url : 'empty'} urlToLoad ${urlToLoad !== '' ? urlToLoad : 'empty'} loading ${loading} pending ${pending} imageBroken ${imageBroken}`
-      );
     }
 
     if (url) {
       setPending(false);
       setMounted(!loading && !pending);
-      window.log.debug(
-        `WIP: [Image] timestamp ${timestamp} success  url ${url !== '' ? url : 'empty'} urlToLoad ${urlToLoad !== '' ? urlToLoad : 'empty'} loading ${loading} pending ${pending} imageBroken ${imageBroken}`
-      );
     }
-  }, [imageBroken, loading, mounted, onErrorUrlFilterering, pending, timestamp, url, urlToLoad]);
+  }, [imageBroken, loading, mounted, onErrorUrlFilterering, pending, url, urlToLoad]);
 
   if (mounted && imageBroken) {
     return (
@@ -220,7 +213,7 @@ export const Image = (props: Props) => {
           className="module-image__close-button"
         />
       ) : null}
-      {!pending && playIconOverlay ? (
+      {mounted && playIconOverlay ? (
         <div className="module-image__play-overlay__circle">
           <div className="module-image__play-overlay__icon" />
         </div>
diff --git a/ts/hooks/useEncryptedFileFetch.ts b/ts/hooks/useEncryptedFileFetch.ts
index 701143abb..19af3af17 100644
--- a/ts/hooks/useEncryptedFileFetch.ts
+++ b/ts/hooks/useEncryptedFileFetch.ts
@@ -7,11 +7,13 @@ import {
 import { perfEnd, perfStart } from '../session/utils/Performance';
 
 export const useEncryptedFileFetch = (
+  /** undefined if the message is not visible yet, url is '' if something is broken */
   url: string | undefined,
   contentType: string,
   isAvatar: boolean,
   timestamp?: number
 ) => {
+  /** undefined if the attachment is not decrypted yet, '' if the attachment fails to decrypt */
   const [urlToLoad, setUrlToLoad] = useState<string | undefined>(undefined);
   const [loading, setLoading] = useState(true);
 
@@ -20,10 +22,6 @@ export const useEncryptedFileFetch = (
   const fetchUrl = useCallback(
     async (mediaUrl: string | undefined) => {
       if (alreadyDecrypted || !mediaUrl) {
-        window.log.debug(
-          `WIP: [Image] timestamp ${timestamp} alreadyDecrypted ${alreadyDecrypted !== '' ? alreadyDecrypted : 'empty'} mediaUrl ${mediaUrl !== '' ? mediaUrl : 'empty'}`
-        );
-
         if (alreadyDecrypted) {
           setUrlToLoad(alreadyDecrypted);
           setLoading(false);
@@ -34,16 +32,14 @@ export const useEncryptedFileFetch = (
       setLoading(true);
 
       try {
-        perfStart(`getDecryptedMediaUrl-${mediaUrl}`);
+        perfStart(`getDecryptedMediaUrl-${mediaUrl}-${timestamp}`);
         const decryptedUrl = await getDecryptedMediaUrl(mediaUrl, contentType, isAvatar);
-        perfEnd(`getDecryptedMediaUrl-${mediaUrl}`, `getDecryptedMediaUrl-${mediaUrl}`);
-        window.log.debug(
-          `WIP: [Image] timestamp ${timestamp} decryptedUrl ${decryptedUrl !== '' ? decryptedUrl : 'empty'}`
+        perfEnd(
+          `getDecryptedMediaUrl-${mediaUrl}-${timestamp}`,
+          `getDecryptedMediaUrl-${mediaUrl}-${timestamp}`
         );
-
         setUrlToLoad(decryptedUrl);
       } catch (error) {
-        window.log.error(`WIP: [Image] timestamp ${timestamp} error ${error}`);
         setUrlToLoad('');
       } finally {
         setLoading(false);