diff --git a/native/chat/settings/emoji-thread-avatar-creation.react.js b/native/chat/settings/emoji-thread-avatar-creation.react.js --- a/native/chat/settings/emoji-thread-avatar-creation.react.js +++ b/native/chat/settings/emoji-thread-avatar-creation.react.js @@ -1,21 +1,15 @@ // @flow +import invariant from 'invariant'; import * as React from 'react'; -import { changeThreadSettingsActionTypes } from 'lib/actions/thread-actions.js'; -import { createLoadingStatusSelector } from 'lib/selectors/loading-selectors.js'; import { savedEmojiAvatarSelectorForThread } from 'lib/selectors/thread-selectors.js'; +import { EditThreadAvatarContext } from '../../avatars/edit-thread-avatar-provider.react.js'; import EmojiAvatarCreation from '../../avatars/emoji-avatar-creation.react.js'; import type { ChatNavigationProp } from '../../chat/chat.react.js'; +import { displayActionResultModal } from '../../navigation/action-result-modal.js'; import type { NavigationRoute } from '../../navigation/route-names.js'; -import { useSelector } from '../../redux/redux-utils.js'; -import { useSaveThreadAvatar } from '../../utils/avatar-utils.js'; - -const threadAvatarLoadingStatusSelector = createLoadingStatusSelector( - changeThreadSettingsActionTypes, - `${changeThreadSettingsActionTypes.started}:avatar`, -); export type EmojiThreadAvatarCreationParams = { +threadID: string, @@ -35,20 +29,24 @@ containingThreadID, ); - const saveThreadAvatar = useSaveThreadAvatar(); - const saveThreadAvatarCallLoading = useSelector( - state => threadAvatarLoadingStatusSelector(state) === 'loading', - ); - - const saveThreadAvatarCallback = React.useCallback( - newAvatarRequest => saveThreadAvatar(newAvatarRequest, threadID), - [saveThreadAvatar, threadID], + const editThreadAvatarContext = React.useContext(EditThreadAvatarContext); + invariant(editThreadAvatarContext, 'editThreadAvatarContext should be set'); + + const { setThreadAvatar, threadAvatarSaveInProgress } = + editThreadAvatarContext; + const setAvatar = React.useCallback( + async avatarRequest => { + const result = await setThreadAvatar(threadID, avatarRequest); + displayActionResultModal('Avatar updated!'); + return result; + }, + [setThreadAvatar, threadID], ); return ( ); diff --git a/native/utils/avatar-utils.js b/native/utils/avatar-utils.js --- a/native/utils/avatar-utils.js +++ b/native/utils/avatar-utils.js @@ -1,63 +1,7 @@ // @flow -import * as React from 'react'; -import { Alert } from 'react-native'; - -import { - changeThreadSettings, - changeThreadSettingsActionTypes, -} from 'lib/actions/thread-actions.js'; -import type { UpdateUserAvatarRequest } from 'lib/types/avatar-types.js'; -import { - useServerCall, - useDispatchActionPromise, -} from 'lib/utils/action-utils.js'; - -import { displayActionResultModal } from '../navigation/action-result-modal.js'; - function useShouldRenderAvatars(): boolean { return true; } -function useSaveThreadAvatar(): ( - newAvatarRequest: UpdateUserAvatarRequest, - threadID: string, -) => mixed { - const callChangeThreadSettings = useServerCall(changeThreadSettings); - const dispatchActionPromise = useDispatchActionPromise(); - - return React.useCallback( - (newAvatarRequest, threadID) => { - const saveAvatarPromise = (async () => { - try { - const response = await callChangeThreadSettings({ - threadID, - changes: { avatar: newAvatarRequest }, - }); - displayActionResultModal('Avatar updated!'); - - return response; - } catch (e) { - Alert.alert( - 'Couldn’t save avatar', - 'Please try again later', - [{ text: 'OK' }], - { - cancelable: true, - }, - ); - throw e; - } - })(); - - dispatchActionPromise( - changeThreadSettingsActionTypes, - saveAvatarPromise, - { customKeyName: `${changeThreadSettingsActionTypes.started}:avatar` }, - ); - }, - [callChangeThreadSettings, dispatchActionPromise], - ); -} - -export { useShouldRenderAvatars, useSaveThreadAvatar }; +export { useShouldRenderAvatars };