[User Settings] Add new Preferences 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 Preferences page.

The Preferences view will be displayed when the “Preferences” 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 a toggle with the text Relevant feature updates and Expensify news.

Deliverables

• Clicking on the Preferences menu item on the Settings page will route the user to settings/preferences the existing preferences in ROUTES.js and display the new view
• The enabled/disabled status of the toggle will depend on the value of the user.expensifyNewsStatus key
  • If the key doesn’t exist or is empty, the field should default to true
• Toggling the switch should call User.setExpensifyNewsStatus
• 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

Job posting: https://www.upwork.com/jobs/~01c4b1365d3b23397b

[michelle-thompson]

Perhaps we should just update the toggle copy?

cc @joaniew @trjExpensify @JmillsExpensify @NikkiWines

[Maftalion]

Proposed Solution

• RN’s Switch component, behaves differently on different platform (screenshot below for android/web). So we can bring in a javascript implementation like https://github.com/aminebenkeroum/toggle-switch-react-native to have design parity across all platforms.

• The default will go based on expensifyNewsStatus or default to true, then toggles will update that value by calling setExpensifyNewsStatus.

Questions Pressing X or < should display the main settings view.

• Current functionality would go back to main when < is pressed and close completely when x is pressed. Do we want to keep that or should both go back to main settings? (if so it might make more sense to just hide the x)