Fix Yes/No description

[williamphelps13]

Description

Problem Statement

The yesNoUI pattern should allow a key of description with a type of string | JSX.Element | React.ReactNode. This description key is working in the textareaUI: 'condition-that-affects-representation-details'

conditionThatAffectsRepresentationDetails: textareaUI({
      title:
        'Describe the condition or impairment and any treatment you receive now or in the past year',
      labelHeaderLevel: '3', // TODO: Fix labelHeaderLevel for Textarea
      description: ConditionThatAffectsRepresentationDetailsNote,
    }),

Note: there is a different issue in textareaUI here around labelHeaderLevel not being applied that is being solved in The description key is not working in yesNoUI: '/convictions'

uiSchema: {
      [key]: yesNoUI({
        title: question,
        labelHeaderLevel: '3',
        description,
      }),
    },

It is not working whether description is a component like here in '/convictions' or if it is a string (`description: 'This is a test', creates the same screenshot as above.

Implementation Details

• Verify these changes are not possible with the current state of the Forms Library
• Inquire with the Forms Library Tools or other team about this feature proposal and whether they can add it or we can add it (and they review it)
• With this issue, track the issue if they are adding the feature or implement the feature if we are adding it
• NOTE: It appears that the currentOrPastDateRangeUI also cannot take a description. The following does not display anything for the description:

  { title: 'Active service start date' },
    {
      title: 'Active service end date',
      description: MilitaryServiceExperienceNote,
    },

  If it is straightforward to fix description for all form patterns then we should do it.

Mockups/Designs

Acceptance Criteria

• [ ] Description is working in yesNoUI patterns
• [ ] Fix yesNoUI to have description between title and radios

Accessibility (A11y) Testing

• If implementing fix ensure it follows accessibility best practices

[williamphelps13]

Plan:

• Create a DST bug report
• Can follow up on #platform-design-system

This was brought in from product backlog mid-sprint because it is a very small lift to get this started and the biggest challenge may be how long the DST bug report takes to be resolved so it is better to make this In Progress ASAP. Changed to 1pt since we will not be implementing this.

[williamphelps13]

Created DST bug report (which is an issue in the vets-design-system-documentation repo): https://github.com/department-of-veterans-affairs/vets-design-system-documentation/issues/3004

[williamphelps13]

Discussion is occurring in the DST bug report for which team should own this change.

[williamphelps13]

This PR by Robert of #veteran-facing-forms adds the description but points out the following:

Summary

• Allow yesNoUI and radioUI to accept description
• However this is a half-solution. This won't be read out by screen readers. We need support from DST in order to allow that.

I approved this PR and inquired if we should update the bug report or create a new one to track the "support from DST in order to allow that."

[a6marinos]

Most current bug report: https://github.com/department-of-veterans-affairs/vets-design-system-documentation/issues/3059 Once this report is closed, our ticket can be closed out.

[williamphelps13]

^ Asked for update in this Bug Report which has been assigned but have not received a timeline yet

[williamphelps13]

@caw310 said the following:

@williamphelps13 this is tentatively scheduled to be worked on in sprint 8 which starts mid August.

[caw310]

@williamphelps13 I did not see this ticket come through. IF there is a Design System request or bug, please use a template from here. https://github.com/department-of-veterans-affairs/vets-design-system-documentation/issues/new/choose Tickets created from one of those templates automatically put the DST label so it appears on our board and assigns it to me so I see it.

I will transfer this ticket to our repo. Is this blocking work in progress or do you have a work around?

[caw310]

Hey team! Please add your planning poker estimate with Zenhub @Andrew565 @ataker @harshil1793 @it-harrison @jamigibbs @micahchiang @powellkerry @rmessina1010 @rsmithadhoc

[williamphelps13]

@caw310 This is a ticket on the Accredited Representative Facing Team board to track my cross team work in getting the yes/no description working as intended. It entailed two bug reports:

• https://github.com/department-of-veterans-affairs/vets-design-system-documentation/issues/3004 (partially solved by veteran facing forms team PR)
• https://github.com/department-of-veterans-affairs/vets-design-system-documentation/issues/3059 (should solve what the above mentioned PR did not solve)

The second issue is already been prioritized by your team so this ticket does not need to be prioritized. Apologies for tagging you and causing that confusion.

[caw310]

@williamphelps13 do you want to transfer this ticket back to you repo? I will look at 3059 and try to get it into an upcoming sprint.

[williamphelps13]

@caw310 Doesn't look like my PM or myself have permissions to transfer tickets. Are you able to transfer it back?

And thank you for working to get 3059 into the next sprint!

[caw310]

@williamphelps13 this has been transferred back to va.gov-team repo.