-
Notifications
You must be signed in to change notification settings - Fork 268
New issue
Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.
By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.
Already on GitHub? Sign in to your account
chore: number input #7143
Merged
Merged
chore: number input #7143
Conversation
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
deboer-tim
requested review from
cdrage and
lstocchi
and removed request for
a team
May 8, 2024 21:01
The current number editor in Settings > Preferences works, but it has a few drawbacks: - doesn't match current design, and would need updating to light mode. - periodically has some odd 'resets' to a previous number. (this isn't just the input - figured out later this is #7142) - has two error modes - underline for below minimum, icon to the left for invalid value. - after invalid entry (e.g. below minimum), incrementing does a string add vs numerical. - not easily reusable for editing numbers in other places. This creates a NumberInput component that is just an Input with +/- buttons. Key input is restricted to numbers, and increment/decrement are used to disable +/- appropriately. If the user manually enters a number out of bounds, the Input's error is used to display a short warning. Input required some minor changes to support this: - allow inputClass in order to center numbers in the textbox. - passthrough of key events, in order to block non-numerical entry. - boolean to block showing the error in a separate span. Although this is the design for inputs, it felt really out of place in preferences. - reduce padding slightly - it didn't matter in large Inputs, but number inputs tend to be smaller and extraneous padding was obvious. New component is used in Settings > Preferences and max retry count for running an image. Tests added. NumberItem test had to be changed since only numerical inputs work now. Another part of #3234. Signed-off-by: Tim deBoer <git@tdeboer.ca>
Signed-off-by: Tim deBoer <git@tdeboer.ca>
Signed-off-by: Tim deBoer <git@tdeboer.ca>
Fixed a couple edge cases (min/max of 0, switching in/out of disabled state) and a minor formatting improvement in running containers. Signed-off-by: Tim deBoer <git@tdeboer.ca>
lstocchi
approved these changes
May 9, 2024
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
Played a bit with it and looks good. Once it didn't save my value correctly but i was not able to replicate it again. I was typing random stuff so it is not a normal use case.
LGTM, nice improvement 🚀
benoitf
approved these changes
May 10, 2024
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
Add this suggestion to a batch that can be applied as a single commit.
This suggestion is invalid because no changes were made to the code.
Suggestions cannot be applied while the pull request is closed.
Suggestions cannot be applied while viewing a subset of changes.
Only one suggestion per line can be applied in a batch.
Add this suggestion to a batch that can be applied as a single commit.
Applying suggestions on deleted lines is not supported.
You must change the existing code in this line in order to create a valid suggestion.
Outdated suggestions cannot be applied.
This suggestion has been applied or marked resolved.
Suggestions cannot be applied from pending reviews.
Suggestions cannot be applied on multi-line comments.
Suggestions cannot be applied while the pull request is queued to merge.
Suggestion cannot be applied right now. Please check back later.
What does this PR do?
The current number editor in Settings > Preferences works, but it has a few drawbacks:
This PR creates a NumberInput component that is just an Input with +/- buttons. Key input is restricted to numbers, and increment/decrement are used to disable +/- appropriately. If the user manually enters a number out of bounds, the Input's error is used to display a short warning.
Input required some minor changes to support this:
New component is used in Settings > Preferences and max retry count for running an image.
Screenshot / video of UI
Before:
Screen.Recording.2024-05-08.at.2.33.43.PM.mov
After:
Screen.Recording.2024-05-08.at.4.57.59.PM.mov
What issues does this PR fix or reference?
Another part of #3234.
How to test this PR?
Tests added. NumberItem test had to be changed since only numerical inputs work now.
Try changing some preferences. Be aware of #7142 (separate issue) if the value resets.