fix the delete from rooms and finished RoomInfoView, missing RoomInfoEditView

app/containers/Avatar/index.tsx

@@ -31,6 +31,7 @@ const AvatarContainer = ({
 }: IAvatar & { isUserProfile?: boolean; handleEdit?: () => void }): React.ReactElement => {
 	const subscription = useRef<Subscription>();
 	const [avatarETag, setAvatarETag] = useState<string | undefined>('');
+	const previousAvatarEtag = useRef<string | undefined>('');
 	const { colors } = useTheme();
 
 	const isDirect = () => type === 'd';
@@ -82,7 +83,7 @@ const AvatarContainer = ({
 	};
 
 	useEffect(() => {
-		if (!avatarETag) {
+		if (!avatarETag || avatarETag !== previousAvatarEtag.current) {
 			init();
 		}
 		return () => {
@@ -92,6 +93,10 @@ const AvatarContainer = ({
 		};
 	}, [text, type, size, avatarETag, externalProviderUrl]);
 
+	useEffect(() => {
+		previousAvatarEtag.current = avatarETag;
+	}, [avatarETag]);
+
 	return (
 		<>
 			<Avatar

app/definitions/IProfile.ts

@@ -17,7 +17,7 @@ export interface IAvatarButton {
 }
 
 export interface IAvatar {
-	data: {} | string | null;
+	data: string | null;
 	url?: string;
 	contentType?: string;
 	service?: any;

app/lib/services/restApi.ts

@@ -553,7 +553,7 @@ export const saveRoomSettings = (
 	rid: string,
 	params: {
 		roomName?: string;
-		roomAvatar?: string;
+		roomAvatar?: string | null;
 		roomDescription?: string;
 		roomTopic?: string;
 		roomAnnouncement?: string;

app/stacks/types.ts

@@ -183,6 +183,8 @@ export type ChatsStackParamList = {
 	ChangeAvatarView: {
 		fromUser?: boolean;
 		titleHeader?: string;
+		room?: ISubscription;
+		t?: SubscriptionType;
 	};
 };
 
@@ -201,6 +203,8 @@ export type ProfileStackParamList = {
 	ChangeAvatarView: {
 		fromUser?: boolean;
 		titleHeader?: string;
+		room?: ISubscription;
+		t?: SubscriptionType;
 	};
 };
 

app/views/ChangeAvatarView/index.tsx

@@ -39,7 +39,7 @@ const ChangeAvatarView = () => {
 	const avatarUrl = useRef<string | undefined>('');
 
 	const navigation = useNavigation<StackNavigationProp<ChatsStackParamList, 'ChangeAvatarView'>>();
-	const { fromUser, titleHeader } = useRoute<RouteProp<ChatsStackParamList, 'ChangeAvatarView'>>().params;
+	const { fromUser, titleHeader, room, t } = useRoute<RouteProp<ChatsStackParamList, 'ChangeAvatarView'>>().params;
 
 	useLayoutEffect(() => {
 		navigation.setOptions({
@@ -72,6 +72,21 @@ const ChangeAvatarView = () => {
 	};
 
 	const submit = async () => {
+		if (!fromUser && room?.rid) {
+			try {
+				setSaving(true);
+				await Services.saveRoomSettings(room.rid, { roomAvatar: avatar?.data });
+				setSaving(false);
+				avatarUrl.current = '';
+				return navigation.goBack();
+			} catch (e) {
+				log(e);
+				setSaving(false);
+				return handleError(e, 'setAvatarFromService', 'changing_avatar');
+			}
+		}
+
+		// Change Users Avatar
 		if (avatar?.url) {
 			try {
 				setSaving(true);
@@ -107,9 +122,8 @@ const ChangeAvatarView = () => {
 	};
 
 	const resetRoomAvatar = () => {
-		setAvatar(undefined);
-
-		// await Services.saveRoomSettings(room.rid, params);
+		setAvatar({ data: null });
+		avatarUrl.current = 'resetRoomAvatar';
 	};
 
 	const pickImage = async () => {
@@ -130,6 +144,8 @@ const ChangeAvatarView = () => {
 		}
 	};
 
+	const ridProps = avatarUrl.current !== 'resetRoomAvatar' ? { rid: room?.rid } : {};
+
 	return (
 		<KeyboardView
 			style={{ backgroundColor: colors.auxiliaryBackground }}
@@ -145,11 +161,13 @@ const ChangeAvatarView = () => {
 				>
 					<View style={styles.avatarContainer} testID='change-avatar-view-avatar'>
 						<Avatar
-							text={textAvatar || user.username}
+							text={room?.name || textAvatar || user.username}
 							avatar={avatar?.url}
 							isStatic={avatar?.url}
 							size={100}
 							isUserProfile={fromUser}
+							type={t}
+							{...ridProps}
 						/>
 					</View>
 					{fromUser ? <AvatarUrl submit={value => setAvatar({ url: value, data: value, service: 'url' })} /> : null}

app/views/RoomInfoView/index.tsx

@@ -402,7 +402,8 @@ class RoomInfoView extends React.Component<IRoomInfoViewProps, IRoomInfoViewStat
 
 	handleEditAvatar = () => {
 		const {navigation} = this.props
-		navigation.navigate("ChangeAvatarView",{titleHeader:I18n.t('Room_Info')})
+		const { room } = this.state;
+		navigation.navigate('ChangeAvatarView', { titleHeader: I18n.t('Room_Info'), room, t: this.t });
 	}
 
 	renderAvatar = (room: ISubscription, roomUser: IUserParsed) => {