Aws-mobile-appsync-sdk-js: Add support for @apollo/client

[asadowns]

Do you want to request a feature or report a bug?
feature and bug
What is the current behavior?
aws-appsync is not currently fully compatible with @apollo/client@3 as the existing apollo-client, apollo-link, etc. are no longer being supported and the recommendation is to migrate away from them.

There seem to be two main blockers here:

1. aws-appsync has a dependency on [email protected] this requires importing both apollo-client and @apollo/client if the new version is desired to be used. The error shown if not importing apollo-client is:

ERROR in ./node_modules/aws-appsync-subscription-link/lib/subscription-handshake-link.js
Module not found: Error: Can't resolve 'apollo-client' in '/my-project-path/node_modules/aws-appsync-subscription-link/lib'
 @ ./node_modules/aws-appsync-subscription-link/lib/subscription-handshake-link.js 81:22-46
 @ ./node_modules/aws-appsync-subscription-link/lib/index.js
 @ ./node_modules/aws-appsync/lib/client.js
 @ ./node_modules/aws-appsync/lib/index.js
 @ ./src/components/config.ts
 @ ./src/components/App.tsx
 @ ./src/index.tsx
 @ multi react-hot-loader/patch ./src/index.tsx

1. The type of ApolloLink used by createAppSyncLink is no longer consistent with the ApolloLink type provided by @apollo/client. This requires a cast to any.

Type 'ApolloLink' is missing the following properties from type 'ApolloLink': onError, setOnErrorts(2739)
ApolloClient.d.ts(22, 5): The expected type comes from property 'link' which is declared here on type 'ApolloClientOptions<NormalizedCacheObject>'

If the current behavior is a bug, please provide the steps to reproduce and if possible a minimal demo of the problem.
Using @apollo/[email protected].

Typing issue comes at:

  const awsLink = createAppSyncLink({ // If this is cast to any that's the current workaround
    url: aws_appsync_graphqlEndpoint,
    region: aws_appsync_region,
    auth: {
      type: AUTH_TYPE.AWS_IAM,
      // eslint-disable-next-line @typescript-eslint/promise-function-async
      credentials: () => Auth.currentCredentials(),
    },
    // eslint-disable-next-line @typescript-eslint/promise-function-async
    complexObjectsCredentials: () => Auth.currentCredentials(),
  });

  const apolloClient = new ApolloClient({
    link: awsLink.concat(httpLink), // This is where the type is invalid
    cache: new InMemoryCache(),
  });

What is the expected behavior?
aws-appsync should work with @apollo/client^3 without additional dependencies or workarounds.

* Relates to*
https://github.com/awslabs/aws-mobile-appsync-sdk-js/issues/448

[BenoitDel]

also related to:

• Issue 436
• PR 561

[sammartinez]

561 we are looking to test this and validate this resolves this feature

[manueliglesias]

Hi,

This is addressed in https://github.com/awslabs/aws-mobile-appsync-sdk-js/pull/561#issuecomment-701696316