[User Settings] Add new Change Password view

If you haven’t already, check out our contributing guidelines for onboarding!

---

Having added four new menu items to the Settings page, we now need to begin linking those menu items to actual pages. This issue pertains to the Change Password page.

The Change Password view will be displayed when the “Change Password” menu item is clicked. It will display a header with a left-facing arrow on the left-hand side, a title, and an X button to close the view on the right-hand side. The view will contain a prompt, three text boxes with a titles, and a button with the text Save.

Deliverables

• Clicking on the Change Password menu item on the Settings page will route the user to settings/passwords via the SETTINGS_PASSWORD route in ROUTES.js and display the new view
• The Two Factor Code field should only display if the account.requiresTwoFactorAuth is true
  • The two factor code text box should contain a placeholder saying Required when 2FA is enabled
• If an incorrect current password or 2FA code is provided we should display the following error Incorrect password. Please try again.
  • This is similar to what we do on the login screen
  • 
  • If account.requiresTwoFactorAuth is true, ensure the error message says Incorrect password or two factor code. Please try again.
  • Pressing Save should call User.changePassword
  • Pressing X will close the right-hand modal and route the user back to the last viewed report
  • Pressing < should display the main settings view.

Mobile	Web/Desktop

Upwork Link: https://www.upwork.com/jobs/~01fd29c39b73d1e4fa

[michelle-thompson]

I prefer the sentence underneath the input so let’s go with that!

[shawnborton]

I like the idea of just using small, muted text directly under the text input for the hint. Especially since tooltips don’t really work well on mobile.