Email Verification: Make notices better/more prominent

[taipeicoder]

Description

See context.

Several features in WP.com are blocked if the account email has not been verified, and we display notices accordingly.

The notice text is truncated here.

There is also a scenario where the user can purchase a domain during onboarding, but then the experience breaks since they would need to verify their email.

[javierarce]

For the first two issues you mentioned, I think it's good that the message appears in context (obviously, in the case of the notice inside the avatar, the position is terrible), but there should be a global notice at the top.

For the third issue, the problem isn't specific to that screen. The walkthrough reveals that the problem is that we don't have (or at least aren't displaying) global notifications.

PS: I'd rename this issue to something like: "Implement global notifications for critical messages"

[davemart-in]

Moving this to "Needs design"

[mmtr]

@javierarce do you have any update on this?

[javierarce]

I have an answer ready, but since there are related tasks that go beyond the scope of this issue and require some general context, I'm going to publish everything in a P2.

[javierarce]

Here's the P2 post I mentioned on my previous message: p9Jlb4-dYD-p2

[javierarce]

After reviewing the feedback on p9Jlb4-dYD-p2, we have an accepted design proposal. Here are the screens that are relevant to this issue:

Here's a link to the updated Figma file: wCm5Tzb7JBaG4WNowWbjES-fi-5057_13109

PS: I'll open a new issue to handle the removal of the email change notification (wCm5Tzb7JBaG4WNowWbjES-fi-5057_20764)

[Addison-Stavlo]

One PR for the dialog itself here: https://github.com/Automattic/wp-calypso/pull/94629

[Addison-Stavlo]

@javierarce For the "Verify Email" button on the right side of the notice:

Does this:

• navigate to /me/account
• open the modal
• resend the email
• other?

[javierarce]

@Addison-Stavlo it should open the modal.

[Addison-Stavlo]

it should open the modal.

Thanks for clarifying. That sounds good!

[Addison-Stavlo]

https://github.com/Automattic/wp-calypso/pull/94683 should resolve the rest of the items here.