Merge pull request #26 from Bilb/fix-avatar-memoized-between-pubkey

fix: avatar does not reset when moving to a convo without one

ts/components/avatar/Avatar.tsx

@@ -145,6 +145,7 @@ const AvatarInner = (props: Props) => {
   const hasImage = (base64Data || urlToLoad) && !imageBroken && !isClosedGroup;
 
   const isClickable = !!onAvatarClick;
+
   return (
     <div
       className={classNames(

ts/components/conversation/Image.tsx

@@ -9,11 +9,7 @@ import { Spinner } from '../loading';
 import { MessageGenericAttachment } from './message/message-content/MessageGenericAttachment';
 import { useEncryptedFileFetch } from '../../hooks/useEncryptedFileFetch';
 import { useMessageIdFromContext } from '../../contexts/MessageIdContext';
-import {
-  useMessageDirection,
-  useMessageSelected,
-  useMessageTimestamp,
-} from '../../state/selectors';
+import { useMessageDirection, useMessageSelected } from '../../state/selectors';
 import { AriaLabels } from '../../util/hardcodedAriaLabels';
 
 type Props = {
@@ -76,16 +72,9 @@ export const Image = (props: Props) => {
   const messageId = useMessageIdFromContext();
   const dropShadow = useMessageSelected(messageId);
   const direction = useMessageDirection(messageId);
-  /** used for debugging */
-  const timestamp = useMessageTimestamp(messageId);
 
   const disableDrag = useDisableDrag();
-  const { loading, urlToLoad } = useEncryptedFileFetch(
-    url,
-    attachment.contentType,
-    false,
-    timestamp
-  );
+  const { loading, urlToLoad } = useEncryptedFileFetch(url, attachment.contentType, false);
 
   const { caption } = attachment || { caption: null };
   const [pending, setPending] = useState<boolean>(attachment.pending || true);

ts/hooks/useEncryptedFileFetch.ts

@@ -1,14 +1,12 @@
 import { useCallback, useEffect, useState } from 'react';
 
 import { DecryptedAttachmentsManager } from '../session/crypto/DecryptedAttachmentsManager';
-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
+  isAvatar: boolean
 ) => {
   /** undefined if the attachment is not decrypted yet, '' if the attachment fails to decrypt */
   const [urlToLoad, setUrlToLoad] = useState<string | undefined>(undefined);
@@ -19,26 +17,15 @@ export const useEncryptedFileFetch = (
   const fetchUrl = useCallback(
     async (mediaUrl: string | undefined) => {
       if (alreadyDecrypted || !mediaUrl) {
-        if (alreadyDecrypted) {
-          setUrlToLoad(alreadyDecrypted);
-          setLoading(false);
-        }
+        setUrlToLoad(alreadyDecrypted || '');
+        setLoading(false);
         return;
       }
 
       setLoading(true);
 
       try {
-        perfStart(`getDecryptedMediaUrl-${mediaUrl}-${timestamp}`);
-        const decryptedUrl = await DecryptedAttachmentsManager.getDecryptedMediaUrl(
-          mediaUrl,
-          contentType,
-          isAvatar
-        );
-        perfEnd(
-          `getDecryptedMediaUrl-${mediaUrl}-${timestamp}`,
-          `getDecryptedMediaUrl-${mediaUrl}-${timestamp}`
-        );
+        const decryptedUrl = await DecryptedAttachmentsManager.getDecryptedMediaUrl(mediaUrl, contentType, isAvatar);
         setUrlToLoad(decryptedUrl);
       } catch (error) {
         setUrlToLoad('');
@@ -46,7 +33,7 @@ export const useEncryptedFileFetch = (
         setLoading(false);
       }
     },
-    [alreadyDecrypted, contentType, isAvatar, timestamp]
+    [alreadyDecrypted, contentType, isAvatar]
   );
 
   useEffect(() => {