VACMS 18724 - Adds mission explainer to Vet Centers

[eselkin]

DO NOT MERGE UNTIL NOTIFICATIONS MADE TO VET CENTER EDITORS

Summary

• Adds mission explainer query to graphQL and pulls it into the layout for Vet Centers.
• Sitewide team (owns Vet Center facility pages and queries)

Related issue(s)

• FE: Add "Mission Explainer" / "Our commitment" Box to VetCenter Facility Pages va.gov-cms#18724

Testing done

• No mission explainer prior
• Verify mission explainer exists on Vet Center pages that have the centralized content (in some tugboats there may be some that do not have it, but in prod and staging all do now)

Screenshots

Vet Center Page with mission explainer (Boston Vet Center) - Desktop (above 768px)

Vet Center Page with mission explainer (Boston Vet Center) - below 768px

Vet Center Page missing mission explainer in tugboat (looks exactly the same as current Vet Center) - fixed in prod and staging so this does not occur but added to show logic exists if some VC removes it somehow

What areas of the site does it impact?

Affects Vet Center pages

Acceptance criteria

• Blue Summary Box exists at the top all VetCenter facility pages
• Includes content from Mission Explainer content block created in Drupal: Add "Mission Explainer" Content Block to VetCenter Centralized Content va.gov-cms#18723
• The blue summary box must use the existing "Summary Box" design component and follow all applicable annotations indicated here in Figma.

Quality Assurance & Testing

• I fixed|updated|added unit tests and integration tests for each feature (if applicable).
• No sensitive information (i.e. PII/credentials/internal URLs/etc.) is captured in logging, hardcoded, or specs
• Linting warnings have been addressed
• Documentation has been updated (link to documentation *if necessary)
• Screenshot of the developed feature is added
• Accessibility testing has been performed

Error Handling

• Browser console contains no warnings or errors.
• Events are being sent to the appropriate logging solution
• Feature/bug has a monitor built into Datadog or Grafana (if applicable)

Authentication

• Did you login to a local build and verify all authenticated routes work as expected with a test user

Requested Feedback

Check https://web-rdikukigkjapf0z74ocsofi8izmc2gmo.demo.cms.va.gov/boston-vet-center/
If this is reset before you view, re-release content on that tugboat with 2307 as the PR for content-build.

Check page/component at 767px or lower and 769px or greater. At 767px or lower, should have a margin of 32px below mission explainer and above va-on-this-page component (with a border). At 769px or greater, should not have this margin, because the lack of border makes it appear far enough away from the va-on-this-page content

[eselkin]

The RI doesn't have the change or the Vet Center on the RI CMS doesn't have the centralized content.

[randimays]

We may want some vertical space between the mission explainer box and the "On this page" component since the OTP component has a border on mobile. @thejordanwood

[thejordanwood]

@randimays I agree. Can we get 32px (vads-spacing-4) between the mission explainer and the "On this page" component on mobile?

[eselkin]

Yep, probably a margin of that size on the bottom. will add. Just on mobile only though? @thejordanwood

[thejordanwood]

@eselkin Yes, just for mobile. I think desktop looks fine.

[eselkin]

Since the box and no margin starts beneath 768px (medium-screen), I made the margin 4 (32px) below medium screen, and 0 otherwise. @randimays after it builds again I'll ping you (probably tomorrow).

[randimays]

LGTM

[jilladams]

@laflannery @thejordanwood flagging: this ticket has Design / A11y review in ACs, and I'm not sure if you've seen it yet. It exists if you'd like to take a look, though.

[jilladams]

@laflannery @thejordanwood flagging: this ticket has Design / A11y review in ACs, and I'm not sure if you've seen it yet. It exists if you'd like to take a look, though.

JK, the RI is down. Ugh. We'll have to fix that up first.

[randimays]

I re-ran the Jenkins job which will hopefully get the RI back up and running (maybe in 15-20 mins? - honestly not sure how long it takes).

[eselkin]

I think it takes more than 40 minutes for RI to spin up usually.

[eselkin]

I forgot, I had: https://web-rdikukigkjapf0z74ocsofi8izmc2gmo.demo.cms.va.gov/boston-vet-center/ because of the RI being odd

@jilladams @laflannery @thejordanwood

[laflannery]

LGTM!

[thejordanwood]

Looks good to me!