[MHV-55186] Update all V1 components to V3 web components on SM MHV #28504

vsaleem · 2024-03-12T16:18:17Z

Summary

V1 Web-Components are retired. This update switches all va-components to utilize the V3 uswds web-components.

Explanation:
The components are currently built so one can flip between v1 and v3. But that bloats the components with code that isn't being used. Once v1 is deprecated we'll commence removing that code.

Also, for the sake of consistency we want to move va.gov to v3 components within a reasonable time frame. Thus hanging on to v1 versions makes that process take longer. @humancompanion-usds

Related issue(s)

[MHV-55186] Update Retired V1 components to V3

Testing done

Manual Testing

To test, start on the 'Messages' landing page and click through all elemental components, (i.g. Accordion, Alerts, Links, etc.), and use google DOM to check if each component contains "uswds" attribute.

Screenshots

Note: This field is mandatory for UI changes (non-component work should NOT have screenshots).

	Before	After
Mobile
Desktop

What areas of the site does it impact?

(Va.gov - Secure Messaging)

Acceptance criteria

AC1 All components have been upgraded to V3

AC2 V3 Components to test:

Va-Accordion
Va-Additional-Info
Va-Alert
Va-Button
Va-Modal
Va-Pagination
Va-Radio
Va-Select
Va-Text-Input
Va-Textarea

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

⚠️ Team Sites (only applies to modifications made to the VA.gov header) ⚠️

The vets-website header does not contain any web-components
I used the proxy-rewrite steps to test the injected header scenario
I reached out in the #sitewide-public-websites Slack channel for questions

Requested Feedback

(OPTIONAL) What should the reviewers know in addition to the above. Is there anything specific you wish the reviewer to assist with. Do you have any concerns with this PR, why?

- Va-Button - Va-Alert - Va-Accordion / Va-Accordion-Item

- Recipient dropdown - CrisisLineConnectionButton - Connect with crisis line button - Edit signature modal - Route leaving guard modal

oleksii-morgun

Awesome 😃 Just one minor comment to get clarification on heading

oleksii-morgun · 2024-03-12T17:14:22Z

src/applications/mhv/secure-messaging/components/AttachmentsList.jsx

+              className="vads-u-margin-bottom--0 vads-u-font-size--base vads-font-family-sans-serif"
+            >
+              File attached
+            </h3>


Was this h3 suggested by a11y? trying to see the rationale behind replacing p with heading tag

…s://github.com/department-of-veterans-affairs/vets-website into 55186-Update-all-V1-components-to-V6-on-sm-mhv

micahchiang

With the merge of this PR on Friday, you should no longer need to include the uswds prop in any of your web component declarations.

oleksii-morgun · 2024-03-18T19:15:27Z

@vsaleem per #28504 (review) as we chatted on Friday, at this point we would only need uswds=false where we need to keep V1 until we work on fixes

…s://github.com/department-of-veterans-affairs/vets-website into 55186-Update-all-V1-components-to-V6-on-sm-mhv

va-vfs-bot

Icon found

Icons can be decorative, but sometimes they are used to convey meaning. If there are any semantics associated with an icon, those semantics should also be conveyed to a screen reader.

What you can do

Review the markup and see if the icon provides information that isn't represented textually, or wait for a VSP review.

va-vfs-bot · 2024-03-18T21:09:40Z

src/applications/mhv/secure-messaging/components/ThreadList/ThreadListItem.jsx

-          ))}
+        {activeFolder.folderId !== DefaultFolders.DRAFTS.id && unreadMessages && (
+          <span>
+            <i


va-vfs-bot · 2024-03-18T21:09:40Z

src/applications/mhv/secure-messaging/components/ThreadList/ThreadListItem.jsx

-          ))}
+        {activeFolder.folderId !== DefaultFolders.DRAFTS.id && unreadMessages && (
+          <span>
+            <i


vsaleem · 2024-04-10T17:49:50Z

Closing this pull request as it is no longer needed. These issues are being handled in individual stories. V3 Component-Issues resulting from upgrade

vsaleem added 6 commits March 3, 2024 22:34

[MHV-55186] Update Message landing components to V3

0b7b250

- Va-Button - Va-Alert - Va-Accordion / Va-Accordion-Item

Merge branch 'main' into 55186-Update-all-V1-components-to-V6-on-sm-mhv

8af53af

[MHV-55186] Updated modals, buttons, and dropdowns with uswds

97c5991

- Recipient dropdown - CrisisLineConnectionButton - Connect with crisis line button - Edit signature modal - Route leaving guard modal

Merge branch 'main' into 55186-Update-all-V1-components-to-V6-on-sm-mhv

91fcdd4

[MHV-55186] Update SM va-components to uswds

f3e129c

Merge branch 'main' into 55186-Update-all-V1-components-to-V6-on-sm-mhv

f8c6800

va-vfs-bot temporarily deployed to master/55186-Update-all-V1-components-to-V6-on-sm-mhv/main March 12, 2024 17:08 Inactive

oleksii-morgun reviewed Mar 12, 2024

View reviewed changes

fazilqa added 2 commits March 12, 2024 13:22

upd: locators and fix failed tests

e5f1783

upd: locators and fix failed tests

2d42ef9

va-vfs-bot temporarily deployed to master/55186-Update-all-V1-components-to-V6-on-sm-mhv/main March 12, 2024 21:06 Inactive

upd: locators and fix failed tests

e3c4798

va-vfs-bot temporarily deployed to master/55186-Update-all-V1-components-to-V6-on-sm-mhv/main March 12, 2024 23:45 Inactive

fazilqa added 3 commits March 13, 2024 09:24

upd: locators and fix failed tests

1870986

upd: locators and fix failed tests

b4f6b5c

upd: locators and fix failed tests

7843bf9

va-vfs-bot temporarily deployed to master/55186-Update-all-V1-components-to-V6-on-sm-mhv/main March 13, 2024 18:41 Inactive

vsaleem added 2 commits March 13, 2024 18:25

[MHV-55186] cleanup; added charcount to sm subject input

20d9637

Merge branch '55186-Update-all-V1-components-to-V6-on-sm-mhv' of http…

d12f76e

…s://github.com/department-of-veterans-affairs/vets-website into 55186-Update-all-V1-components-to-V6-on-sm-mhv

va-vfs-bot temporarily deployed to master/55186-Update-all-V1-components-to-V6-on-sm-mhv/main March 13, 2024 23:27 Inactive

vsaleem and others added 4 commits March 15, 2024 10:50

Merge branch 'main' into 55186-Update-all-V1-components-to-V6-on-sm-mhv

ce2fb22

upd: locators and fix failed tests

5dcbea7

upd: temporary skip failed test

7340055

upd: unskip the test

2f846eb

va-vfs-bot temporarily deployed to master/55186-Update-all-V1-components-to-V6-on-sm-mhv/main March 15, 2024 16:53 Inactive

[MHV-55186] Hotfix to update sm V3 components for release

d219eab

va-vfs-bot temporarily deployed to master/55186-Update-all-V1-components-to-V6-on-sm-mhv/main March 15, 2024 19:35 Inactive

Merge branch 'main' into 55186-Update-all-V1-components-to-V6-on-sm-mhv

dc4ddda

va-vfs-bot temporarily deployed to master/55186-Update-all-V1-components-to-V6-on-sm-mhv/main March 15, 2024 19:58 Inactive

attempt to resolve linting errors

44954e5

vsaleem requested review from a team as code owners March 18, 2024 16:35

vsaleem requested review from ryanshaw, vbahinwillit and simiadebowale March 18, 2024 16:35

micahchiang reviewed Mar 18, 2024

View reviewed changes

va-vfs-bot temporarily deployed to master/55186-Update-all-V1-components-to-V6-on-sm-mhv/main March 18, 2024 17:21 Inactive

vsaleem added 4 commits March 18, 2024 15:49

[MHV-55186] Removing uswds true tags, no longer needed

9fddf13

Merge branch '55186-Update-all-V1-components-to-V6-on-sm-mhv' of http…

0efeccb

…s://github.com/department-of-veterans-affairs/vets-website into 55186-Update-all-V1-components-to-V6-on-sm-mhv

Merge branch 'main' into 55186-Update-all-V1-components-to-V6-on-sm-mhv

07fc403

cleanup

82d7c10

va-vfs-bot requested a review from a team March 18, 2024 21:09

va-vfs-bot reviewed Mar 18, 2024

View reviewed changes

va-vfs-bot temporarily deployed to master/55186-Update-all-V1-components-to-V6-on-sm-mhv/main March 18, 2024 21:10 Inactive

cleanup, format components with eslint

9a08371

va-vfs-bot temporarily deployed to master/55186-Update-all-V1-components-to-V6-on-sm-mhv/main March 18, 2024 21:29 Inactive

cleanup with eslint format

b886ef5

va-vfs-bot temporarily deployed to master/55186-Update-all-V1-components-to-V6-on-sm-mhv/main March 18, 2024 21:34 Inactive

cleanup using eslint

e573e35

va-vfs-bot temporarily deployed to master/55186-Update-all-V1-components-to-V6-on-sm-mhv/main March 18, 2024 21:47 Inactive

vsaleem added 2 commits March 18, 2024 16:50

cleanup files not apart of sm

fdbb3a6

cleanup non-sm file

7320089

va-vfs-bot deployed to master/55186-Update-all-V1-components-to-V6-on-sm-mhv/main March 18, 2024 22:18 View deployment

vsaleem mentioned this pull request Mar 19, 2024

Hot fix that marks uswds components as false, fixes for these compone… #28643

Merged

13 tasks

vsaleem closed this Apr 10, 2024

Provide feedback

Saved searches

Use saved searches to filter your results more quickly

[MHV-55186] Update all V1 components to V3 web components on SM MHV #28504

[MHV-55186] Update all V1 components to V3 web components on SM MHV #28504

vsaleem commented Mar 12, 2024 •

edited

oleksii-morgun left a comment

oleksii-morgun Mar 12, 2024

micahchiang left a comment

oleksii-morgun commented Mar 18, 2024

va-vfs-bot left a comment

va-vfs-bot Mar 18, 2024

va-vfs-bot Mar 18, 2024

vsaleem commented Apr 10, 2024

[MHV-55186] Update all V1 components to V3 web components on SM MHV #28504

[MHV-55186] Update all V1 components to V3 web components on SM MHV #28504

Conversation

vsaleem commented Mar 12, 2024 • edited

Summary

V1 Web-Components are retired. This update switches all va-components to utilize the V3 uswds web-components.

Related issue(s)

[MHV-55186] Update Retired V1 components to V3

Testing done

Screenshots

What areas of the site does it impact?

Acceptance criteria

AC1 All components have been upgraded to V3

AC2 V3 Components to test:

Quality Assurance & Testing

Error Handling

Authentication

⚠️ Team Sites (only applies to modifications made to the VA.gov header) ⚠️

Requested Feedback

oleksii-morgun left a comment

Choose a reason for hiding this comment

oleksii-morgun Mar 12, 2024

Choose a reason for hiding this comment

micahchiang left a comment

Choose a reason for hiding this comment

oleksii-morgun commented Mar 18, 2024

va-vfs-bot left a comment

Choose a reason for hiding this comment

Icon found

What you can do

va-vfs-bot Mar 18, 2024

Choose a reason for hiding this comment

va-vfs-bot Mar 18, 2024

Choose a reason for hiding this comment

vsaleem commented Apr 10, 2024

vsaleem commented Mar 12, 2024 •

edited