Adds initial mhv-supply-reordering application #33224

radavis · 2024-11-25T19:05:35Z

Are you removing, renaming or moving a folder in this PR?

No, I'm not changing any folders (skip to TeamSites and delete the rest of this section)
Yes, I'm removing, renaming or moving a folder

⚠️ TeamSites ⚠️

Examples of a TeamSite: https://va.gov/health and https://benefits.va.gov/benefits/. This scenario is also referred to as the "injected" header and footer. You can reach out in the #sitewide-public-websites Slack channel for questions.

Did you change site-wide styles, platform utilities or other infrastructure?

No
Yes, and I used the proxy-rewrite steps to test the injected header scenario

Summary

Adds the initial mhv-supply-reordering application to the platform
Adds entry for supply reordering app under /my-health content-build#2354 Sets vagovprod: false so that app is only available in lower environments.

Related issue(s)

Testing done

Follow readme instructions to develop the app, locally
UI for alerting conditions: see containers/Alerts.jsx and components/Alert*.jsx
UI for displaying and selecting supplies, editing email and address
Note: Form submission won't work because this application is a work in progress.

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?

(Describe what parts of the site are impacted if code touched other areas)

Acceptance criteria

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

(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-vfs-bot

ESLint is disabled

vets-website uses ESLint to help enforce code quality. In most situations we would like ESLint to remain enabled.

What you can do

See if the code can be refactored to avoid disabling ESLint, or wait for a VSP review.

va-vfs-bot · 2024-11-25T19:06:57Z

src/applications/mhv-supply-reordering/mocks/in-progress-forms/mdot/index.js

+  },
+};
+
+// eslint-disable-next-line no-unused-vars


ESLint disabled here

va-vfs-bot · 2024-11-25T19:06:58Z

src/applications/mhv-supply-reordering/mocks/in-progress-forms/mdot/index.js

+  ],
+};
+
+// eslint-disable-next-line no-unused-vars


ESLint disabled here

va-vfs-bot · 2024-11-25T19:06:58Z

src/applications/mhv-supply-reordering/mocks/in-progress-forms/mdot/index.js

+  ],
+};
+
+// eslint-disable-next-line no-unused-vars


ESLint disabled here

va-vfs-bot · 2024-11-25T19:06:58Z

src/applications/mhv-supply-reordering/mocks/index.js

@@ -0,0 +1,18 @@
+const delay = require('mocker-api/lib/delay'); // eslint-disable-line no-unused-vars


ESLint disabled here

va-vfs-bot · 2024-11-25T19:06:58Z

src/applications/mhv-supply-reordering/mocks/user/index.js

@@ -0,0 +1,68 @@
+/* eslint-disable camelcase */


ESLint disabled here

acrollet

This is excellent work! I really love seeing all the decomposition and how much cleaner everything is. I have a few small comments but don't see anything show-stopping at all.

acrollet · 2024-11-26T15:27:10Z

src/applications/mhv-supply-reordering/README.md

+
+A web-component-pattern is a group of web-component-fields that can span one or more pages (e.g. - a multi-page form). These can be found at `src/platform/forms-system/src/js/web-component-patterns`.
+
+## Form Flow


I love this thorough README and the docs references!

acrollet · 2024-11-26T15:30:11Z

src/applications/mhv-supply-reordering/components/DlcTelephoneLink.jsx

@@ -0,0 +1,12 @@
+import React from 'react';


really like these clean little components

acrollet · 2024-11-26T15:31:31Z

src/applications/mhv-supply-reordering/components/EditAddress.jsx

+const STATE_NAMES = filteredStates.map(state => state.label);
+
+/*
+const NONBLANK_PATTERN = '^.*\\S.*';


Is the commented out code being kept for a specific reason?

There's still some work to be completed with this component. I'll clear out any commented code.

sorry if I jumped the gun on the review!

acrollet · 2024-11-26T15:32:42Z

src/applications/mhv-supply-reordering/components/EditEmail.jsx

+import React, { useState } from 'react';
+import UnsavedFieldNote from './UnsavedFieldNote';
+
+const EditEmail = ({ data, goToPath, setFormData }) => {


Are we doing any validation on the entered email address?

Hmmm.... Not yet, but we should!

acrollet · 2024-11-26T16:14:43Z

src/applications/mhv-supply-reordering/components/SuppliesUnavailable.jsx

+
+const SuppliesUnavailable = ({ supplies }) => {
+  const cards = supplies
+    ?.sort((a, b) => a.productName.localeCompare(b.productName))


It could be nice to move this logic to a sortedSupplies utility function

acrollet · 2024-11-26T16:20:05Z

src/applications/mhv-supply-reordering/components/alerts/AlertSomethingWentWrong.jsx

+        something went wrong on our end.
+      </p>
+      <p className="vads-u-font-weight--bold vads-u-margin-y--1 vads-u-font-family--serif">
+        What you can do


Should this be a heading? Genuinely not sure.

Couldn't hurt to make this an h4, but I might hold off changing it until an a11y review.

src/applications/mhv-supply-reordering/config/form.js

src/applications/mhv-supply-reordering/mocks/feature-toggles/index.js

acrollet · 2024-11-26T16:40:15Z

src/applications/mhv-supply-reordering/pages/chooseSupplies.jsx

+  suppliesUi,
+} from '../utils/helpers';
+
+const numberOfSuppliesPhrase = count => {


maybe we could move this to a shared utility and use it other places the pattern occurs? (I know I saw it at least one other place)

src/applications/mhv-supply-reordering/selectors/index.js

va-vfs-bot

ESLint is disabled

vets-website uses ESLint to help enforce code quality. In most situations we would like ESLint to remain enabled.

What you can do

See if the code can be refactored to avoid disabling ESLint, or wait for a VSP review.

va-vfs-bot · 2024-11-26T18:55:55Z

src/applications/mhv-supply-reordering/mocks/in-progress-forms/mdot/index.js

@@ -0,0 +1,105 @@
+// eslint-disable-next-line no-unused-vars


ESLint disabled here

nichia

The structure/setup for supply reordering is looking good.

nichia · 2024-11-26T19:33:51Z

src/applications/mhv-supply-reordering/README.md

+
+## App
+
+Form app generated with `yarn app:new`. Changes to the following files were reverted, since `VA_FORM_IDS.FORM_VA_2346A` already exists.


correction: yarn app:new --> yarn new:app

dcloud

I think this is good to move forward. Just some minor feedback below.

One piece of feedback is that you might consider moving/merging your mocks into src/platform/mhv/api/mocks. This is something I keep meaning to discuss around the mhv-landing-page mocks as well, since it seems potentially useful to buy into the shared MHV mocks.

I also approve this assuming you'll address the proptypes warnings in a future PR, though I am ambivalent on the value of proptypes validation myself.

* Adds initial mhv-supply-reorder form app * Adds mocks * Adds alerts * Moves breadcrumbs to IntroductionPage * Sets useTopBackLink: true in formConfig (large continue button) * Show subtitle on IntroductionPage, only * Sets 'Finish this order later' content for save link * Removes margin from paragraph in informative va-alert * Sets Select supplies as first page * Sets supply count, 'No supplies selected/found' text * Adds formatDate helper * Adds checkboxes for selecting supplies * Adds product description * Updates readme * No e2e specs, yet * Adds unit specs

radavis added 19 commits November 15, 2024 14:33

Adds initial mhv-supply-reorder form app

e7f37be

Adds mocks

e1ef873

Additions

2fc3d8d

Adds alerts

6f0f61d

Save point

1640844

Moves breadcrumbs to IntroductionPage

a320df0

Sets useTopBackLink: true in formConfig (large continue button)

3192cb4

Show subtitle on IntroductionPage, only

7c05b66

Sets 'Finish this order later' content for save link

8327774

Removes margin from paragraph in informative va-alert

256a65d

Sets Select supplies as first page

9ecef23

Sets supply count, 'No supplies selected/found' text

e67788c

Adds formatDate helper

217d6ec

Updates

b94d005

Save point

7c96130

Merge branch 'main' into order-supplies

bc02c77

Merge branch 'main' into order-supplies

e626448

Checkboxes!

af807be

Adds product description

f62ece4

radavis requested a review from a team as a code owner November 25, 2024 19:05

va-vfs-bot reviewed Nov 25, 2024

View reviewed changes

Updates readme

ae5e379

radavis mentioned this pull request Nov 25, 2024

Initial version of Supply Reorder app (#32702) #32815

Closed

14 tasks

radavis added 2 commits November 25, 2024 14:19

Removes unused code

46080d3

Readd user.json

9a0848c

radavis requested a review from a team November 25, 2024 19:29

va-vfs-bot temporarily deployed to master/order-supplies/main November 25, 2024 23:25 Inactive

Updates

5a6bab3

va-vfs-bot temporarily deployed to master/order-supplies/main November 26, 2024 15:12 Inactive

radavis requested a review from acrollet November 26, 2024 15:18

Fixes supply phrase

26bafcd

va-vfs-bot temporarily deployed to master/order-supplies/main November 26, 2024 15:30 Inactive

No e2e specs, yet

f4b9e2e

va-vfs-bot temporarily deployed to master/order-supplies/main November 26, 2024 16:39 Inactive

acrollet reviewed Nov 26, 2024

View reviewed changes

Removes commented code, adds unit specs

eb480c3

va-vfs-bot reviewed Nov 26, 2024

View reviewed changes

va-vfs-bot had a problem deploying to master/order-supplies/main November 26, 2024 18:57 Error

Adds selector specs

03e8cc3

va-vfs-bot had a problem deploying to master/order-supplies/main November 26, 2024 20:32 Error

Updates

cb3b951

va-vfs-bot had a problem deploying to master/order-supplies/main November 26, 2024 21:06 Error

Use require instead of import for mocks

4a08315

va-vfs-bot had a problem deploying to master/order-supplies/main November 26, 2024 21:35 Error

Merge branch 'main' into order-supplies

d2afa71

radavis requested a review from acrollet November 26, 2024 22:08

va-vfs-bot had a problem deploying to master/order-supplies/main November 26, 2024 22:13 Error

nichia reviewed Nov 27, 2024

View reviewed changes

Updates readme

2073076

va-vfs-bot temporarily deployed to master/order-supplies/main November 27, 2024 14:09 Inactive

radavis added 2 commits November 27, 2024 11:46

Merge branch 'main' into order-supplies

716cb3f

Merge branch 'main' into order-supplies

8896ca5

va-vfs-bot temporarily deployed to master/order-supplies/main December 2, 2024 16:39 Inactive

dcloud approved these changes Dec 2, 2024

View reviewed changes

va-vfs-bot deployed to master/order-supplies/main December 2, 2024 22:54 View deployment

rsmithadhoc approved these changes Dec 3, 2024

View reviewed changes

radavis merged commit cd0d6bc into main Dec 3, 2024
58 of 59 checks passed

radavis deleted the order-supplies branch December 3, 2024 15:08

platform-support-slack-integration bot mentioned this pull request Dec 5, 2024

Getting 403 response after creating new react application. ... department-of-veterans-affairs/va.gov-team#98437

Closed

Provide feedback

Saved searches

Use saved searches to filter your results more quickly

Adds initial mhv-supply-reordering application #33224

Adds initial mhv-supply-reordering application #33224

radavis commented Nov 25, 2024 •

edited

Loading

va-vfs-bot left a comment

va-vfs-bot Nov 25, 2024

va-vfs-bot Nov 25, 2024

va-vfs-bot Nov 25, 2024

va-vfs-bot Nov 25, 2024

va-vfs-bot Nov 25, 2024

acrollet left a comment

acrollet Nov 26, 2024

acrollet Nov 26, 2024

acrollet Nov 26, 2024

radavis Nov 26, 2024 •

edited

Loading

acrollet Nov 26, 2024

acrollet Nov 26, 2024

radavis Nov 26, 2024

acrollet Nov 26, 2024

acrollet Nov 26, 2024

radavis Nov 26, 2024

acrollet Nov 26, 2024

va-vfs-bot left a comment

va-vfs-bot Nov 26, 2024

nichia left a comment

nichia Nov 26, 2024

dcloud left a comment

		@@ -0,0 +1,18 @@
		const delay = require('mocker-api/lib/delay'); // eslint-disable-line no-unused-vars


		A web-component-pattern is a group of web-component-fields that can span one or more pages (e.g. - a multi-page form). These can be found at `src/platform/forms-system/src/js/web-component-patterns`.

		## Form Flow


		## App

		Form app generated with `yarn app:new`. Changes to the following files were reverted, since `VA_FORM_IDS.FORM_VA_2346A` already exists.

Adds initial mhv-supply-reordering application #33224

Adds initial mhv-supply-reordering application #33224

Conversation

radavis commented Nov 25, 2024 • edited Loading

Are you removing, renaming or moving a folder in this PR?

⚠️ TeamSites ⚠️

Summary

Related issue(s)

Testing done

Screenshots

What areas of the site does it impact?

Acceptance criteria

Quality Assurance & Testing

Error Handling

Authentication

Requested Feedback

va-vfs-bot left a comment

Choose a reason for hiding this comment

ESLint is disabled

What you can do

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

acrollet left a comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

radavis Nov 26, 2024 • edited Loading

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

va-vfs-bot left a comment

Choose a reason for hiding this comment

ESLint is disabled

What you can do

Choose a reason for hiding this comment

nichia left a comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

dcloud left a comment

Choose a reason for hiding this comment

radavis commented Nov 25, 2024 •

edited

Loading

radavis Nov 26, 2024 •

edited

Loading