Amplify-cli: "amplify codegen models" does not recognize "external" AppSync api

[TLaue]

Note: If your issue/bug is regarding the AWS Amplify Console service, please log it in the
Amplify Console GitHub Issue Tracker

Describe the bug
"amplify codegen models" does not recognize an AppSync api which was added using "amplify add codegen --apiId ..." The command outputs: "No AppSync API configured. Please add an API"

Amplify CLI Version
You can use amplify -v to check the amplify cli version on your system
4.13.4

To Reproduce
1) Setup AWS AppSync api (via CFN or AWS Management Console) including a sample schema
2) Generate project via create-react-app and amplify init
3) Add api to project via "amplify add codegen --apiId ..."
4) Run "amplify codegen" -> works as expected
5) Run "amplify codegen models" -> console output: No AppSync API configured. Please add an API
6) "amplify add api"
? Please select from one of the below mentioned services: GraphQL
You already have an AppSync API in your project. Use the "amplify update api" command to update your existing AppSync API.
7) amplify update api
? Please select from one of the below mentioned services: GraphQL
The selected resource is not managed using AWS Cloudformation. Please use the AWS AppSync Console to make updates to your API

Expected behavior
Either the model generation (required for Amplify DataStore) is supported or a clear error message states that the model generation only works for APIs added using "amplify add api".

Screenshots
If applicable, add screenshots to help explain your problem.

Desktop (please complete the following information):

• OS: Ubuntu
• Node Version. v12.14.1

Additional context
Add any other context about the problem here.

[SwaySway]

Currently the CLI does not support this as amplify codegen models works based on an api that is created from the CLI. As codegen does not look at the introspection schema when generating the models.

[kcwinner]

@TLaue it's kind of "dirty" but if you add the api and then modify amplify/backend/amplify-meta.json to add the providerPlugin field below it should work... I got it working for me. Then just copy your schema over and generate the models. Not ideal, but it works.

"api": {
     "my-cool-api": {
          "service": "AppSync",
          "providerPlugin": "awscloudformation",

Determined from the following snippet from: amplify-codegen

const allApiResources = await context.amplify.getResourceStatus('api');
  const apiResource = allApiResources.allResources.find(
    resource => resource.service === 'AppSync' && resource.providerPlugin === 'awscloudformation'
  );

  if (!apiResource) {
    context.print.info('No AppSync API configured. Please add an API');
    return;
  }

[TLaue]

@kcwinner Thank you very much for this information. It works even though its a kind of ugly workaround. We have decided to go another way in the meantime until the Amplify DataStore will be supported out of the box.

[kcwinner]

@TLaue same here. Ran into additional issues with DataStore not supporting my models with a custom transformer.

[undefobj]

@kcwinner @TLaue to perform data modeling the code generation process needs to be able to have a schema which is appropriately annotated with @model directives. To be crystal clear, is your use case that you want to be able to go to the AppSync console and create your backend and then connect DataStore to it?

[kcwinner]

@undefobj I am deploying via the CDK. I have written my own transformer (still using @model, @key, and other directives) but I have also written a few of my own. This allows me to create everything via the cdk instead of amplify so I can keep everything separate. However, codegen does not support my custom field directives and my transformer does not create the required sync fields (_deleted, etc)

[undefobj]

The way that model generation works is the GraphQL SDL is parsed and appropriate metadata is created, so if your deployment process is decoupled from that in theory you should be able to run amplify codegen models as outlined here for the local assets in your project to be created. However you'll need to ensure that your AppSync resources are appropriately provisioned since you are managing them independently with the CDK, this includes Data Sources with a Delta Sync table following the proper key schema as well as Resolvers set with Conflict Detection/Resolution and sync operations. You can find more information on the configuration in the AppSync documentation.

[kcwinner]

@undefobj I'm finally getting back to this. Working the sync table creation and resolvers via cdk / transformer now. DynamoDbDataSource doesn't natively support the DeltaSyncConfig but it's easiest enough to add. Thanks for pointing me toward the docs. I'll retroactively update my blog post / demo repo once I get this piece knocked out.

[alinadima]

@kcwinner @TLaue to perform data modeling the code generation process needs to be able to have a schema which is appropriately annotated with @model directives. To be crystal clear, is your use case that you want to be able to go to the AppSync console and create your backend and then connect DataStore to it?

@undefobj I have exactly this issue, and this is what I want to do. I have an existing AppSync backend which is correctly configured for using DeltaSync. And I want to connect DataStore to it, without even needing to run amplify init. Looks like "amplify codegen --apiId xxxx" does generate some of the needed files, but not the model classes which are needed to be able to use DataStore.

I guess I am struggling with this. Can we use DataStore with an AppSync backend created via CloudFormation or AWS Console etc? And if yes, how? Are there any examples? I want to use the Amplify SDK as a client library, and I dont want to use the Amplify framework or cli to deploy Cloud resources. Looks to me that there is very strong coupling between DataStore as an API and on top of a pure GraphQL client and some magical way to generate cloud resources which i dont need.

Is there any example where these model classes can be create by manually writing code using the Amplify client SDK?

Many thanks for your support in advance

[kcwinner]

@alinadima I got this "working" in a blogpost. Here is the full code for the blogpost.

The frontend example contains the example datastore frontend and the README laying out how I got it working. There are a few additional steps you need to take in order to get the model generation working. You will also need a local copy of schema.graphql if you created it via the console.

Take note, though, that currently DataStore does not work with sort keys.

I have only slightly looked into generating the models outside of amplify-cli. Digging through the amplify-cli source you can find the models generation.

You can also look at graphql-code-generator.

I put together a simple gist that mimics the amplify generator here