Int b 21373 validation submit move details task order with files

[samaysofo]

B-21373

Summary

This pr is to add disabling of the "Submit move details" and "Approve selected" buttons on the Move details page. It also adds and alert message /disabling for "Manage orders" /"Done buttons if there's no uploaded documents. A scroll to view is also added to focus on required fields when data is not entered into a required field.
Is there anything you would like reviewers to give additional scrutiny?

this article explains more about the approach used.

Verification Steps for the Author

These are to be checked by the author.

• Tested in the Experimental environment (for changes to containers, app startup, or connection to data stores)
• Have the Agility acceptance criteria been met for this change?

Verification Steps for Reviewers

These are to be checked by a reviewer.

• Has the branch been pulled in and checked out?
• Have the BL acceptance criteria been met for this change?
• Was the CircleCI build successful?
• Has the code been reviewed from a standards and best practices point of view?

Setup to Run the Code

• Instructions for starting storybook
• Instructions for starting the MilMove application
• Instructions for running tests

How to test

1. Access the application
2. Login as a SC
3. Search for a Move (could be new or already created), navigate to the Move details page.
4. Scroll down to "Orders" section and click the "View and edit orders" button.
5. "Manage orders" and "Done" buttons should be disabled with a message "File upload is required" if there's no document uploaded.
6. Click on the "Save" button, should stay on the same page and receive "Please select one or more files"
7. Upload a document and click the Save button.
8. Should be navigated to the "Move details" page with "Submit move details" button enabled (if all required orders fields are entered).
9. Verify disabling of the Submit move details button by repeating step 4 and then deleting the uploaded document and click the "Cancel" button. When navigated back to the Move details page the Submit move details button should be disabled.
10. Login as a TOO
11. Repeat step 3 - 7
12. Should be navigated to the "Move details" page, select a shipment(Move management seems to be selected by default) and the "Approve selected" button should be enabled.
13. Verify disabling of the Approve selected button by repeating step 4 and then deleting the uploaded document and click the "Cancel" button.
14. Repeat step 12 and the "Approve selected button should be disabled.
15. Login as SC/TOO
16. Repeat step 3 and 4
17. Make sure some of the required fields are not filled out(e.g Date issued, Report by date, Department indicator, Orders number) and scroll out of focus any of the fields not entered.
18. Click on the "Save" button, should scroll to focus the first required field not entered.

Frontend

• There are no aXe warnings for UI.
• This works in Supported Browsers and their phone views (Chrome, Firefox, Edge).
• There are no new console errors in the browser devtools.
• There are no new console errors in the test output.
• If this PR adds a new component to Storybook, it ensures the component is fully responsive, OR if it is intentionally not, a wrapping div using the officeApp class or custom min-width styling is used to hide any states the would not be visible to the user.
• This change meets the standards for Section 508 compliance.

Backend

• Code follows the guidelines for Logging.
• The requirements listed in Querying the Database Safely have been satisfied.

Database

Any new migrations/schema changes:

• Follows our guidelines for Zero-Downtime Deploys.
• Have been communicated to #g-database.
• Secure migrations have been tested following the instructions in our docs.

Screenshots

B-21373-SC_File_Upload.mov

B-21373-TOO-File-Upload.mov

B-21669-ScrollToView-Error.mov

[ryan-mchugh]

Tested locally and looks good!

[antgmann]

So far, everything is looking great. I have noticed some ANDI flags on this page that I may need to open an issue for, but it's unrelated to this PR's changes:

[antgmann]

Another issue unrelated to this PR's changes, these console errors are going to become annoying. Andi doesn't like it either. Separate issue inbound

[antgmann]

Everything looks good and functions as expected, this page has a lot of unrelated messiness that would be nice to clean up in separate issues.

[danieljordan-caci]

So far, everything is looking great. I have noticed some ANDI flags on this page that I may need to open an issue for, but it's unrelated to this PR's changes:

We do have a handy feature that I have been throwing UI changes into. I think it would be appropriate to throw in a blurb in there about fixing these 508/ANDI errors and hopefully get them fixed in the near future.

[antgmann]

We do have a handy feature that I have been throwing UI changes into. I think it would be appropriate to throw in a blurb in there about fixing these 508/ANDI errors and hopefully get them fixed in the near future.

Thanks for the tip! I've added it.
Edit:
Moved from E-06194 to E-05774 per Dre's suggestion

[msaki-caci]

LGTM