Page Menu
Home
Phorge
Search
Configure Global Search
Log In
Files
F33224220
D7624.1768559472.diff
No One
Temporary
Actions
View File
Edit File
Delete File
View Transforms
Subscribe
Flag For Later
Award Token
Size
7 KB
Referenced Files
None
Subscribers
None
D7624.1768559472.diff
View Options
diff --git a/native/avatars/avatar-hooks.js b/native/avatars/avatar-hooks.js
--- a/native/avatars/avatar-hooks.js
+++ b/native/avatars/avatar-hooks.js
@@ -304,7 +304,7 @@
}
type ShowAvatarActionSheetOptions = {
- +id: 'emoji' | 'image' | 'ens' | 'cancel' | 'remove',
+ +id: 'emoji' | 'image' | 'camera' | 'ens' | 'cancel' | 'remove',
+onPress?: () => mixed,
};
function useShowAvatarActionSheet(
@@ -322,6 +322,8 @@
return 'Use Emoji';
} else if (option.id === 'image') {
return 'Select image';
+ } else if (option.id === 'camera') {
+ return 'Camera';
} else if (option.id === 'ens') {
return 'Use ENS Avatar';
} else if (option.id === 'remove') {
@@ -356,6 +358,14 @@
style={styles.bottomSheetIcon}
/>
);
+ } else if (option.id === 'camera') {
+ return (
+ <SWMansionIcon
+ name="camera"
+ size={22}
+ style={styles.bottomSheetIcon}
+ />
+ );
} else if (option.id === 'ens') {
return (
<CommIcon
diff --git a/native/avatars/edit-user-avatar-provider.react.js b/native/avatars/edit-user-avatar-provider.react.js
--- a/native/avatars/edit-user-avatar-provider.react.js
+++ b/native/avatars/edit-user-avatar-provider.react.js
@@ -13,7 +13,7 @@
UpdateUserAvatarRemoveRequest,
} from 'lib/types/avatar-types.js';
import type { LoadingStatus } from 'lib/types/loading-types.js';
-import type { MediaLibrarySelection } from 'lib/types/media-types.js';
+import type { NativeMediaSelection } from 'lib/types/media-types.js';
import {
useDispatchActionPromise,
useServerCall,
@@ -25,6 +25,7 @@
export type EditUserAvatarContextType = {
+userAvatarSaveInProgress: boolean,
+selectFromGalleryAndUpdateUserAvatar: () => Promise<void>,
+ +updateImageUserAvatar: (selection: NativeMediaSelection) => Promise<void>,
+setENSUserAvatar: () => void,
+removeUserAvatar: () => void,
};
@@ -61,7 +62,7 @@
);
const updateImageUserAvatar = React.useCallback(
- async (selection: ?MediaLibrarySelection) => {
+ async (selection: ?NativeMediaSelection) => {
const imageAvatarUpdateRequest = await uploadSelectedMedia(selection);
if (!imageAvatarUpdateRequest) {
@@ -129,12 +130,14 @@
() => ({
userAvatarSaveInProgress,
selectFromGalleryAndUpdateUserAvatar,
+ updateImageUserAvatar,
setENSUserAvatar,
removeUserAvatar,
}),
[
removeUserAvatar,
selectFromGalleryAndUpdateUserAvatar,
+ updateImageUserAvatar,
setENSUserAvatar,
userAvatarSaveInProgress,
],
diff --git a/native/avatars/edit-user-avatar.react.js b/native/avatars/edit-user-avatar.react.js
--- a/native/avatars/edit-user-avatar.react.js
+++ b/native/avatars/edit-user-avatar.react.js
@@ -12,7 +12,10 @@
import EditAvatarBadge from './edit-avatar-badge.react.js';
import { EditUserAvatarContext } from './edit-user-avatar-provider.react.js';
import UserAvatar from './user-avatar.react.js';
-import { EmojiUserAvatarCreationRouteName } from '../navigation/route-names.js';
+import {
+ EmojiUserAvatarCreationRouteName,
+ UserAvatarCameraModalRouteName,
+} from '../navigation/route-names.js';
import { useSelector } from '../redux/redux-utils.js';
import { useStyles } from '../themes/colors.js';
@@ -41,14 +44,20 @@
const ensAvatarURI = useENSAvatar(ethAddress);
const { navigate } = useNavigation();
+
const navigateToUserEmojiAvatarCreation = React.useCallback(() => {
navigate(EmojiUserAvatarCreationRouteName);
}, [navigate]);
+ const navigateToCamera = React.useCallback(() => {
+ navigate(UserAvatarCameraModalRouteName);
+ }, [navigate]);
+
const actionSheetConfig = React.useMemo(() => {
const configOptions = [
{ id: 'emoji', onPress: navigateToUserEmojiAvatarCreation },
{ id: 'image', onPress: selectFromGalleryAndUpdateUserAvatar },
+ { id: 'camera', onPress: navigateToCamera },
];
if (ensAvatarURI) {
@@ -60,6 +69,7 @@
return configOptions;
}, [
ensAvatarURI,
+ navigateToCamera,
navigateToUserEmojiAvatarCreation,
removeUserAvatar,
setENSUserAvatar,
diff --git a/native/media/user-avatar-camera-modal.react.js b/native/media/user-avatar-camera-modal.react.js
new file mode 100644
--- /dev/null
+++ b/native/media/user-avatar-camera-modal.react.js
@@ -0,0 +1,31 @@
+// @flow
+
+import invariant from 'invariant';
+import * as React from 'react';
+
+import { EditUserAvatarContext } from '../avatars/edit-user-avatar-provider.react.js';
+import CameraModal from '../media/camera-modal.react.js';
+import type { AppNavigationProp } from '../navigation/app-navigator.react.js';
+import type { NavigationRoute } from '../navigation/route-names.js';
+
+type Props = {
+ +navigation: AppNavigationProp<'UserAvatarCameraModal'>,
+ +route: NavigationRoute<'UserAvatarCameraModal'>,
+};
+
+function UserAvatarCameraModal(props: Props): React.Node {
+ const { navigation } = props;
+
+ const editUserAvatarContext = React.useContext(EditUserAvatarContext);
+ invariant(editUserAvatarContext, 'editUserAvatarContext should be set');
+ const { updateImageUserAvatar } = editUserAvatarContext;
+
+ return (
+ <CameraModal
+ handlePhotoCapture={updateImageUserAvatar}
+ navigation={navigation}
+ />
+ );
+}
+
+export default UserAvatarCameraModal;
diff --git a/native/navigation/app-navigator.react.js b/native/navigation/app-navigator.react.js
--- a/native/navigation/app-navigator.react.js
+++ b/native/navigation/app-navigator.react.js
@@ -14,6 +14,7 @@
} from './overlay-navigator.react.js';
import type { RootNavigationProp } from './root-navigator.react.js';
import {
+ UserAvatarCameraModalRouteName,
ImageModalRouteName,
MultimediaMessageTooltipModalRouteName,
ActionResultModalRouteName,
@@ -34,6 +35,7 @@
import KeyboardStateContainer from '../keyboard/keyboard-state-container.react.js';
import ChatCameraModal from '../media/chat-camera-modal.react.js';
import ImageModal from '../media/image-modal.react.js';
+import UserAvatarCameraModal from '../media/user-avatar-camera-modal.react.js';
import VideoPlaybackModal from '../media/video-playback-modal.react.js';
import RelationshipListItemTooltipModal from '../profile/relationship-list-item-tooltip-modal.react.js';
import PushHandler from '../push/push-handler.react.js';
@@ -135,6 +137,10 @@
name={ChatCameraModalRouteName}
component={ChatCameraModal}
/>
+ <App.Screen
+ name={UserAvatarCameraModalRouteName}
+ component={UserAvatarCameraModal}
+ />
<App.Screen
name={VideoPlaybackModalRouteName}
component={VideoPlaybackModal}
diff --git a/native/navigation/route-names.js b/native/navigation/route-names.js
--- a/native/navigation/route-names.js
+++ b/native/navigation/route-names.js
@@ -80,6 +80,7 @@
export const ThreadSettingsMemberTooltipModalRouteName =
'ThreadSettingsMemberTooltipModal';
export const ThreadSettingsRouteName = 'ThreadSettings';
+export const UserAvatarCameraModalRouteName = 'UserAvatarCameraModal';
export const VideoPlaybackModalRouteName = 'VideoPlaybackModal';
export const TermsAndPrivacyRouteName = 'TermsAndPrivacyModal';
export const RegistrationRouteName = 'Registration';
@@ -120,6 +121,7 @@
+ImageModal: ImageModalParams,
+ActionResultModal: ActionResultModalParams,
+ChatCameraModal: ChatCameraModalParams,
+ +UserAvatarCameraModal: void,
+VideoPlaybackModal: VideoPlaybackModalParams,
...TooltipModalParamList,
};
File Metadata
Details
Attached
Mime Type
text/plain
Expires
Fri, Jan 16, 10:31 AM (7 h, 9 m)
Storage Engine
blob
Storage Format
Raw Data
Storage Handle
5943584
Default Alt Text
D7624.1768559472.diff (7 KB)
Attached To
Mode
D7624: [native] introduce user avatar camera modal
Attached
Detach File
Event Timeline
Log In to Comment