Improve Client-Side Validation of Hours

[entrotech]

Overview

When entering hours, you must enter the hours, minutes and meridian (i.e. AM or PM). If you fail to do so, there will be no validation error indication, and the record will not be saved to the database. This needs to be made more robust, otherwise users will think that there information is saved, when, in fact the hours are not saved.

Epic Issue #996 Ideate a self-service system for pantries to verify/update their own info

Dependent Issues #376 Implement Organization Audit UI #683 Implement Client-Side Validation of Phone Number and Email

Action Items

• [x] Implement client-side validation that prevents a user from leaving a time field without valid data.
• [x] Also make sure the user has picked a day of the week, and not leave it blank.
• [ ] See if we can implement validation that prevents common errors like entering duplicate time ranges or ranges that overlap
• [ ] Consider options for more efficiently entering multiple ranges like M-F 9-12 and 1-5.

Resources/Instructions

[Telos8840]

@entrotech the PR I have up should fix the bugs reported in this but we'll need another ticket to help solve for duplicate times since I was running a bit short on time and didn't want that to be a blocker for the other issues currently assigned to me.

I think we can also separate Consider options for more efficiently entering multiple ranges like M-F 9-12 and 1-5. into its own ticket for now since it's more of a nice to have than a bug.

Feel free to assign those tickets to me if you're ok with separating them into their own issues.

[fancyham]

Just to clarify here that "client-side" means that the web browser (i.e. the "client") is validating the entries to make sure that they're parsed correctly into a database-compatible format before the data is submitted to the server. This is in comparison to 'server-side' validation where a data field is sent by the browser to the server and error checking happens on the server.

This is commonly seen in new password validation and other form fields. For example, if someone entered "four pm" in the hours field, then our web page might immediately display an error.

So this could be part of #996, but I believe it's primarily about the org info editing forms that data volunteers use.