diff --git a/app/views/ChangeAvatarView/AvatarSuggestion.tsx b/app/views/ChangeAvatarView/AvatarSuggestion.tsx index f0047099f..ab2447f1d 100644 --- a/app/views/ChangeAvatarView/AvatarSuggestion.tsx +++ b/app/views/ChangeAvatarView/AvatarSuggestion.tsx @@ -1,10 +1,10 @@ -import React from 'react'; +import React, { useState, useEffect } from 'react'; import { Text, View, TouchableOpacity } from 'react-native'; import { IAvatar, IUser } from '../../definitions'; +import { Services } from '../../lib/services'; import I18n from '../../i18n'; import Avatar from '../../containers/Avatar'; -// import Touch from '../../containers/Touch'; import styles from './styles'; import { useTheme } from '../../theme'; @@ -23,25 +23,45 @@ const Item = ({ item, onPress, text }: { item?: IAvatar; onPress: (value?: IAvat ); }; const AvatarSuggestion = ({ - avatarSuggestions, onPress, user, resetAvatar }: { - avatarSuggestions: IAvatar[]; onPress: (value?: IAvatar) => void; user?: IUser; resetAvatar?: () => void; -}) => ( - - {I18n.t('Images_uploaded')} - - {user?.username && resetAvatar ? : null} - {avatarSuggestions.slice(0, 7).map(item => ( - - ))} +}) => { + const [avatarSuggestions, setAvatarSuggestions] = useState([]); + + const getAvatarSuggestion = async () => { + const result = await Services.getAvatarSuggestion(); + const suggestions = Object.keys(result).map(service => { + const { url, blob, contentType } = result[service]; + return { + url, + data: blob, + service, + contentType + }; + }); + setAvatarSuggestions(suggestions); + }; + + useEffect(() => { + getAvatarSuggestion(); + }, []); + + return ( + + {I18n.t('Images_uploaded')} + + {user?.username && resetAvatar ? : null} + {avatarSuggestions.slice(0, 7).map(item => ( + + ))} + - -); + ); +}; export default AvatarSuggestion; diff --git a/app/views/ChangeAvatarView/index.tsx b/app/views/ChangeAvatarView/index.tsx index 5719c6a22..afdd2b53d 100644 --- a/app/views/ChangeAvatarView/index.tsx +++ b/app/views/ChangeAvatarView/index.tsx @@ -27,7 +27,7 @@ import log from '../../lib/methods/helpers/log'; const ChangeAvatarView = () => { const [avatar, setAvatarState] = useState(); - const [avatarSuggestions, setAvatarSuggestions] = useState([]); + const [textAvatar, setTextAvatar] = useState(''); const [saving, setSaving] = useState(false); const { colors } = useTheme(); @@ -66,26 +66,6 @@ const ChangeAvatarView = () => { }); }, [navigation]); - const getAvatarSuggestion = async () => { - const result = await Services.getAvatarSuggestion(); - const suggestions = Object.keys(result).map(service => { - const { url, blob, contentType } = result[service]; - return { - url, - data: blob, - service, - contentType - }; - }); - setAvatarSuggestions(suggestions); - }; - - useEffect(() => { - if (fromUser) { - getAvatarSuggestion(); - } - }, [fromUser]); - const setAvatar = (value?: IAvatar) => { avatarUrl.current = value?.url; setAvatarState(value); @@ -126,6 +106,12 @@ const ChangeAvatarView = () => { avatarUrl.current = `@${user.username}`; }; + const resetRoomAvatar = () => { + setAvatar(undefined); + + // await Services.saveRoomSettings(room.rid, params); + }; + const pickImage = async () => { const options = { cropping: true, @@ -166,11 +152,9 @@ const ChangeAvatarView = () => { isUserProfile={fromUser} /> - setAvatar({ url: value, data: value, service: 'url' })} /> + {fromUser ? setAvatar({ url: value, data: value, service: 'url' })} /> : null} - {fromUser ? ( - - ) : null} + {fromUser ? : null}