aws-mobile-appsync-sdk-js icon indicating copy to clipboard operation
aws-mobile-appsync-sdk-js copied to clipboard

Configuring AWSAppSyncClient with data from aws-export.js gives type error

Open estubmo opened this issue 6 years ago • 6 comments

Note: If your issue/feature-request/question is regarding the AWS AppSync service, please log it in the official AWS AppSync forum

Do you want to request a feature or report a bug? Bug

What is the current behavior? Attempting to configure AwsAppSyncClient with data from aws-export.js Currently

// aws-export.js
"aws_appsync_authenticationType": "AMAZON_COGNITO_USER_POOLS",

//App.tsx
const client = new AWSAppSyncClient({
  auth: {
    type: config.aws_appsync_authenticationType
}
};

Gives the error: Type 'string' is not assignable to type '"AMAZON_COGNITO_USER_POOLS" | AUTH_TYPE.NONE | "API_KEY" | "AWS_IAM" | "OPENID_CONNECT"'.ts(2322)

Therefore I'm attempting to cast the string to an enum

// App.tsx
const authTypeString = config.aws_appsync_authenticationType as keyof typeof AUTH_TYPE;

const client = new AWSAppSyncClient({
  url: config.aws_appsync_graphqlEndpoint,
  region: config.aws_appsync_region,
  auth: {
    type: authTypeString,
    jwtToken: async () => (await Auth.currentSession()).getIdToken().getJwtToken()
  }
});

Gives the error

Type '"AMAZON_COGNITO_USER_POOLS" | "NONE" | "API_KEY" | "AWS_IAM" | "OPENID_CONNECT"' is not assignable to type '"AMAZON_COGNITO_USER_POOLS" | AUTH_TYPE.NONE | "API_KEY" | "AWS_IAM" | "OPENID_CONNECT"'.
  Type '"NONE"' is not assignable to type '"AMAZON_COGNITO_USER_POOLS" | AUTH_TYPE.NONE | "API_KEY" | "AWS_IAM" | "OPENID_CONNECT"'.ts(2322)

This can be fixed by changing auth-link.d.ts from:

declare type AuthOptionsNone = {
    type: AUTH_TYPE.NONE;
};

To:

declare type AuthOptionsNone = {
    type: KeysWithType<typeof AUTH_TYPE.NONE>;
};

If the current behavior is a bug, please provide the steps to reproduce and if possible a minimal demo of the problem. import AWSAppSyncClient, { AUTH_TYPE } from 'aws-appsync'; And try to configurate AWSAppSyncClient with data form aws-export.js

What is the expected behavior? For

const client = new AWSAppSyncClient({
  auth: {
    type: config.aws_appsync_authenticationType
}
};

To work out of the box. Which versions and which environment (browser, react-native, nodejs) / OS are affected by this issue? Did this work in previous versions? "react": "^16.11.0", "aws-amplify": "^1.2.3", "aws-amplify-react": "^2.5.3", "aws-appsync": "^2.0.1", "aws-appsync-react": "^2.0.1",

estubmo avatar Oct 30 '19 16:10 estubmo

Same issue!

isaiahtaylorhh avatar Jan 07 '20 16:01 isaiahtaylorhh

Same issue

ronnycoding avatar Jan 08 '20 23:01 ronnycoding

Same issue

ChaminW avatar Feb 29 '20 04:02 ChaminW

The solution for this is very simply: type: AUTH_TYPE[config.aws_appsync_authenticationType],

AUTH_TYPE is an enum, so it just needs to be provided with the valid string for auth type.

jairenee avatar Jul 12 '20 21:07 jairenee

I'm using ApolloClient/ApolloLink, but I think I encountered the same type error. I was able to fix the error by explicitly declaring auth as an AuthOptions type:

import { createAuthLink, AUTH_TYPE, AuthOptions } from 'aws-appsync-auth-link';
import { createSubscriptionHandshakeLink } from 'aws-appsync-subscription-link';
import appSyncConfig from "./aws-exports";

const url = appSyncConfig.aws_appsync_graphqlEndpoint;
const region = appSyncConfig.aws_appsync_region;
const auth: AuthOptions = { // the main bit that is needed
  type: AUTH_TYPE.API_KEY,
  apiKey: appSyncConfig.aws_appsync_apiKey,
};

const link = ApolloLink.from([
  createAuthLink({ url, region, auth }),
  createSubscriptionHandshakeLink({ url, region, auth })
]);

joshclowater avatar Jul 30 '21 14:07 joshclowater

@joshclowater I think your problem is resolved because is you are not dynamically pulling the auth type from an aws exports file, so the string/enum value is known in this snippet you provide.

I'm having the same issue as above, but for the AuthOptionsOauth flavor-

const authOptions: AuthOptions = {
  type: awsconfig.aws_appsync_authenticationType as AUTH_TYPE,

I get "Types of property 'type' are incompatible. Type 'AUTH_TYPE' is not assignable to type '"AMAZON_COGNITO_USER_POOLS" | "OPENID_CONNECT" ... which I believe is caused by this line in auth-link.d.ts:

declare type AuthOptionsOAuth = {
  type: KeysWithType<typeof AUTH_TYPE, AUTH_TYPE.AMAZON_COGNITO_USER_POOLS> | KeysWithType<typeof AUTH_TYPE, AUTH_TYPE.OPENID_CONNECT>;
  ...

Although AUTH_TYPE will key into KeysWithType<typeof AUTH_TYPE, (some auth type)>, it seemingly will not key into a union of two such types.

Because my app will only run using Cognito, I used a hacky workaround like:

if (awsexports.aws_appsync_authenticationType !== AUTH_TYPE.AMAZON_COGNITO_USER_POOLS) {
   throw new Error('unexpected.....')
}
const authOptions: AuthOptions = {
  type: AUTH_TYPE.AMAZON_COGNITO_USER_POOLS,
  .....
}

But it would be great if the suggested approach in the README were typescript compatible...

eettaa avatar Mar 21 '22 16:03 eettaa