[ui-materialui]: Hide <AutoCompleteInput> "Create" option for empty input
#10228
Conversation
Co-authored-by: Gildas Garcia <[email protected]>
| @@ -513,7 +519,7 @@ If you provided a React element for the optionText prop, you must also provide t | |||
| // add create option if necessary | |||
| const { inputValue } = params; | |||
| if (onCreate || create) { | |||
| if (inputValue === '') { | |||
| if (inputValue === '' && createLabel) { | |||
There was a problem hiding this comment.
This part of the docs should be updated to reflect this change: https://marmelab.com/react-admin/AutocompleteInput.html#createlabel
| id: choicesForCreationSupport.length + 1, | ||
| name: filter, | ||
| }; | ||
| choicesForCreationSupport.push(newOption); |
There was a problem hiding this comment.
I've had issues while testing stories like this one, or OnCreate, which I think are due to the fact that running choicesForCreationSupport.push(newOption) does not always trigger a rerender.
I believe choicesForCreationSupport should be turned into a React State to avoid such problems.
In the following recording, the first item I create ('new') does not appear immediately, nor does it appear in the list. But when I create a second item ('new2'), then, suddenly, both items appear in the list.
Capture.video.2024-10-08.18.16.39.mp4
| const newAuthorName = window.prompt( | ||
| 'Enter a new author', | ||
| filter | ||
| ); |
There was a problem hiding this comment.
Removing the prompt from this story (which is a good thing IMO because it was redundant with the ability to fill in the filter), reveals a pre-existing odd behavior: if I click on the "Start typing to create a new item" label, then the value is filled with "Start typing to create a new item", which is probably not what I want. This special entry in the list should not be clickable IMO.
But this can be addressed in another PR since it was already existing.
Capture.video.2024-10-08.18.21.45.mp4
|
DO NOT MERGE -> revert commits are here |
Problem
The “create option on-the-fly” UI of Autocomplete inputs is confusing. I can create an option with "" as value.
Fixes #10043
Solution
Create xxx->xxxHow To Test
ONLY=ra-ui-materialui make storybookhttp://localhost:9010/?path=/story/ra-ui-materialui-input-autocompleteinput--on-createAdditional Checks
masterfor a bugfix, ornextfor a feature- [ ] The PR includes one or several stories (if not possible, describe why)- [ ] The documentation is up to dateScreencasts
Before flash fix:
Capture vidéo du 2024-09-25 19-42-25.webm
After:
Capture vidéo du 2024-09-25 19-43-16.webm