Skip to content

Commit 9713d88

Browse files
authored
Merge pull request #5726 from marmelab/Fix-custom-qury-in-datagrid-documentation
[Doc] Fix custom query with Datagrid example uses incorrect resource
2 parents 24c6d68 + a05788e commit 9713d88

File tree

1 file changed

+34
-23
lines changed

1 file changed

+34
-23
lines changed

docs/List.md

+34-23
Original file line numberDiff line numberDiff line change
@@ -2318,12 +2318,22 @@ const PostList = props => (
23182318
export default withStyles(styles)(PostList);
23192319
```
23202320

2321-
**Tip**: You can use the `<Datagrid>` component with [custom queries](./Actions.md#usequery-hook), provided you pass the result to a `<ListContextProvider>`:
2321+
### With Custom Query
2322+
2323+
You can use the `<Datagrid>` component with [custom queries](./Actions.md#usequery-hook), provided you pass the result to a `<ListContextProvider>`:
23222324

23232325
{% raw %}
23242326
```jsx
23252327
import keyBy from 'lodash/keyBy'
2326-
import { useQuery, Datagrid, TextField, Pagination, Loading, ListContextProvider } from 'react-admin'
2328+
import {
2329+
useQuery,
2330+
ResourceContextProvider,
2331+
ListContextProvider
2332+
Datagrid,
2333+
TextField,
2334+
Pagination,
2335+
Loading,
2336+
} from 'react-admin'
23272337

23282338
const CustomList = () => {
23292339
const [page, setPage] = useState(1);
@@ -2345,27 +2355,28 @@ const CustomList = () => {
23452355
return <p>ERROR: {error}</p>
23462356
}
23472357
return (
2348-
<ListContextProvider
2349-
value={{
2350-
resource: 'posts',
2351-
basePath: '/posts',
2352-
data: keyBy(data, 'id'),
2353-
ids: data.map(({ id }) => id),
2354-
currentSort: { field: 'id', order: 'ASC' },
2355-
selectedIds: [],
2356-
}}
2357-
>
2358-
<Datagrid rowClick="edit">
2359-
<TextField source="id" />
2360-
<TextField source="title" />
2361-
</Datagrid>
2362-
<Pagination
2363-
page={page}
2364-
perPage={perPage}
2365-
setPage={setPage}
2366-
total={total}
2367-
/>
2368-
</ListContextProvider>
2358+
<ResourceContextProvider value="posts">
2359+
<ListContextProvider
2360+
value={{
2361+
basePath: '/posts',
2362+
data: keyBy(data, 'id'),
2363+
ids: data.map(({ id }) => id),
2364+
currentSort: { field: 'id', order: 'ASC' },
2365+
selectedIds: [],
2366+
}}
2367+
>
2368+
<Datagrid rowClick="edit">
2369+
<TextField source="id" />
2370+
<TextField source="title" />
2371+
</Datagrid>
2372+
<Pagination
2373+
page={page}
2374+
perPage={perPage}
2375+
setPage={setPage}
2376+
total={total}
2377+
/>
2378+
</ListContextProvider>
2379+
</ResourceContextProvider>
23692380
);
23702381
}
23712382
```

0 commit comments

Comments
 (0)