react-admin
react-admin copied to clipboard
AutocompleteInput resets input when useChoicesContext is called
What you were expecting: useChoiceContext can be called in the scope of a ReferenceInput wrapped AutocompleteInput .
What happened instead: When trying to use the useChoicesContext inside a nested AutocompleteInput calling useChoicesContext causes the input to reset when the user enters values.
Related code:
On the stackblitz link navigate to the comments app and select a comment to edit. On the first Post input try search a new value. The input will be cleared every time you finish typing.
On the second posts input the isLoading value has be set to true. However, no loading indicator or text is displayed.
https://stackblitz.com/edit/github-guchrk?file=src%2Fcomments%2FCommentEdit.tsx
function AutocompleteLoading(props) {
// This call prevents the user from typing. If commented out
// you will be able to enter input.
const choiceContext = useChoicesContext(props);
return (
<AutocompleteInput
create={<CreatePost />}
matchSuggestion={(filterValue, suggestion) => {
const title = `${suggestion.title} - ${suggestion.id}`;
return title.includes(filterValue);
}}
optionText={<OptionRenderer />}
inputText={inputText}
fullWidth
/>
);
}
<ReferenceInput
source="post_id"
reference="posts"
perPage={15}
sort={{ field: 'title', order: 'ASC' }}
>
<AutocompleteLoading />
</ReferenceInput>
Other information:
Our users have complained that the autocomplete (in this use case) does not indicate that it is loading. When trying to use a isLoading flag we noticed that we could no longer enter input when we got the isLoading from the useChoicesContext. Separately even if you put the isLoading flag set to true
the spinning wheel that is on the SelectInput is not shown.
Environment
"react": "18.2.0",
"react-admin": "4.16.18",
"react-dom": "18.2.0",
- React-admin version: 4.16.18
- Last version that did not exhibit the issue (if applicable):
- React version: 18.2.0
- Browser: Chrome
- Stack trace (in case of a JS error): N/A