After createOneDbConnection mutation, update cache manually instead of using refetchQuery (#5684)

Closes #5057.

RefetchQuery is unreliable - [it won't be executed if the component is
unmounted](https://github.com/apollographql/apollo-client/issues/5419),
which is the case here because of the redirection that occurs after the
mutation.
We want to avoid using refetchQuery as much as possible, and write
directly in the cache instead.
This commit is contained in:
Marie
2024-05-31 10:28:44 +02:00
committed by GitHub
parent c7f2150ac7
commit 5e1dfde3e4

View File

@ -1,5 +1,4 @@
import { ApolloClient, useMutation } from '@apollo/client';
import { getOperationName } from '@apollo/client/utilities';
import { CREATE_ONE_DATABASE_CONNECTION } from '@/databases/graphql/mutations/createOneDatabaseConnection';
import { GET_MANY_DATABASE_CONNECTIONS } from '@/databases/graphql/queries/findManyDatabaseConnections';
@ -9,6 +8,7 @@ import {
CreateServerMutation,
CreateServerMutationVariables,
} from '~/generated-metadata/graphql';
import { isDefined } from '~/utils/isDefined';
export const useCreateOneDatabaseConnection = () => {
const apolloMetadataClient = useApolloMetadataClient();
@ -27,8 +27,28 @@ export const useCreateOneDatabaseConnection = () => {
variables: {
input,
},
awaitRefetchQueries: true,
refetchQueries: [getOperationName(GET_MANY_DATABASE_CONNECTIONS) ?? ''],
update: (cache, { data }) => {
const createdRemoteServer = data?.createOneRemoteServer;
if (!createdRemoteServer) return;
const getManyDatabaseConnectionsQuery = {
query: GET_MANY_DATABASE_CONNECTIONS,
variables: {
input: { foreignDataWrapperType: input.foreignDataWrapperType },
},
};
if (isDefined(cache.readQuery(getManyDatabaseConnectionsQuery))) {
cache.updateQuery(getManyDatabaseConnectionsQuery, (cachedQuery) => ({
findManyRemoteServersByType: [
...cachedQuery.findManyRemoteServersByType,
createdRemoteServer,
],
}));
return;
}
},
});
};