From a05788e946ef9d69e514fc432741c8359085f78e Mon Sep 17 00:00:00 2001
From: fzaninotto <fzaninotto@gmail.com>
Date: Sun, 3 Jan 2021 18:21:51 +0100
Subject: [PATCH] [Doc] Fix custom query with Datagrid example uses incorrect
 resource

Closes #5678
---
 docs/List.md | 57 +++++++++++++++++++++++++++++++---------------------
 1 file changed, 34 insertions(+), 23 deletions(-)

diff --git a/docs/List.md b/docs/List.md
index 5811d5c1ca0..9120a62060b 100644
--- a/docs/List.md
+++ b/docs/List.md
@@ -2318,12 +2318,22 @@ const PostList = props => (
 export default withStyles(styles)(PostList);
 ```
 
-**Tip**: You can use the `<Datagrid>` component with [custom queries](./Actions.md#usequery-hook), provided you pass the result to a `<ListContextProvider>`:
+### With Custom Query
+
+You can use the `<Datagrid>` component with [custom queries](./Actions.md#usequery-hook), provided you pass the result to a `<ListContextProvider>`:
 
 {% raw %}
 ```jsx
 import keyBy from 'lodash/keyBy'
-import { useQuery, Datagrid, TextField, Pagination, Loading, ListContextProvider } from 'react-admin'
+import {
+    useQuery,
+    ResourceContextProvider,
+    ListContextProvider
+    Datagrid,
+    TextField,
+    Pagination,
+    Loading,
+} from 'react-admin'
 
 const CustomList = () => {
     const [page, setPage] = useState(1);
@@ -2345,27 +2355,28 @@ const CustomList = () => {
         return <p>ERROR: {error}</p>
     }
     return (
-        <ListContextProvider
-            value={{
-                resource: 'posts',
-                basePath: '/posts',
-                data: keyBy(data, 'id'),
-                ids: data.map(({ id }) => id),
-                currentSort: { field: 'id', order: 'ASC' },
-                selectedIds: [],
-            }}
-        >
-            <Datagrid rowClick="edit">
-                <TextField source="id" />
-                <TextField source="title" />
-            </Datagrid>
-            <Pagination
-                page={page}
-                perPage={perPage}
-                setPage={setPage}
-                total={total}
-            />
-        </ListContextProvider>
+        <ResourceContextProvider value="posts">
+            <ListContextProvider
+                value={{
+                    basePath: '/posts',
+                    data: keyBy(data, 'id'),
+                    ids: data.map(({ id }) => id),
+                    currentSort: { field: 'id', order: 'ASC' },
+                    selectedIds: [],
+                }}
+            >
+                <Datagrid rowClick="edit">
+                    <TextField source="id" />
+                    <TextField source="title" />
+                </Datagrid>
+                <Pagination
+                    page={page}
+                    perPage={perPage}
+                    setPage={setPage}
+                    total={total}
+                />
+            </ListContextProvider>
+        </ResourceContextProvider>
     );
 }
 ```