Finished the profile and fixed the avatar when change the user profile

app/containers/Avatar/index.tsx

@@ -26,8 +26,9 @@ const AvatarContainer = ({
 	getCustomEmoji,
 	isStatic,
 	rid,
-	handleEdit
-}: IAvatar & { handleEdit?: () => void }): React.ReactElement => {
+	handleEdit,
+	isUserProfile
+}: IAvatar & { isUserProfile?: boolean; handleEdit?: () => void }): React.ReactElement => {
 	const subscription = useRef<Subscription>();
 	const [avatarETag, setAvatarETag] = useState<string | undefined>('');
 	const { colors } = useTheme();
@@ -36,10 +37,11 @@ const AvatarContainer = ({
 
 	const server = useSelector((state: IApplicationState) => state.share.server.server || state.server.server);
 	const serverVersion = useSelector((state: IApplicationState) => state.share.server.version || state.server.version);
-	const { id, token } = useSelector(
+	const { id, token, avatarETagUser } = useSelector(
 		(state: IApplicationState) => ({
 			id: getUserSelector(state).id,
-			token: getUserSelector(state).token
+			token: getUserSelector(state).token,
+			avatarETagUser: getUserSelector(state).avatarETag
 		}),
 		shallowEqual
 	);
@@ -110,7 +112,7 @@ const AvatarContainer = ({
 				rid={rid}
 				blockUnauthenticatedAccess={blockUnauthenticatedAccess}
 				externalProviderUrl={externalProviderUrl}
-				avatarETag={avatarETag}
+				avatarETag={isUserProfile ? avatarETagUser : avatarETag}
 				serverVersion={serverVersion}
 			/>
 			{handleEdit ? (

app/lib/methods/subscriptions/rooms.ts

@@ -288,7 +288,7 @@ export default function subscribeRooms() {
 		const [type, data] = ddpMessage.fields.args;
 		const [, ev] = ddpMessage.fields.eventName.split('/');
 		if (/userData/.test(ev)) {
-			const [{ diff }] = ddpMessage.fields.args;
+			const [{ diff, unset }] = ddpMessage.fields.args;
 			if (diff?.statusLivechat) {
 				store.dispatch(setUser({ statusLivechat: diff.statusLivechat }));
 			}
@@ -298,6 +298,12 @@ export default function subscribeRooms() {
 			if ((['settings.preferences.alsoSendThreadToChannel'] as any) in diff) {
 				store.dispatch(setUser({ alsoSendThreadToChannel: diff['settings.preferences.alsoSendThreadToChannel'] }));
 			}
+			if (diff?.avatarETag) {
+				store.dispatch(setUser({ avatarETag: diff.avatarETag }));
+			}
+			if (unset?.avatarETag) {
+				store.dispatch(setUser({ avatarETag: '' }));
+			}
 		}
 		if (/subscriptions/.test(ev)) {
 			if (type === 'removed') {

app/views/ChangeAvatarView/index.tsx

@@ -158,11 +158,17 @@ const ChangeAvatarView = () => {
 					{...scrollPersistTaps}
 				>
 					<View style={styles.avatarContainer} testID='change-avatar-view-avatar'>
-						<Avatar text={textAvatar || user.username} avatar={avatar?.url} isStatic={avatar?.url} size={100} />
+						<Avatar
+							text={textAvatar || user.username}
+							avatar={avatar?.url}
+							isStatic={avatar?.url}
+							size={100}
+							isUserProfile={fromUser}
+						/>
 					</View>
 					<AvatarUrl submit={value => setAvatar({ url: value, data: value, service: 'url' })} />
 					<List.Separator style={styles.separator} />
-					{fromUser && avatarSuggestions.length ? (
+					{fromUser ? (
 						<AvatarSuggestion resetAvatar={resetAvatar} user={user} onPress={setAvatar} avatarSuggestions={avatarSuggestions} />
 					) : null}
 

app/views/ProfileView/index.tsx

@@ -413,8 +413,10 @@ class ProfileView extends React.Component<IProfileViewProps, IProfileViewState>
 						<View style={styles.avatarContainer} testID='profile-view-avatar'>
 							<Avatar
 								text={user.username}
+								avatarETag={user.avatarETag}
 								size={100}
 								handleEdit={Accounts_AllowUserAvatarChange ? this.handleEditAvatar : undefined}
+								isUserProfile
 							/>
 						</View>
 						<FormTextInput

app/views/SidebarView/index.tsx

@@ -251,7 +251,7 @@ class Sidebar extends Component<ISidebarProps, ISidebarState> {
 				>
 					<TouchableWithoutFeedback onPress={this.onPressUser} testID='sidebar-close-drawer'>
 						<View style={styles.header}>
-							<Avatar text={user.username} style={styles.avatar} size={30} />
+							<Avatar text={user.username} style={styles.avatar} size={30} isUserProfile />
 							<View style={styles.headerTextContainer}>
 								<View style={styles.headerUsername}>
 									<Text numberOfLines={1} style={[styles.username, { color: themes[theme!].titleText }]}>