Fix <AutocompleteInput> field value becomes "@@ra-create" when onCreate returns nothing

packages/ra-core/src/controller/input/useSupportCreateSuggestion.spec.tsx

@@ -84,6 +84,22 @@ describe('useSupportCreateSuggestion', () => {
         });
         fireEvent.click(await screen.findByText('Simulate click on create'));
         await screen.findByText('"foo"');
+        expect(screen.getByLabelText('Autocomplete value')).toHaveValue(
+            'new_id_from_onCreate'
+        );
+    });
+
+    it('keeps the current value when onCreate returns nothing', async () => {
+        render(<UseSupportCreateSuggestion onCreateReturnsNothing />);
+        fireEvent.change(await screen.findByLabelText('Autocomplete value'), {
+            target: { value: 'bar' },
+        });
+        fireEvent.change(await screen.findByLabelText('Autocomplete filter'), {
+            target: { value: 'foo' },
+        });
+        fireEvent.click(await screen.findByText('Simulate click on create'));
+        await screen.findByText('"foo"');
+        expect(screen.getByLabelText('Autocomplete value')).toHaveValue('bar');
     });
 
     it('renders the create element with the filter as default value when the createItem is clicked', async () => {

packages/ra-core/src/controller/input/useSupportCreateSuggestion.stories.tsx

@@ -41,14 +41,14 @@ export const UseSupportCreateSuggestion = (
         | 'createValue'
         | 'createHintValue'
         | 'optionText'
-    > & { withCreateElement?: boolean }
+    > & { withCreateElement?: boolean; onCreateReturnsNothing?: boolean }
 ) => {
     const [value, setValue] = React.useState<string>('');
     const [filter, setFilter] = React.useState<string>('');
     const [createParams, setCreateParams] = React.useState<any>(null);
     const [onCreateParams, setOnCreateParams] = React.useState<any>(null);
 
-    const { withCreateElement, ...rest } = options;
+    const { withCreateElement, onCreateReturnsNothing, ...rest } = options;
 
     const {
         createId,
@@ -60,12 +60,15 @@ export const UseSupportCreateSuggestion = (
     } = useSupportCreateSuggestion({
         filter,
         handleChange: eventOrValue => {
-            setValue(eventOrValue?.target?.value ?? eventOrValue.id);
+            setValue(
+                eventOrValue?.target?.value ?? eventOrValue?.id ?? eventOrValue
+            );
         },
         onCreate: withCreateElement
             ? undefined
             : arg => {
                   setOnCreateParams(arg);
+                  if (onCreateReturnsNothing) return;
                   return { id: 'new_id_from_onCreate' };
               },
         create: withCreateElement ? <CreateElement /> : undefined,
@@ -152,4 +155,5 @@ UseSupportCreateSuggestion.argTypes = {
     createHintValue: { control: 'text' },
     optionText: { control: 'text' },
     withCreateElement: { control: 'boolean' },
+    onCreateReturnsNothing: { control: 'boolean' },
 };

packages/ra-core/src/controller/input/useSupportCreateSuggestion.tsx

@@ -93,8 +93,8 @@ export const useSupportCreateSuggestion = (
                     const newSuggestion = await onCreate(filter);
                     if (newSuggestion) {
                         handleChange(newSuggestion);
-                        return;
                     }
+                    return;
                 } else {
                     setRenderOnCreate(true);
                     return;

packages/ra-ui-materialui/src/input/AutocompleteInput.spec.tsx

@@ -28,6 +28,7 @@ import {
     OnCreate,
     OnCreateWithAutoSelect,
     OnCreateSlow,
+    OnCreatePrompt,
     CreateLabel,
     CreateItemLabel,
     CreateItemLabelRendered,
@@ -1541,6 +1542,32 @@ describe('<AutocompleteInput />', () => {
             expect(input.value).toBe('x');
         }, 10000);
 
+        it('should keep the current value when onCreate returns nothing', async () => {
+            const promptSpy = jest
+                .spyOn(window, 'prompt')
+                .mockImplementation(() => null);
+            render(<OnCreatePrompt />);
+            const input = (await screen.findByLabelText(
+                'Author'
+            )) as HTMLInputElement;
+            await waitFor(() => {
+                expect(input.value).toBe('Leo Tolstoy');
+            });
+            fireEvent.focus(input);
+            fireEvent.change(input, { target: { value: 'x' } });
+            fireEvent.click(await screen.findByText('Create x'));
+            await waitFor(() => {
+                expect(promptSpy).toHaveBeenCalled();
+            });
+            await waitFor(() => {
+                expect(screen.queryAllByRole('option')).toHaveLength(0);
+            });
+            expect(input.value).toBe('x');
+            // the field value did not change, so the form is still pristine
+            expect(screen.getByLabelText('Save')).toBeDisabled();
+            promptSpy.mockRestore();
+        });
+
         it('should include an option with the custom createLabel when the input is empty and optionText is a string', async () => {
             render(<CreateLabel optionText="full_name" />);
             const input = (await screen.findByLabelText(