Add GA events for "Top Earning Pages" success notification

[tofumatt]

Feature Description

GA events (eg. trackEvent calls) should be added to the new "Top Earnings Pages" notification that appears after successful AdSense + GA4 integration/connection. There should be one when a user views the notification one when they click the "Show me" CTA button in the notification, and another when the user dismisses the notification with the "Got it" button.

---

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

Acceptance criteria

• When the AdSense + GA connected notification is shown (see #8238), the following trackEvent calls should be made:
  • trackEvent( `{viewContext}_top-earning-pages-success-notification`, 'view_notification' ) when the notification is rendered and shown to the user
  • trackEvent( `{viewContext}_top-earning-pages-success-notification`, 'confirm_notification' ) when the user clicks the "Got it"/primary CTA

CTA widget screenshot:

Implementation Brief

• [ ] Add trackEvent( `{viewContext}_top-earning-pages-success-notification`, 'view_notification' ) to https://github.com/google/site-kit-wp/blob/902f409b8c9010dd89f296d97a7507ca41d82e2a/assets/js/components/notifications/GA4AdSenseLinkedNotification.js#L46 when the component doesn't render null, likely in a useEffect that should only call trackEvent once per page load.
• [ ] Add trackEvent( `{viewContext}_top-earning-pages-success-notification`, 'confirm_notification' ) to the onClick function of the primary button at https://github.com/google/site-kit-wp/blob/902f409b8c9010dd89f296d97a7507ca41d82e2a/assets/js/components/notifications/GA4AdSenseLinkedNotification.js#L212-L214, eg https://github.com/google/site-kit-wp/blob/902f409b8c9010dd89f296d97a7507ca41d82e2a/assets/js/components/notifications/GA4AdSenseLinkedNotification.js#L133-L135

Test Coverage

• We're lacking track event test coverage code I think, so adding tests here is a bit out-of-scope.

QA Brief

• Verify that GA events are tracked for the GA4AdSenseLinkedNotification banner as per the AC.
• See the QA brief here #8238 on how to enforce showing this notification on the dashboard.

Changelog entry

• Add Analytics events to AdSense + Analytics success notification.

[tofumatt]

(Moving to stalled because this component doesn't exist yet.)

[ivonac4]

@tofumatt is it maybe possible to add dependencies here? I don't know if the tickets for these component's exist already or not. In case they don't, can we add them later.

[tofumatt]

@ivonac4 Right now we don't have issues for it. In fact, I'm not quite sure what these events correspond to because I don't see mention of this component in the design doc either, I don't think.

@marrrmarrr Do you have a Figma design/screenshot/reference for the component that the view_overlay_CTA + {viewContext}_top-earning-pages-widget event corresponds to from the Analytics events document? I'm not sure what it's for, so I created this issue just to note that we hadn't implemented the event, but I'm actually not sure what it's for 😓

[tofumatt]

@ivonac4 I've updated this as blocked by #8238, now that we have that filed 😄

[tofumatt]

Leaving this one in AC with me until we move #8238 into IB, because the events fired will depend on how many (1 or 2) CTAs there are 🙂

[eugene-manuilov]

IB ✔️

[wpdarren]

QA Update: ✅

Verified:

When the AdSense + GA connected notification is shown the following trackEvent calls are made:

• trackEvent( {viewContext}_top-earning-pages-success-notification, 'view_notification' ) when the notification is rendered and shown to the user
• trackEvent( {viewContext}_top-earning-pages-success-notification, 'confirm_notification' ) when the user clicks the "Got it" CTA.

Screenshots