diff --git a/lib/components/base-edit-thread-avatar-provider.react.js b/lib/components/base-edit-thread-avatar-provider.react.js index 186ee6442..033c86faa 100644 --- a/lib/components/base-edit-thread-avatar-provider.react.js +++ b/lib/components/base-edit-thread-avatar-provider.react.js @@ -1,151 +1,150 @@ // @flow import * as React from 'react'; import { changeThreadSettings, changeThreadSettingsActionTypes, } from '../actions/thread-actions.js'; import { createLoadingStatusSelector } from '../selectors/loading-selectors.js'; import type { UpdateUserAvatarRequest, ImageAvatarDBContent, } from '../types/avatar-types.js'; import type { LoadingStatus } from '../types/loading-types.js'; import type { NativeMediaSelection } from '../types/media-types.js'; import type { UpdateThreadRequest } from '../types/thread-types.js'; import { useDispatchActionPromise, useServerCall, } from '../utils/action-utils.js'; import { useSelector } from '../utils/redux-utils.js'; export type EditThreadAvatarContextType = { +threadAvatarSaveInProgress: boolean, +updateImageThreadAvatar: ( selection: NativeMediaSelection, threadID: string, ) => Promise, +setThreadAvatar: ( threadID: string, avatarRequest: UpdateUserAvatarRequest, ) => Promise, }; const EditThreadAvatarContext: React.Context = React.createContext(); type Props = { - +displayFailureAlert: () => mixed, +useUploadSelectedMedia: ( setProcessingOrUploadInProgress?: (inProgress: boolean) => mixed, ) => (selection: NativeMediaSelection) => Promise, +activeThreadID: string, +children: React.Node, }; function BaseEditThreadAvatarProvider(props: Props): React.Node { const { useUploadSelectedMedia, activeThreadID, children } = props; const updateThreadAvatarLoadingStatus: LoadingStatus = useSelector( createLoadingStatusSelector( changeThreadSettingsActionTypes, `${changeThreadSettingsActionTypes.started}:${activeThreadID}:avatar`, ), ); const dispatchActionPromise = useDispatchActionPromise(); const changeThreadSettingsCall = useServerCall(changeThreadSettings); const [ threadAvatarMediaUploadInProgress, setThreadAvatarMediaUploadInProgress, ] = React.useState<$ReadOnlySet>(new Set()); const updateThreadAvatarMediaUploadInProgress = React.useCallback( (inProgress: boolean) => setThreadAvatarMediaUploadInProgress(prevState => { const updatedSet = new Set(prevState); if (inProgress) { updatedSet.add(activeThreadID); } else { updatedSet.delete(activeThreadID); } return updatedSet; }), [activeThreadID], ); const threadAvatarSaveInProgress = threadAvatarMediaUploadInProgress.has(activeThreadID) || updateThreadAvatarLoadingStatus === 'loading'; const uploadSelectedMedia = useUploadSelectedMedia( updateThreadAvatarMediaUploadInProgress, ); const updateImageThreadAvatar = React.useCallback( async (selection: NativeMediaSelection, threadID: string) => { const imageAvatarUpdateRequest = await uploadSelectedMedia(selection); if (!imageAvatarUpdateRequest) { return; } const updateThreadRequest: UpdateThreadRequest = { threadID, changes: { avatar: imageAvatarUpdateRequest, }, }; const action = changeThreadSettingsActionTypes.started; updateThreadAvatarMediaUploadInProgress(false); const promise = changeThreadSettingsCall(updateThreadRequest); dispatchActionPromise(changeThreadSettingsActionTypes, promise, { customKeyName: `${action}:${threadID}:avatar`, }); await promise; }, [ changeThreadSettingsCall, dispatchActionPromise, updateThreadAvatarMediaUploadInProgress, uploadSelectedMedia, ], ); const setThreadAvatar = React.useCallback( async (threadID: string, avatarRequest: UpdateUserAvatarRequest) => { const updateThreadRequest: UpdateThreadRequest = { threadID, changes: { avatar: avatarRequest, }, }; const action = changeThreadSettingsActionTypes.started; const promise = changeThreadSettingsCall(updateThreadRequest); dispatchActionPromise(changeThreadSettingsActionTypes, promise, { customKeyName: `${action}:${threadID}:avatar`, }); await promise; }, [changeThreadSettingsCall, dispatchActionPromise], ); const context = React.useMemo( () => ({ threadAvatarSaveInProgress, updateImageThreadAvatar, setThreadAvatar, }), [threadAvatarSaveInProgress, updateImageThreadAvatar, setThreadAvatar], ); return ( {children} ); } export { EditThreadAvatarContext, BaseEditThreadAvatarProvider }; diff --git a/native/avatars/native-edit-thread-avatar-provider.react.js b/native/avatars/native-edit-thread-avatar-provider.react.js index 4dde4f3ae..f5895b5a4 100644 --- a/native/avatars/native-edit-thread-avatar-provider.react.js +++ b/native/avatars/native-edit-thread-avatar-provider.react.js @@ -1,43 +1,33 @@ // @flow import * as React from 'react'; import { BaseEditThreadAvatarProvider } from 'lib/components/base-edit-thread-avatar-provider.react.js'; import { useUploadSelectedMedia } from './avatar-hooks.js'; import { activeThreadSelector } from '../navigation/nav-selectors.js'; import { NavContext } from '../navigation/navigation-context.js'; -import Alert from '../utils/alert.js'; - -const displayAvatarUpdateFailureAlert = () => - Alert.alert( - 'Couldn’t save avatar', - 'Please try again later', - [{ text: 'OK' }], - { cancelable: true }, - ); type Props = { +children: React.Node, }; function NativeEditThreadAvatarProvider(props: Props): React.Node { const { children } = props; const navContext = React.useContext(NavContext); const activeThreadID = React.useMemo( () => activeThreadSelector(navContext) ?? '', [navContext], ); return ( {children} ); } export default NativeEditThreadAvatarProvider;