diff --git a/docs/Upgrade.md b/docs/Upgrade.md
index 431177638e2..71ddcf2b4e6 100644
--- a/docs/Upgrade.md
+++ b/docs/Upgrade.md
@@ -971,6 +971,42 @@ export const MyRemoveButton = (props: ButtonProps) => {
}
```
+## `ra-data-graphql` And `ra-data-graphql-simple` No Longer Return A Promise
+
+The Graphql data providers builders used to return a promise that made admins initialization complicated. This is no longer needed.
+
+```diff
+// in App.js
+import React from 'react';
+import { Component } from 'react';
+import buildGraphQLProvider from 'ra-data-graphql-simple';
+import { Admin, Resource } from 'react-admin';
+
+import { PostCreate, PostEdit, PostList } from './posts';
+
++ const dataProvider = buildGraphQLProvider({ clientOptions: { uri: 'http://localhost:4000' } });
+
+const App = () => {
+- const [dataProvider, setDataProvider] = React.useState(null);
+- React.useEffect(() => {
+- buildGraphQLProvider({ clientOptions: { uri: 'http://localhost:4000' } })
+- .then(graphQlDataProvider => setDataProvider(() => graphQlDataProvider));
+- }, []);
+
+- if (!dataProvider) {
+- return
Loading < /div>;
+- }
+
+ return (
+
+
+
+ );
+}
+
+export default App;
+```
+
## Upgrading to v4
If you are on react-admin v3, follow the [Upgrading to v4](https://marmelab.com/react-admin/doc/4.16/Upgrade.html) guide before upgrading to v5.
diff --git a/examples/demo/src/dataProvider/graphql.ts b/examples/demo/src/dataProvider/graphql.ts
index 458e73edc39..5c5108dfe22 100644
--- a/examples/demo/src/dataProvider/graphql.ts
+++ b/examples/demo/src/dataProvider/graphql.ts
@@ -112,8 +112,8 @@ const customBuildQuery: BuildQueryFactory = introspectionResults => {
};
};
-export default async () => {
- const dataProvider = await buildApolloClient({
+export default () => {
+ const dataProvider = buildApolloClient({
clientOptions: {
uri: 'http://localhost:4000/graphql',
},
diff --git a/packages/ra-data-graphql-simple/README.md b/packages/ra-data-graphql-simple/README.md
index bbbaefd6e15..be7507e5ad9 100644
--- a/packages/ra-data-graphql-simple/README.md
+++ b/packages/ra-data-graphql-simple/README.md
@@ -36,24 +36,13 @@ import { Admin, Resource } from 'react-admin';
import { PostCreate, PostEdit, PostList } from './posts';
-const App = () => {
+const dataProvider = buildGraphQLProvider({ buildQuery });
- const [dataProvider, setDataProvider] = React.useState(null);
- React.useEffect(() => {
- buildGraphQLProvider({ clientOptions: { uri: 'http://localhost:4000' } })
- .then(graphQlDataProvider => setDataProvider(() => graphQlDataProvider));
- }, []);
-
- if (!dataProvider) {
- return
Loading < /div>;
- }
-
- return (
-
-
-
- );
-}
+const App = () => (
+
+
+
+);
export default App;
```
diff --git a/packages/ra-data-graphql-simple/src/index.ts b/packages/ra-data-graphql-simple/src/index.ts
index e80bd02d0ca..24be1dee85b 100644
--- a/packages/ra-data-graphql-simple/src/index.ts
+++ b/packages/ra-data-graphql-simple/src/index.ts
@@ -30,7 +30,7 @@ export default (
buildQuery?: BuildQueryFactory;
bulkActionsEnabled?: boolean;
}
-): Promise
=> {
+): DataProvider => {
const { bulkActionsEnabled = false, ...dPOptions } = merge(
{},
defaultOptions,
@@ -43,55 +43,54 @@ export default (
bulkActionOperationNames
);
- return buildDataProvider(dPOptions).then(defaultDataProvider => {
- return {
- ...defaultDataProvider,
- // This provider defaults to sending multiple DELETE requests for DELETE_MANY
- // and multiple UPDATE requests for UPDATE_MANY unless bulk actions are enabled
- // This can be optimized using the apollo-link-batch-http link
- ...(bulkActionsEnabled
- ? {}
- : {
- deleteMany: (resource, params) => {
- const { ids, ...otherParams } = params;
- return Promise.all(
- ids.map(id =>
- defaultDataProvider.delete(resource, {
- id,
- previousData: null,
- ...otherParams,
- })
- )
- ).then(results => {
- const data = results.reduce(
- (acc, { data }) => [...acc, data.id],
- []
- );
+ const defaultDataProvider = buildDataProvider(dPOptions);
+ return {
+ ...defaultDataProvider,
+ // This provider defaults to sending multiple DELETE requests for DELETE_MANY
+ // and multiple UPDATE requests for UPDATE_MANY unless bulk actions are enabled
+ // This can be optimized using the apollo-link-batch-http link
+ ...(bulkActionsEnabled
+ ? {}
+ : {
+ deleteMany: (resource, params) => {
+ const { ids, ...otherParams } = params;
+ return Promise.all(
+ ids.map(id =>
+ defaultDataProvider.delete(resource, {
+ id,
+ previousData: null,
+ ...otherParams,
+ })
+ )
+ ).then(results => {
+ const data = results.reduce(
+ (acc, { data }) => [...acc, data.id],
+ []
+ );
- return { data };
- });
- },
- updateMany: (resource, params) => {
- const { ids, data, ...otherParams } = params;
- return Promise.all(
- ids.map(id =>
- defaultDataProvider.update(resource, {
- id,
- data: data,
- previousData: null,
- ...otherParams,
- })
- )
- ).then(results => {
- const data = results.reduce(
- (acc, { data }) => [...acc, data.id],
- []
- );
+ return { data };
+ });
+ },
+ updateMany: (resource, params) => {
+ const { ids, data, ...otherParams } = params;
+ return Promise.all(
+ ids.map(id =>
+ defaultDataProvider.update(resource, {
+ id,
+ data: data,
+ previousData: null,
+ ...otherParams,
+ })
+ )
+ ).then(results => {
+ const data = results.reduce(
+ (acc, { data }) => [...acc, data.id],
+ []
+ );
- return { data };
- });
- },
- }),
- };
- });
+ return { data };
+ });
+ },
+ }),
+ };
};
diff --git a/packages/ra-data-graphql/README.md b/packages/ra-data-graphql/README.md
index 1d9ed087345..5673a604222 100644
--- a/packages/ra-data-graphql/README.md
+++ b/packages/ra-data-graphql/README.md
@@ -51,24 +51,13 @@ import { Admin, Resource } from 'react-admin';
import buildQuery from './buildQuery'; // see Specify your queries and mutations section below
import { PostCreate, PostEdit, PostList } from '../components/admin/posts';
-const App = () => {
- const [dataProvider, setDataProvider] = useState(null);
+const dataProvider = buildGraphQLProvider({ buildQuery });
- useEffect(() => {
- buildGraphQLProvider({ buildQuery })
- .then(dataProvider => setDataProvider(dataProvider));
- }, []);
-
- if (!dataProvider) {
- return Loading
;
- }
-
- return (
-
-
-
- );
-}
+const App = () => (
+
+
+
+);
export default App;
```
diff --git a/packages/ra-data-graphql/src/index.ts b/packages/ra-data-graphql/src/index.ts
index b20ac8b412c..9e5d3425a8a 100644
--- a/packages/ra-data-graphql/src/index.ts
+++ b/packages/ra-data-graphql/src/index.ts
@@ -127,10 +127,7 @@ export type Options = {
watchQuery?: GetWatchQueryOptions;
};
-// @FIXME in v5: This doesn't need to be an async method
-const buildGraphQLProvider = async (
- options: Options
-): Promise => {
+const buildGraphQLProvider = (options: Options): DataProvider => {
const {
client: clientObject,
clientOptions,