Fix warning when passing partial props to useListContext and other view context hooks

[Luwangel]

React-admin wraps lists, create, edit and show views inside contexts. The main goal is to avoid passing props from the top component to every child one by one.

For example an Edit View is composed of multiple layout elements:

• A form
• An action toolbar
• A title
  ...

And these layout elements are composed of atomic elements (and some of them are iterator displaying smaller elements):

• Datagrid (iterator)
• ArrayField (iterator)
• TextInput
• Select

Thanks to the modularity of react-admin, you can write your own atomic elements.

Nevertheless, from a developer perspective, it's difficult to know which props are implicitly injected from the top because there are too many levels of components. And the reason why we added the contexts.

For example, imagine you want to create a custom iterator (a customized list of elements). Thanks to the contexts, you just need to connect the useListContext hook and directly get the props you need like the loaded state, the data, the total number of elements.

---

When we developed the contexts, we deprecated the props mechanism with the intention to remove it in the next major version (v4). During this time, we encouraged the users to change their custom code by displaying a warning:

"Show components must be used inside a <ShowContext.Provider>. Relying on props rather than context to get Show data and callbacks is deprecated and won't be supported in the next major version of react-admin."

---

But, as a result, some smaller components became unusable without surrounding them by the appropriate context. It's the case of the <Datagrid> which now calls the useListContext.

And it's not a pleasant developer experience because it means adding a <ListContext> around your custom iterator. That's why we decided to rely on both props and context.

Starting from this PR, you can override the value of the useListContext, the useEditContext, the useCreateContext and the useShowContext` hooks.

It's as simple as passing arguments to a function, and the props will take precedence over the values of the context.

const context = useListContext(props);

If there is no context, it works too like this <Datagrid> (see the screenshot attached):

<Datagrid
   // You should pass the following props to make it work without a context
   basePath=""
   currentSort={currentSort}
   data={data}
   ids={ids}
   selectedIds={selectedIds}
   loaded={loaded}
   total={total}
>
   <TextField source="id" sortable={false} />
   <TextField source="title" sortable={false} />
</Datagrid>

Todo

• Refact the useListContext, the useEditContext, the useCreateContext and the useShowContext hooks to use props
• Add an example in the simple example
• Write documentation

Screenshot

It's now possible to use a Datagrid without putting it inside a ListContext:

[stensrud]

@Luwangel FYI, this PR broke our production system today. Seems selectedIds always generates a new object on every render, and our code const { selectedIds } = useListContext(); useEffect(()=>{...force rerender...}, [selectedIds]) was fired in an infinite loop.

We were on react-admin version 3.8.3 which depends on ra-core version ^3.8.3 which resolved to 3.12.5.

[fzaninotto]

@stensrud Would you mind opening a new issue for your problem, following the issue template (and providing a way to reproduce the problem)?