HomePhabricator
Diffusion Comm 720d97ea0426

[native] introduce UserProfileAvatar

Description

[native] introduce UserProfileAvatar

Summary:
The last part to complete the full screen user avatar view experience is to make the UserAvatar a touchable that will navigate to User Profile Avatar Modal when it gets pressed.

Initially I had all this logic living in UserProfile; however, I didn't want to overcrowd this component, so I created a separate UserProfileAvatar component to keep things better organized

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

  1. Replace out of box BottomSheetModal with basic BottomSheet (Unfortunately, BottomSheetModal does not play nice with nested navigator)
  2. Polish up the BottomSheetBackdrop animation
  3. Introduce User Profile Bottom Sheet Navigators (this is so we can navigate to User Profile Avatar Modal from the User Profile Bottom Sheet)
  4. 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
  5. Factor out the User Avatar component in UserProfile into it's own separate component to keep things better organized

Also here is a screenshot of the Figma designs for additional context:

Screenshot 2023-10-05 at 4.42.15 PM.png (1×1 px, 379 KB)

Depends on D9376

Test Plan:
Please see the demo video below

Reviewers: atul, inka

Reviewed By: atul

Subscribers: ashoat, tomek, wyilio

Differential Revision: https://phab.comm.dev/D9377

Details

Provenance
ginsuAuthored on Oct 3 2023, 8:51 AM
Reviewer
atul
Differential Revision
D9377: [native] introduce UserProfileAvatar
Parents
rCOMMdec57a1f08c2: [native] introduce UserProfileAvatarModal
Branches
Unknown
Tags
Unknown