Page MenuHomePhabricator

[native] Navigate from the QR screen to the restore screen
ClosedPublic

Authored by tomek on Nov 25 2024, 6:23 AM.
Tags
None
Referenced Files
Unknown Object (File)
Mon, Dec 23, 2:28 PM
Unknown Object (File)
Mon, Dec 23, 10:56 AM
Unknown Object (File)
Mon, Dec 23, 8:56 AM
Unknown Object (File)
Mon, Dec 23, 6:15 AM
Unknown Object (File)
Mon, Dec 23, 6:05 AM
Unknown Object (File)
Sun, Dec 22, 10:05 AM
Unknown Object (File)
Sun, Dec 22, 12:57 AM
Unknown Object (File)
Sat, Dec 21, 12:10 AM
Subscribers

Details

Summary

Introduce a wrapper over the logged out screen that can be used to choose between prompt and restore flows - this allows avoiding duplicating the code. Configure the wrapper to be used as two screens - the prompt and restore.

https://linear.app/comm/issue/ENG-9679/create-a-screen-where-user-can-choose-between-usernamepassword-and
https://linear.app/comm/issue/ENG-9958/introduce-a-stack-navigator-for-the-logged-out-screen

Depends on D14067

Test Plan

A couple of scenarios - details in the video from the summary.

Diff Detail

Repository
rCOMM Comm
Lint
Lint Not Applicable
Unit
Tests Not Applicable

Event Timeline

tomek edited the summary of this revision. (Show Details)
tomek requested review of this revision.Nov 25 2024, 6:41 AM

The code changes are perfect here, and this is what we discussed doing for the UI. But after watching the video, I'm a bit concerned... it seems like it will be easy for the user to get confused and think that the QR code screen is just getting dismissed, with no changes in LoggedOutModal.

I wonder if instead, we should consider using a stack-based approach like we have with RegistrationNavigator:

  • Move the QR code screen (and any associated screens) to be nested inside a new stack navigator (similar to RegistrationNavigator)
  • Introduce a new screen for the restore flow that has the user pick between ETH and password

What do you think?

The code changes are perfect here, and this is what we discussed doing for the UI. But after watching the video, I'm a bit concerned... it seems like it will be easy for the user to get confused and think that the QR code screen is just getting dismissed, with no changes in LoggedOutModal.

I wonder if instead, we should consider using a stack-based approach like we have with RegistrationNavigator:

  • Move the QR code screen (and any associated screens) to be nested inside a new stack navigator (similar to RegistrationNavigator)
  • Introduce a new screen for the restore flow that has the user pick between ETH and password

What do you think?

Agree, this would be a lot more intuitive to the users. This change will take some time, but I think it is worth it.

Create a new screen with the restore flow

tomek edited the test plan for this revision. (Show Details)
tomek edited the summary of this revision. (Show Details)

Thanks for the updated video!

Two points of feedback:

  1. Can we avoid using the LoggedOutModal style for any of the screens in the navigator? It feels stylistically inconsistent to push a new screen that looks like what appears below the stack navigator.
  2. I don't think it's very clear to the user that they're entering a restore flow. Can we restyle the restore screen to look something like the registration navigator screens? A title (something like "Restore account"), some text explaining what is happening, and the same buttons at the bottom but maybe using "Restore" as the verb instead of "Sign in".

What do you think?

  1. Can we avoid using the LoggedOutModal style for any of the screens in the navigator? It feels stylistically inconsistent to push a new screen that looks like what appears below the stack navigator.

Yeah, we can do that. In that case, I'd need to introduce new components instead of wrapping the old one.

  1. I don't think it's very clear to the user that they're entering a restore flow. Can we restyle the restore screen to look something like the registration navigator screens? A title (something like "Restore account"), some text explaining what is happening, and the same buttons at the bottom but maybe using "Restore" as the verb instead of "Sign in".

Agree, this is consistent with the first suggestion.

Can we restyle the restore screen to look something like the registration navigator screens?

I'm not sure about this. A user enters the restore flow by going through the QR screen, which is a bit inconsistent with the registration flow (e.g. font size, alignment). I think that it would be better to follow the QR screen design so that the user doesn't experience inconsistency. We can also update the QR screen design to be consistent with the registration flow - I think this is the best solution.

We can also update the QR screen design to be consistent with the registration flow - I think this is the best solution.

Yes, I agree. In fact we have a task from 6 months ago covering this – I'll assign it to you for now.

This revision is now accepted and ready to land.Sat, Dec 7, 1:01 PM