feat: add adobe analytics tracking id to redocly api block

[melissag-ensemble]

Description

Add Adobe Analytics tracking ID to RedoclyAPIBlock

Related Issue

https://jira.corp.adobe.com/browse/DEVSITE-1307

Motivation and Context

The request from Adobe Experience Platform API team was to be able to track the "Try It" and "Send" button clicks on the Redocly Try It panel. Ideally, we would add the adobe analytics tracking ID directly on those buttons, but since we don't have access to those buttons, I added it to their parent div instead. This resulted in a much simpler code change.

How Has This Been Tested?

1. Created aio-theme RC
2. Update aio-theme version in redocly-test to RC
3. Deploy (because I couldn't run RedoclyAPIBlock locally)
4. Go to https://developer-stage.adobe.com/redocly-test/api-full
5. Open up Adobe Experience Platform Debugger chrome extension
6. Click Try It button
7. Confirm that an analytics event gets logged with Link Name "Redocly-Container" and Activity Map Link "d1d1d1d1d3d1d1d3d3d1d2d1d1B1-Try it"
8. Click Send button
9. Confirm that an analytics event gets logged with Link Name "Redocly-Container" and Activity Map Link "d1d1d1d1d3d1d1d3d3d1d2d1d4B1-Send"

Screenshots (if appropriate):

Types of changes

• Bug fix (non-breaking change which fixes an issue)
• New feature (non-breaking change which adds functionality)
• Breaking change (fix or feature that would cause existing functionality to change)

Checklist:

• I have signed the Adobe Open Source CLA.
• My code follows the code style of this project.
• My change requires a change to the documentation.
• I have updated the documentation accordingly.
• I have read the CONTRIBUTING document.
• I have added tests to cover my changes.
• All new and existing tests passed.

[timkim]

I think we need to think about how we are attaching the specific link tracking. Not sure what exactly fires when you hit the try it button but I'm going to assume that all try it buttons will get captured with Redocly-Container id. We'd ideally like to have the link tracking unique to every try it button. I think in this case we can replace daa-ll with daa-lh which sets just the section for the analytics tracking. And then re-take a look on how we can attach the call to the try it button again...

[melissag-ensemble]

Hi @timkim, I've replaced the attribute with daa-lh and tested with https://developer-stage.adobe.com/redocly-test/api-full/. I think we can differentiate between the different operations and buttons clicked with the three values:

pageUrl = https://developer-stage.adobe.com/redocly-test/api-full/#operation/uploadFile
Activity Map Link = d1d1d1d1d3d1d1d3d3d1d2d1d1B1-Try it
Link Name = Redocly-Container

pageUrl = https://developer-stage.adobe.com/redocly-test/api-full/#operation/uploadFile
Activity Map Link = d1d1d1d1d3d1d1d3d3d1d2d1d4B1-Send
Link Name = Redocly-Container

pageUrl = https://developer-stage.adobe.com/redocly-test/api-full/#operation/addPet
Activity Map Link = d1d1d1d1d3d1d1d3d4d1d2d1d1B1-Try it
Link Name = Redocly-Container

pageUrl = https://developer-stage.adobe.com/redocly-test/api-full/#operation/addPet
Activity Map Link = d1d1d1d1d3d1d1d3d4d1d2d1d4B1-Send
Link Name = Redocly-Container

[melissag-ensemble]

@timkim I'm assuming I'll have to rewrite this once we migrate from Adobe analytics to CJA analytics.

(Hoping I'm able to hook up redocly's TryItOpen and TryItSent events using step 4 in the wiki https://wiki.corp.adobe.com/display/marketingtech/Adobe+Experience+Platform+Integration+Guide. Assuming we don't have that loading issue with gatsby and are able to make a command and trust that it dequeues when _satellite.track is ready)