[native] introduce UserProfileAvatarModal
ClosedPublic
Actions

Authored by ginsu on Oct 5 2023, 12:24 PM.

Details

Reviewers

atul
inka

Commits

rCOMMdec57a1f08c2: [native] introduce UserProfileAvatarModal

Summary

This diff introduces the User Profile Avatar Modal component. The User Profile Avatar Modal uses the new FullScreenViewModal and XXL avatar size that I introduced earlier.

This is step 4 in the list below
Outlined below are the steps I will take in this stack (each point here will be it's own diff):

Replace out of box BottomSheetModal with basic BottomSheet (Unfortunately, BottomSheetModal does not play nice with nested navigator)
Polish up the BottomSheetBackdrop animation
Introduce User Profile Bottom Sheet Navigators (this is so we can navigate to User Profile Avatar Modal from the User Profile Bottom Sheet)
Introduce the User Profile Avatar Modal component and all the necessary things (like route names) that we will need to navigate to this new screen
Factor out the User Avatar component in UserProfile into it's own separate component to keep things better organized

Depends on D9375

Test Plan

Confirmed that I was able to navigate to the User Profile Avatar Modal screen (the next diff will introduce the navigation method to this screen), and I can do things like zoom, pan, etc with the user avatars

Diff Detail

Repository

rCOMM Comm

Lint

No Lint Coverage

Unit

No Test Coverage

Event Timeline

ginsu created this revision.Oct 5 2023, 12:24 PM

Herald added subscribers: will, tomek, ashoat. · View Herald TranscriptOct 5 2023, 12:24 PM

ginsu edited the summary of this revision. (Show Details)Oct 5 2023, 12:36 PM

ginsu edited the test plan for this revision. (Show Details)

ginsu added reviewers: atul, inka.

ginsu added a parent revision: D9375: [native] introduce UserProfileBottomSheetNavigator.

ginsu attached a referenced file: F791932: Screen Recording 2023-10-05 at 3.35.17 PM.mov. (Show Details)

Harbormaster completed remote builds in B23014: Diff 31694.Oct 5 2023, 12:41 PM

ginsu requested review of this revision.Oct 5 2023, 12:41 PM

ginsu added a child revision: D9377: [native] introduce UserProfileAvatar.Oct 5 2023, 12:47 PM

Accepting to unblock, but would prefer if we could avoid passing contentDimensions to FullScreenViewModal

native/user-profile/user-profile-avatar-modal.react.js
42 ↗	(On Diff #31694)	Eh, seems a little weird that we're passing the dimensions of the child to the parent `FullScreenViewModal`. What happens if the dimensions of XXL UserAvatar changes for example? Is there a way to avoid this?

This revision is now accepted and ready to land.Oct 5 2023, 4:23 PM

ginsu added inline comments.Oct 5 2023, 5:56 PM

native/user-profile/user-profile-avatar-modal.react.js
42 ↗	(On Diff #31694)	would prefer if we could avoid passing contentDimensions to FullScreenViewModal Since the logic for finding the dimensions of the user profile and an image multimedia message are pretty different from each other, I think it makes sense to still have a `contentDimensions` prop that can be used by `FullScreenViewModal` https://github.com/CommE2E/comm/blob/master/native/media/image-modal.react.js#L63-L95 What happens if the dimensions of XXL UserAvatar changes for example? I'll create an `avatar-constants` file and create an XXL size constant that can be used in both `Avatar` and here. So if the dimensions of XXL ever change, then both of these places will be affected