Skip to content

Conversation

axelboc
Copy link
Collaborator

@axelboc axelboc commented Sep 17, 2025

Fix #1842

The form is now managed with react-hook-form, with the following validation rules:

  • required and valid number
  • value with beamline attribute limits

For UX, the errors are of course not shown until the form becomes "dirty", that is until the user first tries to submit a value. After that, the validation happens as the user types — this way, they can see quickly if they go over/under the limits.

Screencast.from.2025-09-17.11-44-56.webm

If a server error occurs during submission, the form shows "Unable to set value". In the recording below, I disabled the max validation to demonstrate.

Side note: the server currently responds with a 500 internal server error, which isn't ideal.

Screencast.from.2025-09-17.11-33-23.webm

)}
</ButtonToolbar>
<Form noValidate onSubmit={makeOnSubmit(handleSubmit)}>
<div className="d-flex">
Copy link
Collaborator Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Adding a div here so the error message appears underneath the field and button. The relevant changes can be seen by hiding whitespace changes in GitHub.

@marcus-oscarsson
Copy link
Member

Wouhha, awesome !

@marcus-oscarsson
Copy link
Member

Side note: the server currently responds with a 500 internal server error, which isn't ideal.
What error code should we use, I guess 400 (Bad Request) ?

@marcus-oscarsson
Copy link
Member

Thanks again, very nice !

@marcus-oscarsson marcus-oscarsson merged commit b4dae74 into develop Sep 17, 2025
25 of 26 checks passed
@marcus-oscarsson marcus-oscarsson deleted the ab-attribute-validation branch September 17, 2025 13:15
@axelboc
Copy link
Collaborator Author

axelboc commented Sep 18, 2025

No worries, yeah 400 with a clear error message about the limits or whatever else goes wrong.

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

Successfully merging this pull request may close these issues.

BeamlineAttributeForm does not display errors or handle limits
2 participants