Standardize Hours component across Facilities

[kevwalsh]

User Story or Problem Statement

• We have 7 fields in Facilities products that contain hours (8 if you include one that will soon be removed).
• 4 contain data with a source in Facility API / VAST
• 3 contain data from CMS editors
  • Vet Center CAPs
  • Service Locations (used on Facility Health services and nonclinical health services)
  • Billing and insurance (copay inquiries phone number hours)

Hours fields in the content model

[Airtable view of hours fields](https://airtable.com/appSg80z9nVWoesxn/tblPdSdScGDeV1Y6f/viwWLkczMV4fvcj7R?blocks=hide)

Discovery into current state

1. Screenshots of every Hours experience on the FE, annotated with content type, example URLs, and number of instances.
2. Screenshots of every CMS form, from a non-admin perspective, placed beside the corresponding FE screenshot
3. Consider grouping these into two broad collections (Hours fields that use Facility API, vs editor-contributed)

FE Design

1. Standardize the FE experience as much as possible, w/r/t to labels, spacing, padding, etc.
2. Contribute a component to design system? (Stretch)

CMS design for editor-contributed data

1. Should we require a value on every row
2. Experience when each row is required - UX labels,
3. Experience for time pickers (separate issue?)
4. Any help text
5. (Stretch) Blue sky the design for Hours widget, including things like Google's "copy" functionality, which is available in our Drupal contrib module.

CMS design for fields with upstream data source

1. What should this look like?

Screenshots from Google and Slack

 Slack's hour picker. 30 minute increments but let's the editor override with the keyboard.

Acceptance Criteria

• [ ] Testable_Outcome_X
• [ ] Testable_Outcome_Y
• [ ] Testable_Outcome_Z
• [ ] Requires design review
• [ ] Requires KB article update

Implementation steps

## Design principles Veteran-centered - [ ] `Single source of truth`: Increase reliability and consistency of content on VA.gov by providing a single source of truth. - [ ] `Accessible, plain language`: Provide guardrails and guidelines to ensure content quality. - [ ] `Purposely structured content`: Ensure Content API can deliver content whose meaning matches its structure. - [ ] `Content lifecycle governance`: Produce tools, processes and policies to maintain content quality throughout its lifecycle. Editor-centered - [ ] `Purpose-driven`: Create an opportunity to involve the editor community in VA’s mission and content strategy goals. - [ ] `Efficient`: Remove distractions and create clear, straightforward paths to get the job done. - [ ] `Approachable`: Offer friendly guidance over authoritative instruction. - [ ] `Consistent`: Reduce user’s mental load by allowing them to fall back on pattern recognition to complete tasks. - [ ] `Empowering`: Provide clear information to help editors make decisions about their work. ### CMS Team Please check the team(s) that will do this work. - [ ] `Sitewide program` - [ ] `Platform CMS Team` - [ ] `Sitewide crew ` (leave Sitewide unchecked and check the specific team instead) - [ ] `⭐️ Content ops` - [ ] `⭐️ CMS experience` - [ ] `⭐️ Public websites` - [x] `⭐️ Facilities` - [ ] `⭐️ User support`

[swirtSJW]

Most are are using line labels of "Mon." but the facilities are using "Mon:" which seems better. Which ever is chosen, we will need to standardize

Non-related guidance https://design.va.gov/content-style-guide/dates-and-numbers#:~:text=Mon.%2C%20Tue.%2C%20Wed.%2C%20Thu.%2C%20Fri.%2C%20Sat.%2C%20Sun.

related discussion

[davidmpickett]

Closing as all issues are complete