[RFR] Add withDataProvider HOC and Query/Mutation components to ease custom queries

[ThieryMichel]

Problem

Calling the API directly is a bit cumbersome, especially when handling side effects or chaining calls. We need a better way to do that.

Solution

• Add withDataProvider() HOC
• Document withDataProvider() HOC
• Add <Query> component
• Document <Query> component
• Add <Mutation> component
• Document <Mutation> component
• Use those in the demo example
• Test all that

Note: Of course we'll use a hook for that once we make the move to React 16.8.

Sample Syntax

withDataProvider

import { withDataProvider, showNotification } from 'react-admin';

class PostList extends Component {
    state = {
        posts: [],
    }

    componentDidMount() {
        const { dataProvider, dispatch } = this.props;
        dataProvider('GET_LIST', 'posts', { filter: { status: 'pending' }})
           .then(({ data: posts }) => this.setState({ posts }))
           .catch(error => dispatch(showNotification(error.message, 'error')))
    }

    render() {
        const { posts } = this.state;
        return (
           <Fragment>
               {posts.map((post, index) => <PostDetail post={post} key={key} />)}
           </Fragment>
        );
    }
}

PostList.propTypes = {
    dataProvider: PropTypes.func.isRequired,
};

export default withDataProvider(PostList);

Query

const UserProfile = ({ record }) => (
    <Query type="GET_ONE" resource="users" payload={{ id: record.id }}>
        {({ data, loading, error }) => {
            if (loading) { return <Loading />; }
            if (error) { return <p>ERROR</p>; }
            return <div>User {data.username}</div>;
        }}
    </Query>
);

Mutation

const ApproveButton = ({ record }) => (
    <Mutation
        type="UPDATE"
        resource="comments"
        payload={{ id: record.id, data: { isApproved: true } }}
    >
        {(approve) => (
            <FlatButton label="Approve" onClick={approve} />
        )}
    </Mutation>
);

Closes #2645

[fzaninotto]

withDataProvider isn't tested directly, but across <Query> and <Mutation>. This should be enough. Switching to RFR.

[djhi]

Awesome! And the documentation is really good too 👍

[Kmaschta]

A big step for React Admin users 🎉

The file Actions.md should be renamed to Querying.md.
That said, all the links to the Actions will be broken. (which is already the case, because you renamed all the titles)

IMO, it would be nice the keep the file Actions.md with the current titles but with a big red warning at the top to notice users that the documentation has been updated.
This Actions.md should not be linked to the menu, but still should be available.

[fzaninotto]

I'm not fan of writing a redirection page in Markdown - and I 'm not even sure it's possible. Let's keep the file name (and the URL) as it is, as the menu label has been properly changed.