[Analytics] [Resources & Support Detail Page - Contact information] Custom GA events removal & web component upgrades

[randimays]

Status

[2024-08-19] [Fran] This requires further discussion about va-telephone (same as #18506) [2024-07-15] [Fran] Noting that this needs to be refined by the team in our next prefinement.

Description

The va-link web component's analytics now include link destination, and va-link-action has been released to the component library. We can now use baked-in analytics on the Resources & Support detail pages where the default contact is used.

Example pages

• https://www.va.gov/resources/managing-your-vagov-profile/ -> "Need more help?"
• https://www.va.gov/resources/how-do-i-get-college-credits-for-my-military-service/ -> "Need more help?"

User story

AS A PO/PM managing Public Websites products & features I WANT to (where appropriate) adopt the va-link or va-link-action component, its baked-in analytics, and remove the custom GA events SO THAT extraneous code is removed and only the events needed will be triggered.

Engineering notes / background

Content-build templates:

• https://github.com/department-of-veterans-affairs/content-build/blob/main/src/site/paragraphs/default_contact.drupal.liquid#L3
• https://github.com/department-of-veterans-affairs/content-build/blob/main/src/site/paragraphs/contact_information.drupal.liquid#L34
• https://github.com/department-of-veterans-affairs/content-build/blob/main/src/site/paragraphs/contact_information.drupal.liquid#L51
• https://github.com/department-of-veterans-affairs/content-build/blob/main/src/site/paragraphs/contact_information.drupal.liquid#L73

This template is also used in Q&A, step by step, checklist templates as well as a few others.

Acceptance criteria

• [ ] Elements: all phone numbers in the "Need more help?" section
  • [ ] convert to va-telephone component
  • [ ] remove custom events
• [ ] Element: all email addresses in the "Need more help?" section
  • [ ] convert to va-link component
  • [ ] remove custom events
• [ ] a11y review

[randimays]

@laflannery This will need to be converted to a va-telephone to use baked-in analytics. Do you know if we are ready to convert this link yet, or if this is blocked by the accessibility effort to fix va-telephone?

[laflannery]

@randimays I believe we can because it's standard, and we did it over on this example page: https://www.va.gov/resources/compare-va-education-benefits/. It's the non-standard numbers that weren't done because we aren't getting the info we need to pass the correct props and use the component properly so we left them as they are.

[randimays]

@laflannery Thank you. Not sure if you saw, I added some extra phone number links to the ticket. Worth mentioning none of these are hardcoded in the FE; they're all coming from Drupal. Still ok to convert them all?

[laflannery]

Ah ok, so those are the ones where I'm not sure we can:

• GI Bill:
  • I'm pretty sure it's going to break if we try to use the standard component and as far as I know it won't work with the vanity prop because I was told this only works with the last 4 digits as the vanity situation.
  • I opened a DST ticket for this though.
  • At the time it wasn't blocking work and we do have some Drupal limitations for this as well because we would need to parse out the vanity piece of this to get it into the component properly. That ticket is here but not a priority at the moment
• International:
  • I did just attempt this in story book and the component doesn't accept the "+" or like more than 10 numbers so if we try to put this in the component it will break the formatting.
  • But depending on how much work we want to put in there maybe is a way to parse it and make it work? Basically can we look to see if we are getting data with +1 at the beginning, if so strip it out and then add the international prop to the component which will add it back but formatted properly
  • Honestly that seems like a lot of work to me but I am not an engineer
  • This Drupal limitation is also covered in the above ticket
• TTY:
  • Similar to the above issues, the component isn't going to understand the non-numerical characters so they aren't going to render.
  • But we could do the complicated parsing thing here as well if that's possible
  • Again, this scenario is covered in the Drupal ticket

I realize this is a lot and I've thought about these various scenarios quite a bit so if you need more clarification on anything that I'm talking about or why I'm saying the things I'm saying let me know!

[randimays]

Thank you @laflannery this is definitely a lot to consider. @FranECross @Agile6MSkinner I moved this to Next Refinement because I think we need wider discussion about what to do with converting things to <va-telephone> where we lack support. There will be other tickets blocked by these things too.

[randimays]

Adding here that we should also nail down exactly what can be input in Drupal so we know how blocked this is or how much overengineering we need to do on the FE to be able to convert to <va-telephone> (and remove custom analytics events).

[randimays]

Also moving this one to the Backlog because this requires further discussion about va-telephone (same as #18506)