Implement The Exclude words / phrases onboarding step and other improvements

igawaclawska commented 1 month ago

What's new?

A new onboarding part has been added, that allows the user to exclude unwanted words and phrases.

This part has two steps (progressive disclosure):

Step 1 explaining the purpose of this onboarding part and asking whether users are interested in this type of customization.

Exclude Words Step 1
desktop	mobile

Step 2, which is entered by those interested, allows adding unwanted words and phrases.

Exclude Words Step 2
desktop	mobile

Implementation: To keep all app settings in sync and avoid code duplication, a useExcludeInterest custom hook has been added. Similar to adding interests, this hook takes care of excluding interests within the onboarding process and the application.

New variants of the Tag elements have been added, and new blue colors have been introduced. These new blue colors are complementary to the zeeguuOrange. The shades and naming of the new blue have been defined following the RefactoringUI guide. Given these shades are created from the same color, they blend well with each other compared to the existing ones (I have not removed the old ones because they are used in multiple places in the system, which means If we decide to use the new ones, we have to do it carefully)

Other improvements:

Buttons on the info pages:

More customizable (can wrap their content or fill the parent).
Given we implemented the redirect() function that works with onClick, the link element wrapping this button is no longer needed and has been removed.
Their size among the info/onboarding pages is now more even.

The Landing page:

The buttons' text on the homepage has been changed to be more intuitive. I haven't replaced the buttons for now, but it is planned. As we also discussed, changing the website language has been disabled for now. The navbar's alignment has been improved. I am brainstorming further improvements to this page.

netlify[bot] commented 1 month ago

Deploy Preview for voluble-nougat-015dd1 ready!

Name	Link
Latest commit	6c7ab74019544649067fd8faefbf1a6280a5ead0
Latest deploy log	https://app.netlify.com/sites/voluble-nougat-015dd1/deploys/6647134b0eee3b000817e73b
Deploy Preview	https://deploy-preview-372--voluble-nougat-015dd1.netlify.app
Preview on mobile	Toggle QR Code... Use your smartphone camera to open QR code link.

To edit notification comments on pull requests, go to your Netlify site configuration.

igawaclawska commented 1 month ago

Hi @mircealungu and @tfnribeiro,

I have addressed the latest comments and change requests in this PR. Additionally, I was thinking about possibilities for last improvements before testing, and the concept we discussed on Monday - replacing the order of screens so that language selection is before the account creation step - seems like a good candidate. I will be working on it now.

zeeguu / web