Expand the logic of the `ACRSubtleNotification` component for existing KMW users that already have ACR tiles set up

[zutigrm]

Feature Description

The ACRSubtleNotifciation component logic should be expanded so it surfaces in the dashboard within key metrics widget area for the users who have setup KMW, either manually or using tailored metrics, once new ACR events are detected. This scenario covers only the use case, where ACR metrics were already detected initially, and now new events were detected. CTA should open selection panel with new metrics highlighted with new badge

FIgma design can be seen here

Refer to the Subtle banner notification for detected events and New Events Detection Following Initial Events Detection sections of the design doc

---

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

Acceptance criteria

• ACRDashboardSubtleNotification component is updated to show/surface:
  • If conversion event were already detected, and
  • If key metrics were setup (either using manual selection or getting tailored metrics), and
  • New conversion events have been detected (check implementation in 9379 that adds needed infrastructure)
• In case initial banner was not dismissed, or action taken (9372 or 9371), delay showing the current banner
• Banner should re-surface every time new events are detected following the initial events detection. If it gets dismissed, it will not show until next time new events are detected, when it should re-surface again
• Said component should match the figma design
• Clicking the Maybe later CTA should dismiss the banner
• Clicking the Select metrics CTA should open the selection panel
• Check the Subtle banner notification for detected events and New Events Detection Following Initial Events Detection sections of the design doc

Implementation Brief

• [ ] Update ACRNotificationCTAWidget component
  • Banner should render if:
  • isUserInputCompleted selector from CORE_USER store is false
  • And isKeyMetricsSetupCompleted is true
  • And hasNewConversionReportingEvents selector from analytics datastore has value, and the value is not matching the value from getDetectedEvents Analytics setting, marking that these are new events, after initial events were detected.
  • And, check for includeConversionTailoredMetrics KM setting, if it is still false, means that initial banner variation was not actioned, so if it is the user who has tailored metrics setup, matching the condition of variation shown in #9371, show that banner instead, offering user to add new metrics automatically. Otherwise, this general banner variation should be shown, for manual setup users, or the ones with tailored metrics if includeConversionTailoredMetrics is true - they have already included ACR tailored metrics.
• [ ] In ACRDashboardSubtleNotification
  • Following above conditions, include the content variation matching this banner in Figma
  • Maybe later CTA callback should behave in a same way as implementation in 9371
  • View metrics CTA callback should open the selection panel https://github.com/google/site-kit-wp/blob/79b4417581b1cca3d718f7e55127681e6e05fc6f/assets/js/components/KeyMetrics/ChangeMetricsLink.js#L48

Test Coverage

• Update tests for ACRNotificationCTAWidget (basic coverage added in 9344), to verify that banner is showing when conditions are met, and not showing otherwise for example. Also test for new CTA's variation and verifying that it updates the UI state which will trigger the opening of selection panel

QA Brief

Note: Since this issue interacts with existing conditions and include new ones, it will be good to test previous variations (9371 and 9372)for regression during tests for this one

Changelog entry

[10upsimon]

@zutigrm the AC says the following:

• either using manual selection or getting tailored metrics

And then goes on to say the following for clicking the primary CTA:

• Clicking the Select metrics CTA should open the selection panel

However, the selection panel would not be applicable for tailored metric users. Please expand on this a little for tailored vs manual setups, thanks!

[zutigrm]

@10upsimon Yes the explained steps are correct and expected behaviour. After new events are detected following initial detection, this banner is shown with same CTA regardless of how KMW was setup, it will open the selection panel showing to list the "New" events. CTA which will automatically add the tailored metrics for users who previously set up KMW using tailored metrics, happens only on initial detection, afterwards it is only one banner variation

[10upsimon]

@zutigrm AC ✅ thanks for clarifying

[zutigrm]

I increased estimate for a point since this issue will require interacting with existing conditionals for 2 previous banner variations, and during testing it should be monitored that this variation does not cause regression to the 2 other variations previously implemented

[eugene-manuilov]

@zutigrm, we need to update IB to account for changes in #9371. Now we need to adjust logic in the widget component instead of in the notification.

[zutigrm]

@eugene-manuilov thanks, IB updated