Differential D8020 Diff 27283 native/avatars/edit-thread-avatar-provider.react.js

Changeset View

Standalone View

native/avatars/edit-thread-avatar-provider.react.js

// @flow		// @flow

import * as React from 'react';		import * as React from 'react';
import { Alert } from 'react-native';		import { Alert } from 'react-native';

import {		import {
changeThreadSettings,		changeThreadSettings,
changeThreadSettingsActionTypes,		changeThreadSettingsActionTypes,
} from 'lib/actions/thread-actions.js';		} from 'lib/actions/thread-actions.js';
import { createLoadingStatusSelector } from 'lib/selectors/loading-selectors.js';		import { createLoadingStatusSelector } from 'lib/selectors/loading-selectors.js';
import type { UpdateUserAvatarRemoveRequest } from 'lib/types/avatar-types.js';		import type { UpdateUserAvatarRequest } from 'lib/types/avatar-types.js';
import type { LoadingStatus } from 'lib/types/loading-types.js';		import type { LoadingStatus } from 'lib/types/loading-types.js';
import type {		import type {
MediaLibrarySelection,		MediaLibrarySelection,
NativeMediaSelection,		NativeMediaSelection,
} from 'lib/types/media-types.js';		} from 'lib/types/media-types.js';
import type { UpdateThreadRequest } from 'lib/types/thread-types.js';		import type { UpdateThreadRequest } from 'lib/types/thread-types.js';
import {		import {
useDispatchActionPromise,		useDispatchActionPromise,
useServerCall,		useServerCall,
} from 'lib/utils/action-utils.js';		} from 'lib/utils/action-utils.js';

import { selectFromGallery, useUploadSelectedMedia } from './avatar-hooks.js';		import { selectFromGallery, useUploadSelectedMedia } from './avatar-hooks.js';
import { activeThreadSelector } from '../navigation/nav-selectors.js';		import { activeThreadSelector } from '../navigation/nav-selectors.js';
import { NavContext } from '../navigation/navigation-context.js';		import { NavContext } from '../navigation/navigation-context.js';
import { useSelector } from '../redux/redux-utils.js';		import { useSelector } from '../redux/redux-utils.js';

export type EditThreadAvatarContextType = {		export type EditThreadAvatarContextType = {
+threadAvatarSaveInProgress: boolean,		+threadAvatarSaveInProgress: boolean,
+selectFromGalleryAndUpdateThreadAvatar: (threadID: string) => Promise<void>,		+selectFromGalleryAndUpdateThreadAvatar: (threadID: string) => Promise<void>,
+updateImageThreadAvatar: (		+updateImageThreadAvatar: (
selection: NativeMediaSelection,		selection: NativeMediaSelection,
threadID: string,		threadID: string,
) => Promise<void>,		) => Promise<void>,
+removeThreadAvatar: (threadID: string) => void,		+setThreadAvatar: (
		threadID: string,
		avatarRequest: UpdateUserAvatarRequest,
		) => Promise<void>,
};		};

const EditThreadAvatarContext: React.Context<?EditThreadAvatarContextType> =		const EditThreadAvatarContext: React.Context<?EditThreadAvatarContextType> =
React.createContext<?EditThreadAvatarContextType>();		React.createContext<?EditThreadAvatarContextType>();

type Props = {		type Props = {
+children: React.Node,		+children: React.Node,
};		};
▲ Show 20 Lines • Show All 89 Lines • ▼ Show 20 Lines	async (threadID: string) => {
if (!selection) {		if (!selection) {
return;		return;
}		}
await updateImageThreadAvatar(selection, threadID);		await updateImageThreadAvatar(selection, threadID);
},		},
[updateImageThreadAvatar],		[updateImageThreadAvatar],
);		);

const removeThreadAvatar = React.useCallback(		const setThreadAvatar = React.useCallback(
(threadID: string) => {		async (threadID: string, avatarRequest: UpdateUserAvatarRequest) => {
const removeAvatarRequest: UpdateUserAvatarRemoveRequest = {
type: 'remove',
};

const updateThreadRequest: UpdateThreadRequest = {		const updateThreadRequest: UpdateThreadRequest = {
threadID,		threadID,
changes: {		changes: {
avatar: removeAvatarRequest,		avatar: avatarRequest,
},		},
};		};

const action = changeThreadSettingsActionTypes.started;		const action = changeThreadSettingsActionTypes.started;
dispatchActionPromise(		const promise = (async () => {
changeThreadSettingsActionTypes,
(async () => {
try {		try {
return await changeThreadSettingsCall(updateThreadRequest);		return await changeThreadSettingsCall(updateThreadRequest);
} catch (e) {		} catch (e) {
Alert.alert('Avatar update failed', 'Unable to update avatar.');		Alert.alert('Avatar update failed', 'Unable to update avatar.');
throw e;		throw e;
}		}
})(),		})();
{ customKeyName: `${action}:${threadID}:avatar` },		dispatchActionPromise(changeThreadSettingsActionTypes, promise, {
);		customKeyName: `${action}:${threadID}:avatar`,
		});
		await promise;
},		},
[changeThreadSettingsCall, dispatchActionPromise],		[changeThreadSettingsCall, dispatchActionPromise],
);		);

const context = React.useMemo(		const context = React.useMemo(
() => ({		() => ({
threadAvatarSaveInProgress,		threadAvatarSaveInProgress,
selectFromGalleryAndUpdateThreadAvatar,		selectFromGalleryAndUpdateThreadAvatar,
updateImageThreadAvatar,		updateImageThreadAvatar,
removeThreadAvatar,		setThreadAvatar,
}),		}),
[		[
removeThreadAvatar,		threadAvatarSaveInProgress,
selectFromGalleryAndUpdateThreadAvatar,		selectFromGalleryAndUpdateThreadAvatar,
updateImageThreadAvatar,		updateImageThreadAvatar,
threadAvatarSaveInProgress,		setThreadAvatar,
],		],
);		);

return (		return (
<EditThreadAvatarContext.Provider value={context}>		<EditThreadAvatarContext.Provider value={context}>
{children}		{children}
</EditThreadAvatarContext.Provider>		</EditThreadAvatarContext.Provider>
);		);
}		}

export { EditThreadAvatarContext, EditThreadAvatarProvider };		export { EditThreadAvatarContext, EditThreadAvatarProvider };