Amplify-cli: Nested types missing from queries in generated code - Require workaround

[rohit3d2003]

* Which Category is your question related to? *
iOS side generated graphql queries

* What AWS Services are you utilizing? *
App Sync

* Provide additional details e.g. code snippets *
I have an iOS project supported by AppSync on the backend. I have used Amplify CLI to add API to my project. The schema that I am using have nested objects and the generated queries are missing the details of nested types. As I understand, CLI only generated nested types upto level 2. Is there a workaround to change this behavior or can I update 'queries.graphql' manually to include missing details (I am ok to maintain these manual changes till CLI supports it natively)? Can someone guide me here?

[yuth]

We plan to add an option where user can pass depth as a parameter for codegen. Also we plan to expose it as one of the configuration option while configuring codegen.

[rohit3d2003]

Is there a tentative release date for this feature? In the meantime, is there a workaround to achieve the same? I am fine if I have to maintain some manual changes till it is supported natively.

[yuth]

Is there a tentative release date for this feature?

We will work on this as soon as this gets prioritized.

In the meantime, is there a workaround to achieve the same? I am fine if I have to maintain some manual changes till it is supported natively.

amplify cli uses amplify-graphql-docs-generator and amplify-graphql-types-generator internally to generate code. Both of them have their own CLI. amplify-graphql-docs-generator takes maxDepth argument, which you can use to alter the the depth.

You could decline codegen not to generate statements and use the amplify-graphql-docs-generator CLI to generate statements and later run amplify codgen types to generate the types

[rohit3d2003]

Works for me, thanks!

[hisham]

@yuth - the downside of doing codegen with nesting is it can create heavy queries that query for unnecessary things and these queries often take longer time. It seems in order to have a performant graphql app one will need to create their own custom queries that get what the UI wants and nothing else. Sometimes in the app you need nesting, and sometimes you don't. But codegen sort of gives us one option for default queries in the app and nothing else.

Do you have recommendations on how to dynamically customize the graphql query depending on the needs of different components in our app. I can obviously write custom queries, but I'm wondering if there is anything better where I can take a query your codegen tool generates but exclude certain fields from it at runtime or change maxDepth dynamically instead of writing my own complete query, or perhaps I can re-use an existing query the codgen tool generated but customize the fields in it a bit? And perhaps our custom graphql queries can be checked at "compile" time rather than runtime to make sure it matches with the existing graphql schema. I think using graphql fragments (https://www.apollographql.com/docs/react/advanced/fragments.html) might help towards that.

[rohit3d2003]

@hisham - Instead of changing the maxDepth, I actually did what you just suggested and it worked for me. Hopefully in future, any manual changes to these queries can be retained without being overridden by next codegen process

[hisham]

@rohit3d2003 cool.

Essentially what I want is something similar to Lodash's _.omit (https://lodash.com/docs/4.17.11#omit) and _.pick (https://lodash.com/docs/4.17.11#pick) methods but for graphql queries. Codegen can generate full nested queries with lots of depths, and I can just customize them as needed instead of writing my own and it should error out if I try to pick or omit wrong field names. @yuth if you feel I should file a separate issue for this let me know!

[undefobj]

Hi @hisham - it is true that there are tradeoffs with query generation since it assumes some things. One of the primary goals for the query generation when we started was to reduce the friction and onboarding for customers that found they had to learn GraphQL and write documents before they could get a native app up and running. But we did add features as @yuth mentioned such as customizing the generated documents and then just generating the types.

We want to evolve this over time for the "middle ground" of the spectrum were we can do the document generation but allow customers with more GraphQL knowledge the ability to customize the output without having to write everything from scratch. If you could would you open a new issue as a Feature Request with your desired user experience, maybe even with example GraphQL document outputs, so that we can gauge community interest and track in our backlog? It would also allow customers to provide feedback and other requirements as part of the design.

[guiracine]

+1
Faced the same problem here, luckly for me I was able to refactor my schema to fix this.

This is quite annoying because even If I answer No to Do you want to generate/update all possible GraphQL operations - queries, mutations and subscriptions question, the next amplify codegen will regenerate query.graphql with the buggy query and will break the generation process. So I can't simply patch this manually...unless there is a way I am not aware of.

@rohit3d2003 Could you share your workaround ? I did not quite understand what you did to work around this issue.

[hisham]

@guiracine - codegen outputs a file called queries.ts under src/graphql (atleast under my angular project). So currently what I have is another file called custom_queries.ts also under src/graphql which contains my manually written custom queries. When I want to use that query I then just import that query into my code that makes the graphql server calls like the auto-generated queries.

Sure @undefobj I'll create a feature request when I have a chance.

[guiracine]

@hisham got it, it seems different in an iOS project where the main api class is generated from the core graphql queries (+ custom ones). Because swift is a strongly typed language I must generate code from graphql queries first. I cannot write custom graphql queries without calling amplify codegen which creates query.graphql (equivalent of your queries.ts I guess) and then breaks the process of the generation.

Thanks

[hisham]

I see. I'm using Typescript which is sort of strongly typed. codegen always emits this API.ts file which contains all our types. What I did or what was already done is there is a .graphqlconfig.yml file in the project that I believe tells the codgen tool where all the graphql queries are to generate the code. There is this line that includes all files under src/graphql:

    includes:
      - src/graphql/**/*.ts

So even my custom queries are included when it generates types for the objects the graphql queries represent.

[guiracine]

Oh right, its the same on my file but .graphql instead of .ts
So with this the default queries.graphql is ignored completely.
That will work. Thx!

[yuth]

We have added a new configuration option to codegen, which allows to configure the max depth, while pushing a new AppSync API. For APIs that are already configured, this can be updated by running amplify codegen configure.

The depth can also be controlled by passing --max-depth param to either amplify codegen or amplify codegen statements

[bitsmakerde]

@yuth it is possible that this solution is working only of the AppSync client for iOS?

Im using only amplify without the API.swift file and for me nothing is changing if I change the level of deep.

Thank you

[yuth]

What are you using instead of generated API.swift?

Yes. Codegen --max-depth changes the generated statements (query.graphql, mutation.graphql and susbcription.graphql files). These files are used as input for API.swift generation.

[bitsmakerde]

I'm configed my project like this tutorial from was amplify. https://docs.amplify.aws/lib/graphqlapi/getting-started/q/platform/ios

I don't add api.swift to my project and its works. If I delete the file all works. Without the deep queries.

[yuth]

@bitsmakerde it looks like you're using API category of new Amplify iOS library. I does not use the generated statements and API.swift.

Are you missing nested queries in the API?

cc: @drochetti

[bitsmakerde]

@yuth

Yes if I use this way with the library I get only tow level. If I run the query at the console I get all level of deep I want.

[drochetti]

hey @bitsmakerde do you mind reporting this issue in the iOS repo so we can track it? If possible, provide some code snippets of how you configured Amplify and how you're executing your Query https://github.com/aws-amplify/amplify-ios

Thanks!

[chrisarts]

I can confirm that adding maxDepth generate the nested types, you have to be sure that you run the right depth