feat(ras-acc): add modal checkout GA4 events

[laurelfulford]

All Submissions:

• [x] Have you followed the Newspack Contributing guideline?
• [x] Does your code follow the WordPress' coding standards and VIP Go coding standards?
• [x] Have you checked to ensure there aren't other open Pull Requests for the same update/change?

Changes proposed in this Pull Request:

Along with https://github.com/Automattic/newspack-blocks/pull/1768, adds GA4 tracking events to the modal checkout.

This is my first time working with our GA4 Data Events, so the exact information being tracked when and why could use some special attention. I'm adding @kmwilkerson as a tester just to make sure it gets her eyes, too!

The following should be tracked:

• When a reader triggers a new modal checkout, including:
  • What block type triggered the checkout.
  • What product was purchased.
  • How much money was spent.
• When a reader fills out the information on the first screen and clicks "Continue".
• When a reader clicks the button to complete the transaction -- for this, we're just tracking intent, and not whether or not the transaction was successful, since that's already captured.

See 1205234045751551-as-1206525965459152

How to test the changes in this Pull Request:

1. Ideally start on a test site connected to GA4.
2. Apply this PR and https://github.com/Automattic/newspack-blocks/pull/1768, and run npm run build.
3. Optionally log events by adding error_log( print_r( $event, true ) ); after this line.
4. Set up a couple checkout situations -- ideally a Donate Block, and at least one Checkout Button Block.
5. Run through the checkout and confirm what's being tracked -- the following params should be tracked for the np_modal_checkout_interaction event, for each step. Some are already baked in to the Data Events, so I bolded the ones added for this event, and I added notes where I wasn't 100% sure what was being captured was correct:

When the modal checkout is opened from a Donation or Checkout Button block:

• logged_in
• ga_session_id
• is_reader
• email_hash
• is_newsletter_subscriber
• is_donor
• is_subscriber
• action (is set to always be form_submission_received, since the modal is triggered by a successful form submission).
• action_type (is donation for any donation purchases, and paid_membership for any other purchase type)
• referer
• amount
• currency
• product_id
• recurrence

When the Continue Button is clicked:

• logged_in
• ga_session_id
• is_reader
• email_hash
• is_newsletter_subscriber
• is_donor
• is_subscriber
• action (is always just form_submission_received)
• modal_pagination (will return 2 when you click Continue or in a weird case where, if you finish up page 1, refresh/navigate away from the page, and restart the checkout since it drops you on page 2).
• amount
• currency
• product_id
• recurrence

Click button to complete purchase:

• logged_in
• ga_session_id
• author
• is_reader
• email_hash
• is_newsletter_subscriber
• is_donor
• is_subscriber
• action (always form_submission_received since we're not tracking success/failure here)
• order_id
• amount
• currency
• product_id
• recurrence

Other information:

• [x] Have you added an explanation of what your changes do and why you'd like us to include them?
• [ ] Have you written new tests for your changes, as applicable?
• [ ] Have you successfully ran tests with your changes locally?

[laurelfulford]

Thanks for the review @chickenn00dle! This should (largely) be ready for review again, but I'm going to confirm some of the GA4 data stuff -- if you'd like to leave it 'til then, I can update here when that bit has been confirmed 🙂

[laurelfulford]

Leaving this one open for now, but I've started reworking this PR here to have a fresh start and add front-end events.

[laurelfulford]

Closing in favour of the reworked draft: https://github.com/Automattic/newspack-plugin/pull/3297