Skip to content

Commit

Permalink
Add a FormDataConsumer showing the issue
Browse files Browse the repository at this point in the history
  • Loading branch information
djhi committed Dec 16, 2024
1 parent 526d088 commit fa523be
Showing 1 changed file with 94 additions and 0 deletions.
94 changes: 94 additions & 0 deletions packages/ra-ui-materialui/src/form/FormDataConsumer.stories.tsx
Original file line number Diff line number Diff line change
@@ -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',
},
],
});

0 comments on commit fa523be

Please sign in to comment.