Update the design

Use the registration flow design

Specify the keys

A new revision with a couple of changes:

1. Added a placeholder icon. Will update the diff after https://linear.app/comm/issue/OPS-305/mockup-icon-for-restore-account-screen finalizes the design.
2. Made sure the margin isn't that big. This issue was caused by the SafeAreaView being rendered twice.
3. Updated the copy with the text proposed by @ashoat . The first two paragraphs are almost exactly the same - the only difference is the usage of ’ sign. The third paragraph is a little different - I'm not sure but I think that Note that after completing the recovery flow, you will logged out of all of your other devices. was a bit incorrect.
4. Used the updated PromptButton that follows a design from the registration screen, e.g. in terms of the font.

Update the design

Don't specify the safe area twice

Use the primary button

Update the design

In D14067#392122, @ashoat wrote:

The design here doesn't look great to me... it feels like we're taking the "design language" of LoggedOutModal and applying it in a place where we're mostly using the RegistrationNavigator "design language".

Can we instead try to base the design on RegistrationNavigator? I think we can keep the general structure here (one username field, one password field, and a button), but instead:

1. Look at UsernameSelection to get an idea of how to style the username input field.
2. Look at PasswordSelection to get an idea of how to style the password input field.
3. Use PrimaryButton for the sign-in button.

If we do this, then after launching signed device lists we can probably totally deprecate LogInPanel. What do you think?

rebase before landing v2

rebase

rebase before landing

address notes

• rebase
• use useStaffAlert

use useStaffAlert

make reducer pure

• fix typo
• remove migration
• make prop read-only