Fix save profile avatar disappearing on save name/bio

Co-authored-by: Jamie Kyle <113370520+jamiebuilds-signal@users.noreply.github.com>

ts/components/ProfileEditor.tsx

@@ -7,7 +7,7 @@ import type { AvatarColorType } from '../types/Colors';
 import { AvatarColors } from '../types/Colors';
 import type {
   AvatarDataType,
-  AvatarUpdateType,
+  AvatarUpdateOptionsType,
   DeleteAvatarFromDiskActionType,
   ReplaceAvatarActionType,
   SaveAvatarToDiskActionType,
@@ -59,7 +59,7 @@ type PropsExternalType = {
   onEditStateChanged: (editState: EditState) => unknown;
   onProfileChanged: (
     profileData: ProfileDataType,
-    avatar: AvatarUpdateType
+    avatarUpdateOptions: AvatarUpdateOptionsType
   ) => unknown;
   renderEditUsernameModalBody: (props: {
     isRootModal: boolean;
@@ -199,9 +199,6 @@ export function ProfileEditor({
   const [avatarBuffer, setAvatarBuffer] = useState<Uint8Array | undefined>(
     undefined
   );
-  const [isLoadingAvatar, setIsLoadingAvatar] = useState(
-    Boolean(profileAvatarPath)
-  );
   const [stagedProfile, setStagedProfile] = useState<ProfileDataType>({
     aboutEmoji,
     aboutText,
@@ -252,7 +249,10 @@ export function ProfileEditor({
             ? trim(stagedProfile.familyName)
             : undefined,
         },
-        { oldAvatar: oldAvatarBuffer, newAvatar: avatar }
+        {
+          keepAvatar: false,
+          avatarUpdate: { oldAvatar: oldAvatarBuffer, newAvatar: avatar },
+        }
       );
       setOldAvatarBuffer(avatar);
     },
@@ -289,9 +289,8 @@ export function ProfileEditor({
     avatar => {
       setAvatarBuffer(avatar);
       setOldAvatarBuffer(avatar);
-      setIsLoadingAvatar(false);
     },
-    [setAvatarBuffer, setOldAvatarBuffer, setIsLoadingAvatar]
+    [setAvatarBuffer, setOldAvatarBuffer]
   );
 
   let content: JSX.Element;
@@ -387,10 +386,7 @@ export function ProfileEditor({
                 familyName: stagedProfile.familyName,
               });
 
-              onProfileChanged(stagedProfile, {
-                oldAvatar: oldAvatarBuffer,
-                newAvatar: avatarBuffer,
-              });
+              onProfileChanged(stagedProfile, { keepAvatar: true });
               handleBack();
             }}
           >
@@ -401,9 +397,8 @@ export function ProfileEditor({
     );
   } else if (editState === EditState.Bio) {
     const shouldDisableSave =
-      isLoadingAvatar ||
-      (stagedProfile.aboutText === fullBio.aboutText &&
-        stagedProfile.aboutEmoji === fullBio.aboutEmoji);
+      stagedProfile.aboutText === fullBio.aboutText &&
+      stagedProfile.aboutEmoji === fullBio.aboutEmoji;
 
     const defaultBios = getDefaultBios(i18n);
 
@@ -505,10 +500,7 @@ export function ProfileEditor({
                 aboutText: stagedProfile.aboutText,
               });
 
-              onProfileChanged(stagedProfile, {
-                oldAvatar: oldAvatarBuffer,
-                newAvatar: avatarBuffer,
-              });
+              onProfileChanged(stagedProfile, { keepAvatar: true });
               handleBack();
             }}
           >

ts/components/ProfileEditorModal.tsx

@@ -7,7 +7,7 @@ import { ConfirmationDialog } from './ConfirmationDialog';
 import type { PropsType as ProfileEditorPropsType } from './ProfileEditor';
 import { ProfileEditor, EditState } from './ProfileEditor';
 import type { ProfileDataType } from '../state/ducks/conversations';
-import type { AvatarUpdateType } from '../types/Avatar';
+import type { AvatarUpdateOptionsType } from '../types/Avatar';
 
 export type PropsDataType = {
   hasError: boolean;
@@ -16,7 +16,7 @@ export type PropsDataType = {
 type PropsType = {
   myProfileChanged: (
     profileData: ProfileDataType,
-    avatar: AvatarUpdateType
+    avatarUpdateOptions: AvatarUpdateOptionsType
   ) => unknown;
   toggleProfileEditor: () => unknown;
   toggleProfileEditorHasError: () => unknown;

ts/services/writeProfile.ts

@@ -13,22 +13,15 @@ import { strictAssert } from '../util/assert';
 import { isWhitespace } from '../util/whitespaceStringUtil';
 import { imagePathToBytes } from '../util/imagePathToBytes';
 import { getAbsoluteProfileAvatarPath } from '../util/avatarUtils';
-import type { AvatarUpdateType } from '../types/Avatar';
+import type {
+  AvatarUpdateOptionsType,
+  AvatarUpdateType,
+} from '../types/Avatar';
 import MessageSender from '../textsecure/SendMessage';
 
-export type WriteProfileOptionsType = Readonly<
-  | {
-      keepAvatar: true;
-    }
-  | {
-      keepAvatar?: false;
-      avatarUpdate: AvatarUpdateType;
-    }
->;
-
 export async function writeProfile(
   conversation: ConversationType,
-  options: WriteProfileOptionsType
+  options: AvatarUpdateOptionsType
 ): Promise<void> {
   const { server } = window.textsecure;
   if (!server) {

ts/state/ducks/conversations.ts

@@ -92,7 +92,10 @@ import {
   getMessagesByConversation,
 } from '../selectors/conversations';
 import { getIntl } from '../selectors/user';
-import type { AvatarDataType, AvatarUpdateType } from '../../types/Avatar';
+import type {
+  AvatarDataType,
+  AvatarUpdateOptionsType,
+} from '../../types/Avatar';
 import { getDefaultAvatars } from '../../types/Avatar';
 import { getAvatarData } from '../../util/getAvatarData';
 import { isSameAvatarData } from '../../util/isSameAvatarData';
@@ -2051,7 +2054,7 @@ function saveAvatarToDisk(
 
 function myProfileChanged(
   profileData: ProfileDataType,
-  avatarUpdate: AvatarUpdateType
+  avatarUpdateOptions: AvatarUpdateOptionsType
 ): ThunkAction<
   void,
   RootStateType,
@@ -2067,9 +2070,7 @@ function myProfileChanged(
           ...conversation,
           ...profileData,
         },
-        {
-          avatarUpdate,
-        }
+        avatarUpdateOptions
       );
 
       // writeProfile above updates the backbone model which in turn updates

ts/types/Avatar.ts

@@ -76,6 +76,16 @@ export type AvatarUpdateType = Readonly<{
   newAvatar: Uint8Array | undefined;
 }>;
 
+export type AvatarUpdateOptionsType = Readonly<
+  | {
+      keepAvatar: false;
+      avatarUpdate: AvatarUpdateType;
+    }
+  | {
+      keepAvatar: true;
+    }
+>;
+
 const groupIconColors = [
   'A180',
   'A120',