Skip to content

fix: Upgrade graphql and@apollo/client #11200

New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Open
erwanMarmelab wants to merge 3 commits into
base: master
Choose a base branch
from
Open

fix: Upgrade graphql and@apollo/client #11200

Show file tree
Hide file tree
Changes from 1 commit
Commits
Show all changes
3 commits
Select commit Hold shift + click to select a range
2dd16e9
feat: Upgrade `graphql` and`@apollo/client`
erwanMarmelab Mar 25, 2026
3c4fad8
Add some imports in packages + revert some type updates
erwanMarmelab Mar 25, 2026
617fc74
fix build
erwanMarmelab Mar 25, 2026
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
4 changes: 2 additions & 2 deletions examples/demo/package.json
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -4,7 +4,7 @@
"private": true,
"type": "module",
"dependencies": {
"@apollo/client": "^3.12.4",
"@apollo/client": "^4.1.6",
"@mui/icons-material": "^7.0.0",
Comment thread
erwanMarmelab marked this conversation as resolved.
"@mui/material": "^7.0.0",
"@types/recharts": "^1.8.10",
Expand All @@ -14,7 +14,7 @@
"date-fns": "^3.6.0",
"echarts": "^5.6.0",
"fakerest": "^4.2.0",
"graphql": "^15.6.0",
"graphql": "^16.13.2",
"graphql-tag": "^2.12.6",
"inflection": "^3.0.0",
"json-graphql-server": "^3.0.1",
Expand Down
6 changes: 3 additions & 3 deletions examples/demo/src/dataProvider/graphql.ts
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -1,4 +1,4 @@
import { ApolloQueryResult } from '@apollo/client';
import { ObservableQuery } from '@apollo/client';
import buildApolloClient, {
buildQuery as buildQueryFactory,
} from 'ra-data-graphql-simple';
Expand Down Expand Up @@ -44,7 +44,7 @@ const customBuildQuery: BuildQueryFactory = introspectionResults => {
}
}`,
variables: { id: params.id },
parseResponse: ({ data }: ApolloQueryResult<any>) => {
parseResponse: ({ data }: ObservableQuery.Result<any>) => {
Copy link

Copilot AI Mar 25, 2026

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

The file switches from ApolloQueryResult to ObservableQuery.Result, but parseResponse here is called with the result of client.query()/client.mutate() (via ra-data-graphql), not a watchQuery result. Keeping the parameter typed as ApolloQueryResult (or a correct union type) will better reflect the actual runtime shape and avoid confusing consumers.

Copilot uses AI. Check for mistakes.
if (data[`remove${resource}`]) {
return { data: { id: params.id } };
}
Expand Down Expand Up @@ -98,7 +98,7 @@ const customBuildQuery: BuildQueryFactory = introspectionResults => {
}
`,
variables: params.data,
parseResponse: ({ data }: ApolloQueryResult<any>) => {
parseResponse: ({ data }: ObservableQuery.Result<any>) => {
Copy link

Copilot AI Mar 25, 2026

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Same issue as above: parseResponse is typed as ObservableQuery.Result, but this handler receives the result of client.query()/client.mutate(), not watchQuery. Prefer ApolloQueryResult (or a correct union type) to match what ra-data-graphql passes at runtime.

Copilot uses AI. Check for mistakes.
if (data.createCustomer) {
return { data: { id: data.createCustomer.id } };
}
Expand Down
4 changes: 2 additions & 2 deletions packages/ra-data-graphql-simple/package.json
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -32,7 +32,7 @@
"build": "zshy --silent"
},
"dependencies": {
"@apollo/client": "^3.3.19",
"@apollo/client": "^4.1.6",
"graphql-ast-types-browser": "~1.0.2",
"lodash": "~4.17.5",
"pluralize": "~7.0.0",
Expand All @@ -43,7 +43,7 @@
"ra-core": "^5.0.0"
},
"devDependencies": {
"graphql": "^15.6.0",
"graphql": "^16.13.2",
Comment thread
erwanMarmelab marked this conversation as resolved.
"typescript": "^5.1.3",
"zshy": "^0.5.0"
},
Expand Down
4 changes: 2 additions & 2 deletions packages/ra-data-graphql-simple/src/getResponseParser.ts
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -7,15 +7,15 @@ import {
} from 'ra-core';
import { IntrospectionResult, IntrospectedResource } from 'ra-data-graphql';
import { IntrospectionField } from 'graphql';
import { ApolloQueryResult } from '@apollo/client';
import { ObservableQuery } from '@apollo/client';

export default (_introspectionResults: IntrospectionResult) =>
(
raFetchMethod: string,
_resource: IntrospectedResource,
_queryType: IntrospectionField
) =>
(response: ApolloQueryResult<any>) => {
(response: ObservableQuery.Result<any>) => {
Copy link

Copilot AI Mar 25, 2026

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

getResponseParser is used as the parseResponse handler for client.query()/client.mutate() results, which are ApolloQueryResult/mutation results—not ObservableQuery.Result (watchQuery). Using ObservableQuery.Result here is misleading and may break downstream typing; prefer ApolloQueryResult (and/or a union including mutation results if needed).

Copilot uses AI. Check for mistakes.
const data = response.data;

if (
Expand Down
4 changes: 2 additions & 2 deletions packages/ra-data-graphql/package.json
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -32,7 +32,7 @@
"build": "zshy --silent"
},
"dependencies": {
"@apollo/client": "^3.3.19",
"@apollo/client": "^4.1.6",
"graphql-tag": "^2.12.6",
"lodash": "~4.17.5",
"pluralize": "~7.0.0"
Expand All @@ -42,7 +42,7 @@
"ra-core": "^5.0.0"
},
"devDependencies": {
"graphql": "^15.6.0",
"graphql": "^16.13.2",
Comment on lines 42 to +46
Copy link

Copilot AI Mar 25, 2026

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

@apollo/client@4.x declares graphql@^16 and rxjs@^7.3.0 as required peer dependencies. This package still advertises graphql: ^15.6.0 || ^16 and doesn’t declare rxjs, which can lead to peer resolution warnings/errors (especially under Yarn PnP) and an inaccurate compatibility signal to consumers. Consider updating peerDependencies to require graphql@^16 and adding rxjs (peer + devDependency as needed).

Copilot uses AI. Check for mistakes.
"typescript": "^5.1.3",
"zshy": "^0.5.0"
},
Expand Down
10 changes: 4 additions & 6 deletions packages/ra-data-graphql/src/buildApolloClient.ts
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -1,23 +1,21 @@
import {
ApolloClient,
ApolloClientOptions,
HttpLink,
InMemoryCache,
HttpLink,
type ApolloClientOptions,
} from '@apollo/client';

export default (options?: Partial<ApolloClientOptions<unknown>>) => {
if (!options) {
return new ApolloClient({
cache: new InMemoryCache().restore({}),
link: new HttpLink({}),
});
}

const {
cache = new InMemoryCache().restore({}),
uri,
credentials,
headers,
link = uri ? new HttpLink({ uri, credentials, headers }) : undefined,
link,
Comment on lines -17 to +18
Copy link
Copy Markdown
Contributor Author

@erwanMarmelab erwanMarmelab Mar 25, 2026

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

link option is now required

Copy link
Copy Markdown
Contributor

@ThieryMichel ThieryMichel Mar 26, 2026

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

You should keep uri, credentials and headers. keep the default for link. And update the type so that we require either link, or uri, credentials and headers to construct link.

...otherOptions
} = options;
Comment on lines 16 to 20
Copy link

Copilot AI Mar 25, 2026

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

buildApolloClient no longer derives an HttpLink from uri/credentials/headers. Callers (e.g. the demo via clientOptions.uri) will now pass link: undefined and ApolloClient will throw at runtime because link is required. Consider restoring the previous behavior (create new HttpLink({ uri, credentials, headers }) when link isn’t provided) or update all call sites to pass an explicit link instead of uri.

Copilot uses AI. Check for mistakes.

Expand Down
11 changes: 5 additions & 6 deletions packages/ra-data-graphql/src/index.test.ts
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -1,4 +1,5 @@
import { ApolloClient, ApolloError } from '@apollo/client';
import { ApolloClient } from '@apollo/client';
import { ApolloError } from '@apollo/client/v4-migration';

Check warning on line 2 in packages/ra-data-graphql/src/index.test.ts

View workflow job for this annotation

GitHub Actions / typecheck 

'ApolloError' is defined but never used. Allowed unused vars must match /^_/u
Comment thread
erwanMarmelab marked this conversation as resolved.
Outdated
import { GraphQLError } from 'graphql';
import gql from 'graphql-tag';

Expand All @@ -10,9 +11,7 @@
it('sets ApolloError in body', async () => {
const mockClient = {
mutate: async () => {
throw new ApolloError({
graphQLErrors: [new GraphQLError('some error')],
});
Comment on lines -13 to -15
Copy link
Copy Markdown
Contributor Author

@erwanMarmelab erwanMarmelab Mar 25, 2026

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Apollo Client 4 removes the ApolloError class entirely.
https://www.apollographql.com/docs/react/migrating/apollo-client-4-migration#removal-of-apolloerror

throw new GraphQLError('some error');
Copy link

Copilot AI Mar 25, 2026

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

This test still asserts error.body.graphQLErrors, but the mock now throws a raw GraphQLError, so handleError will wrap that and error.body won’t have graphQLErrors. To keep the test meaningful, throw an ApolloError (or an object shaped like it) with graphQLErrors: [new GraphQLError(...)], or update the assertions to match the new error shape.

Suggested change
throw new GraphQLError('some error');
throw new ApolloError({
graphQLErrors: [new GraphQLError('some error')],
});

Copilot uses AI. Check for mistakes.
},
};
const mockBuildQueryFactory = () => {
Expand All @@ -28,7 +27,7 @@
});
};
const dataProvider = await buildDataProvider({
client: mockClient as unknown as ApolloClient<unknown>,
client: mockClient as unknown as ApolloClient,
introspection: false,
buildQuery:
mockBuildQueryFactory as unknown as BuildQueryFactory,
Expand Down Expand Up @@ -81,7 +80,7 @@
};

const dataProvider = buildDataProvider({
client: client as unknown as ApolloClient<unknown>,
client: client as unknown as ApolloClient,
buildQuery: () => () => undefined,
});

Expand Down
6 changes: 2 additions & 4 deletions packages/ra-data-graphql/src/introspection.ts
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -15,7 +15,7 @@ import { ALL_TYPES } from './constants';
* @param {Object} options The introspection options
*/
export const introspectSchema = async (
client: ApolloClient<unknown>,
client: ApolloClient,
options: IntrospectionOptions
) => {
const schema = options.schema ? options.schema : await fetchSchema(client);
Expand Down Expand Up @@ -50,9 +50,7 @@ export type IntrospectionResult = {
schema: IntrospectionSchema;
};

const fetchSchema = (
client: ApolloClient<unknown>
): Promise<IntrospectionSchema> =>
const fetchSchema = (client: ApolloClient): Promise<IntrospectionSchema> =>
client
.query<IntrospectionQuery>({
fetchPolicy: 'network-only',
Expand Down
53 changes: 42 additions & 11 deletions yarn.lock
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -35,7 +35,7 @@ __metadata:
languageName: node
linkType: hard

"@apollo/client@npm:^3.12.4, @apollo/client@npm:^3.3.19, @apollo/client@npm:^3.9.11":
"@apollo/client@npm:^3.9.11":
version: 3.12.4
resolution: "@apollo/client@npm:3.12.4"
dependencies:
Expand Down Expand Up @@ -72,6 +72,37 @@ __metadata:
languageName: node
linkType: hard

"@apollo/client@npm:^4.1.6":
version: 4.1.6
resolution: "@apollo/client@npm:4.1.6"
dependencies:
"@graphql-typed-document-node/core": "npm:^3.1.1"
"@wry/caches": "npm:^1.0.0"
"@wry/equality": "npm:^0.5.6"
"@wry/trie": "npm:^0.5.0"
graphql-tag: "npm:^2.12.6"
optimism: "npm:^0.18.0"
tslib: "npm:^2.3.0"
peerDependencies:
graphql: ^16.0.0
graphql-ws: ^5.5.5 || ^6.0.3
react: ^17.0.0 || ^18.0.0 || >=19.0.0-rc
react-dom: ^17.0.0 || ^18.0.0 || >=19.0.0-rc
rxjs: ^7.3.0
subscriptions-transport-ws: ^0.9.0 || ^0.11.0
peerDependenciesMeta:
graphql-ws:
optional: true
react:
optional: true
react-dom:
optional: true
subscriptions-transport-ws:
optional: true
checksum: ff152317932cb0ba46423161d388d1a2bc0bbc6c8ec6e2e85e915bb2ec22f461effa6fd2bbc8b754babd75ac8b52843f1e3ddf8e501cbe1d9b857e4df2f2f2df
languageName: node
linkType: hard

"@astrojs/compiler@npm:^2.13.0, @astrojs/compiler@npm:^2.9.1":
version: 2.13.0
resolution: "@astrojs/compiler@npm:2.13.0"
Expand Down Expand Up @@ -10852,7 +10883,7 @@ __metadata:
version: 0.0.0-use.local
resolution: "demo@workspace:examples/demo"
dependencies:
"@apollo/client": "npm:^3.12.4"
"@apollo/client": "npm:^4.1.6"
"@mui/icons-material": "npm:^7.0.0"
"@mui/material": "npm:^7.0.0"
"@types/jest": "npm:^29.5.2"
Expand All @@ -10866,7 +10897,7 @@ __metadata:
date-fns: "npm:^3.6.0"
echarts: "npm:^5.6.0"
fakerest: "npm:^4.2.0"
graphql: "npm:^15.6.0"
graphql: "npm:^16.13.2"
graphql-tag: "npm:^2.12.6"
inflection: "npm:^3.0.0"
json-graphql-server: "npm:^3.0.1"
Expand Down Expand Up @@ -13665,10 +13696,10 @@ __metadata:
languageName: node
linkType: hard

"graphql@npm:^15.6.0":
version: 15.8.0
resolution: "graphql@npm:15.8.0"
checksum: 30cc09b77170a9d1ed68e4c017ec8c5265f69501c96e4f34f8f6613f39a886c96dd9853eac925f212566ed651736334c8fe24ceae6c44e8d7625c95c3009a801
"graphql@npm:^16.13.2":
version: 16.13.2
resolution: "graphql@npm:16.13.2"
checksum: 64e822a0a0e4398781e4bc9765b88d370c08261498b517add4b878038ef7be2005b6b394a79a5102b9379d57052f60bc7f23fec8f39808d101984a74772ebd9d
languageName: node
linkType: hard

Expand Down Expand Up @@ -20803,8 +20834,8 @@ __metadata:
version: 0.0.0-use.local
resolution: "ra-data-graphql-simple@workspace:packages/ra-data-graphql-simple"
dependencies:
"@apollo/client": "npm:^3.3.19"
graphql: "npm:^15.6.0"
"@apollo/client": "npm:^4.1.6"
graphql: "npm:^16.13.2"
graphql-ast-types-browser: "npm:~1.0.2"
lodash: "npm:~4.17.5"
pluralize: "npm:~7.0.0"
Expand All @@ -20821,8 +20852,8 @@ __metadata:
version: 0.0.0-use.local
resolution: "ra-data-graphql@workspace:packages/ra-data-graphql"
dependencies:
"@apollo/client": "npm:^3.3.19"
graphql: "npm:^15.6.0"
"@apollo/client": "npm:^4.1.6"
graphql: "npm:^16.13.2"
graphql-tag: "npm:^2.12.6"
lodash: "npm:~4.17.5"
pluralize: "npm:~7.0.0"
Expand Down
Loading