Create conditional dashboard CTA for Consent Mode

[aaemnnosttv]

Feature Description

A new dashboard notification should be created to surface awareness of Consent Mode for users who are configuring Site Kit to place an Ads conversion ID. This notification should only be shown if consent mode is not enabled.

The primary CTA should enable consent mode and navigate to the Admin Settings tab of the settings screen in case the user needs to take further action.

---

Do not alter or remove anything below. The following sections will be managed by moderators only.

Acceptance criteria

• A Consent Mode setup CTA banner should be shown on the main and entity dashboard.
• This should follow the first iteration of the Figma design.
• It should appear while Consent Mode is disabled and the user hasn't dismissed the banner.
• The primary CTA should enable Consent Mode, dismiss the banner and navigate to the Settings screen.
• The dismissal CTA should dismiss the banner. It should then be shown again after two weeks, for a maximum of three dismissals. The final showing of the banner will have the dismissal CTA text updated to "Don't show again". Actioning the CTA again will dismiss the banner permanently.

Implementation Brief

• The design is similar to the Audience Segmentation setup CTA banner, and the implementation can borrow from its PR: Issue / 8109 Setup CTA Banner Initial View (Storybook) #8292
  • We can potentially follow up later to refactor these components to share code as appropriate.
• Make use of the prompts infrastructure to implement the multiple dismissal behaviour, as seen in AdBlockingRecoverySetupCTAWidget.

Test Coverage

• Add to Storybook with a VRT scenario.

QA Brief

• Enable the consentMode feature flag, ensure that the Consent Mode enabled setting is false and the Ads Conversion ID is set.
• Verify that the Consent Mode setup banner is implemented and works correctly as per the AC.
• Refer to:
  • The Figma design - please be pragmatic, it has to follow the design but doesn't have to be absolutely pixel perfect.
  • The testing instructions.
• Note that when the primary CTA is clicked, a spinner will be shown in the button while Consent Mode is enabled, after which the browser will navigate to the Admin Settings tab on the Settings screen.
• In order to test the multiple dismissals, please refer to the QAB for Implement additional dismissal requirements for Ad Blocking Recovery Widget #7316. Upon review, it turns out the PR to make prompts work with the reference date was not merged, so the non-QA:Eng part of the QAB is not accurate.

Please note that this change does introduce a slight glitch - when refreshing the dashboard, the page will not always scroll to the widget context that was previously scrolled into view. This is a known issue that doesn't need to block the release. Update: Actually, I, @techanvil, have since tested this on InstaWP and TasteWP sites and the glitch isn't occurring. Seems only to be happening on my local dev environment, so maybe a non-issue, but one I will keep an eye on.

QA:Eng:

• In order to test the multiple dismissals, please refer to the QA:Eng part of the QAB for Implement additional dismissal requirements for Ad Blocking Recovery Widget #7316.

Changelog entry

• Create conditional dashboard CTA for Consent Mode.

[techanvil]

This was moved directly to execution so as not to block the progress toward our hard delivery target for Consent Mode.

[mohitwp]

QA Update ✅

• Tested on dev environment.
• Verified CTA for consent mode banner.
• Verified A Consent Mode setup CTA banner shown on the main and entity dashboard.
• Verfied this follow the first iteration of the Figma design.
• Verified appear while Consent Mode is disabled and the user hasn't dismissed the banner.
• Verified primary CTA should enable Consent Mode, dismiss the banner and navigate to the Settings screen.
• Verified 'Learn more' link navigates user to Site kit documentation page.
• Verified when thhe Maybe later link is clicked then the CTA banner s disappear and a tooltip display.

View Only Dashboard

Entity Dashboard

Other Admin

Larger Desktop View

Mobile View :

Tablet View

Primary CTA

Recording.805.mp4

Maybe later CTA

Recording.806.mp4

[mohitwp]

This is now ready for QA:Eng review to test the multiple dismissals.

[tofumatt]

QA ✅ from me as well 👍🏻