I am learning AWS amplify, and has just deployed my first app using
this tutorial

When I am examining what’s been deployed, I found that the when the App is calling the AppSync Query, it’s using the hard coded API Key for AppSync. I don’t think this is a good solution, because an UserPool has been created in the app, the UserPool instance should be used as the authenticator for AppSync Query, meaning the access key should be sent to the AppSync for data query.

I understand the above configuration was done using with the following codes in the tutorial.

export const data = defineData({
  schema,
  authorizationModes: {
    defaultAuthorizationMode: "apiKey",
    apiKeyAuthorizationMode: {
      expiresInDays: 30,
    },
  },
});

Howevery, I could not find a way to configure “userPool” as the defaultAuthorizationMode and link to the user pool instanced created in the amplify/auth/resource.ts file with the following codes:

export const auth = defineAuth({
  loginWith: {
    email: true,
  }
});

There could be the following challanges:

1. If AppSync is going to use userPool for authentication, user pool instance need to be created first, so that it can be passed to AppSync for configuration. So how do I define the dependency in the Amplify backend codes.
2. How to configure the “defineData” parameters
3. Does the Ampify front-end has the support for managing and using the tokens. e.g. token storage, token refresh, using token for query. Anyway how to make the react front end to fit this configuration.

I appratiate if anyone could share the insight. Or if Amplify is no good to support my requirements, any better frameworks?