Rename and restyle set password form

[jasperhuangg]

NOTE: I wasn't able to get git to recognize that the file was renamed, so the diff will show that the SetPasswordPage was deleted and that the SetPasswordForm is a new file.

Details

I renamed the SetPasswordPage into SetPasswordForm (seeing that it only contains the elements relevant to the form now), and changed it to use the same layout/styles as the LoginForm.

I also changed SignInPageLayout to use SafeAreaView seeing that all the forms who use it need to be wrapped by SafeAreaView.

Fixed Issues

Fixes Expensify/Expensify#157816

Tests

1. Navigate to the SetPasswordPage
2. Verify that it renders correctly
3. Verify that the set password flow still works.

QA Steps

1. Navigate to the sign in page. Enter an email address you have access to that doesn't exist. (use EmailOnDeck)
2. Click the link in the email that was sent to you.
3. Verify that the set password page renders correctly. Set a password.
4. Sign out, and verify you can sign back in with that password.
5. In addition, to verify that it renders correctly on mobile:

• On native platforms, run npx uri-scheme open expensify-cash://setpassword/asdf --[ios/android] once you have the simulator running

Tested On

• Web
• Mobile Web
• iOS
• Android

Screenshots

Web

Mobile Web

iOS

Android

[jasperhuangg]

@marcaaron Just marked this as ready for review, thanks!

[OSBotify]

🚀 Deployed to staging in version: 1.0.31-3🚀

platform	result
🤖 android 🤖	success ✅
🖥 desktop 🖥	success ✅
🍎 iOS 🍎	success ✅
🕸 web 🕸	success ✅

[isagoico]

We were able to reproduce this while executing QA for this PR #2497. Apart from this it was a pass, checking it off.

[OSBotify]

🚀 Deployed to production in version: 1.0.39-5🚀

platform	result
🤖 android 🤖	failure ❌
🖥 desktop 🖥	success ✅
🍎 iOS 🍎	success ✅
🕸 web 🕸	success ✅