diff --git a/lib/components/base-edit-thread-avatar-provider.react.js b/lib/components/base-edit-thread-avatar-provider.react.js index 39f776701..6d305bad9 100644 --- a/lib/components/base-edit-thread-avatar-provider.react.js +++ b/lib/components/base-edit-thread-avatar-provider.react.js @@ -1,151 +1,147 @@ // @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 = { +updateThreadAvatarMediaUploadInProgress: (inProgress: boolean) => void, +threadAvatarSaveInProgress: boolean, +updateImageThreadAvatar: ( imageAvatarUpdateRequest: ImageAvatarDBContent, threadID: string, ) => Promise, +baseSetThreadAvatar: ( threadID: string, avatarRequest: UpdateUserAvatarRequest, ) => Promise, }; const EditThreadAvatarContext: React.Context = React.createContext(); type Props = { - +useUploadSelectedMedia: ( - setProcessingOrUploadInProgress?: (inProgress: boolean) => mixed, - ) => (selection: NativeMediaSelection) => Promise, +activeThreadID: string, +children: React.Node, }; function BaseEditThreadAvatarProvider(props: Props): React.Node { const { 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 updateImageThreadAvatar = React.useCallback( async ( imageAvatarUpdateRequest: ImageAvatarDBContent, threadID: string, ) => { 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, ], ); // NOTE: Do NOT consume `baseSetThreadAvatar` directly. // Use platform-specific `[web/native]SetThreadAvatar` instead. const baseSetThreadAvatar = 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( () => ({ updateThreadAvatarMediaUploadInProgress, threadAvatarSaveInProgress, updateImageThreadAvatar, baseSetThreadAvatar, }), [ updateThreadAvatarMediaUploadInProgress, threadAvatarSaveInProgress, updateImageThreadAvatar, baseSetThreadAvatar, ], ); 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 f5895b5a4..a5e456e4e 100644 --- a/native/avatars/native-edit-thread-avatar-provider.react.js +++ b/native/avatars/native-edit-thread-avatar-provider.react.js @@ -1,33 +1,29 @@ // @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'; 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;