From fa523be93a353d70709ad2fe53a8fcb98c035878 Mon Sep 17 00:00:00 2001
From: Gildas <1122076+djhi@users.noreply.github.com>
Date: Mon, 16 Dec 2024 17:20:17 +0100
Subject: [PATCH] Add a FormDataConsumer showing the issue

---
 .../src/form/FormDataConsumer.stories.tsx     | 94 +++++++++++++++++++
 1 file changed, 94 insertions(+)
 create mode 100644 packages/ra-ui-materialui/src/form/FormDataConsumer.stories.tsx

diff --git a/packages/ra-ui-materialui/src/form/FormDataConsumer.stories.tsx b/packages/ra-ui-materialui/src/form/FormDataConsumer.stories.tsx
new file mode 100644
index 0000000000..8a0f83ce39
--- /dev/null
+++ b/packages/ra-ui-materialui/src/form/FormDataConsumer.stories.tsx
@@ -0,0 +1,94 @@
+import * as React from 'react';
+import { FormDataConsumer, required, ResourceContextProvider } from 'ra-core';
+import fakeRestDataProvider from 'ra-data-fakerest';
+import { AdminContext } from '../AdminContext';
+import { AutocompleteInput, ReferenceInput, TextInput } from '../input';
+import { SimpleForm } from './SimpleForm';
+import { Create } from '../detail';
+
+export default { title: 'ra-core/form/FormDataConsumer' };
+
+export const Basic = () => (
+    <AdminContext dataProvider={dataProvider}>
+        <ResourceContextProvider value="posts">
+            <Create>
+                <SimpleForm>
+                    <TextInput source="title" />
+                    <FormDataConsumer<any>>
+                        {({ formData }) => {
+                            console.log({ formData });
+                            if (!!formData.title) {
+                                return (
+                                    <ReferenceInput
+                                        source="userId"
+                                        reference="users"
+                                    >
+                                        <AutocompleteInput
+                                            shouldUnregister
+                                            label="User"
+                                            optionText={choice =>
+                                                `${choice.name} /  (${choice.id})`
+                                            }
+                                            // optionValue="userId"
+                                            noOptionsText="User does'nt exist"
+                                            isRequired
+                                            validate={[
+                                                required('User is Required.'),
+                                            ]}
+                                        />
+                                    </ReferenceInput>
+                                );
+                            } else return null;
+                        }}
+                    </FormDataConsumer>
+                    <TextInput source="body" multiline rows={5} />
+                </SimpleForm>
+            </Create>
+        </ResourceContextProvider>
+    </AdminContext>
+);
+
+const dataProvider = fakeRestDataProvider({
+    users: [
+        {
+            id: 1,
+            name: 'Leanne Graham',
+        },
+        {
+            id: 2,
+            name: 'Ervin Howell',
+        },
+        {
+            id: 3,
+            name: 'Clementine Bauch',
+        },
+        {
+            id: 4,
+            name: 'Patricia Lebsack',
+        },
+        {
+            id: 5,
+            name: 'Chelsey Dietrich',
+        },
+        {
+            id: 6,
+            name: 'Mrs. Dennis Schulist',
+        },
+        {
+            id: 7,
+            name: 'Kurtis Weissnat',
+        },
+        {
+            id: 8,
+            name: 'Nicholas Runolfsdottir V',
+        },
+        {
+            id: 9,
+            name: 'Glenna Reichert',
+        },
+        {
+            id: 10,
+            name: 'Clementina DuBuque',
+        },
+    ],
+});