Forms Failling on save/update

[JGamboa]

Environment information

System:
  OS: macOS 14.5
  CPU: (10) arm64 Apple M1 Max
  Memory: 156.11 MB / 32.00 GB
  Shell: /bin/zsh
Binaries:
  Node: 20.12.2 - ~/.asdf/installs/nodejs/20.12.2/bin/node
  Yarn: undefined - undefined
  npm: 10.8.1 - ~/.asdf/plugins/nodejs/shims/npm
  pnpm: undefined - undefined
NPM Packages:
  @aws-amplify/backend: 1.0.3
  @aws-amplify/backend-cli: 1.0.4
  aws-amplify: 6.3.7
  aws-cdk: 2.146.0
  aws-cdk-lib: 2.146.0
  typescript: 5.4.5
AWS environment variables:

Data packages

front-multiapi@0.0.0 /Users/jgamboa/fleet/emprendimiento/multiapi
├─┬ @aws-amplify/backend-cli@1.0.4
│ └─┬ @aws-amplify/schema-generator@1.0.0
│   └── @aws-amplify/graphql-schema-generator@0.8.6
└─┬ @aws-amplify/backend@1.0.3
  └─┬ @aws-amplify/backend-data@1.0.2
    └── @aws-amplify/data-construct@1.8.5

Description

After the latest upgrade of npm packages of amplify my application broke.

We have this model

We are using only the forms generated by amplify with generate forms. After the update, when regenerating forms , mutations etc with the command we started getting problems on update and create like this

Basically we have the billing information that is abelogns to customer and a has one from customer, but it can be set later, now if we try to update or create customer with the amplify form we get that errors.

I know this is a security improvement but i think there is a lot of dev and companies having this problem and rolling back the cli is not an option at the moment (Security concerns) Is it possible to add a flag on the command so we can choose how the forms are generated?

This is the way how amplify is creating the graphql client

Maybe we can choose to genereate that from default, or a flag to choose to use the client schema query, because if. you use the schema query client you dont have any problem, but everytime we regenerate the forms everythings goes back to the mutation

this is the mutation created by the new cli

export const createCustomer = / GraphQL / mutation CreateCustomer( $condition: ModelCustomerConditionInput $input: CreateCustomerInput! ) { createCustomer(condition: $condition, input: $input) { billingInformation { address city companyName createdAt customerId id identityCard municipality owner updatedAt __typename } createdAt email fullName id owner phone updatedAt __typename } } ;

this is the one created by the old one

export const createCustomer = / GraphQL / mutation CreateCustomer( $condition: ModelCustomerConditionInput $input: CreateCustomerInput! ) { createCustomer(condition: $condition, input: $input) { createdAt email fullName id owner phone updatedAt __typename } } ;

and pretty sure thats is what generating all this problems

[AnilMaktala]

Hi @JGamboa, Thanks for raising this. This issue is related to #2636. Please subscribe to #2636 for future updates.

[chrisbonifacio]

Hi @JGamboa

The error seems to be complaining about implicit fields that are automatically added by the graphql transformer. They are being marked as required on the schema.

In the meantime, can you try generating your graphql statements using this command instead?

npx ampx generate graphql-client-code --statement-max-depth=1 --out=ui-components/graphql

[chrisbonifacio]

I was able to reproduce the errors related to the relational fields and mitigated it with the command above, allowing me to create records without errors with the generated forms.

code

"use client";
import { Authenticator } from "@aws-amplify/ui-react";
import "@aws-amplify/ui-react/styles.css";

import CustomerCreateForm from "@/ui-components/CustomerCreateForm";

const App = () => {
  return (
    <Authenticator>
      {({ user, signOut }) => {
        return (
          <>
            <h1>Hello {user?.username}</h1>
            <h1>Protected content!</h1>

            <CustomerCreateForm />
          </>
        );
      }}
    </Authenticator>
  );
};

export default App;

before

after

[JGamboa]

Hi @JGamboa

The error seems to be complaining about implicit fields that are automatically added by the graphql transformer. They are being marked as required on the schema.

In the meantime, can you try generating your graphql statements using this command instead?

npx ampx generate graphql-client-code --statement-max-depth=1 --out=ui-components/graphql

sorry just getting back home thats why didnt answer earlier. Ill try, but either way, i already create almost all the app again using queries =/ will have in mind for new formularies :D

[AnilMaktala]

Hey @JGamboa, Could you please provide the library versions you were using when the mutation code looked like this?

this is the one created by the old one

export const createCustomer = /* GraphQL */ mutation CreateCustomer( $condition: ModelCustomerConditionInput $input: CreateCustomerInput! ) { createCustomer(condition: $condition, input: $input) { createdAt email fullName id owner phone updatedAt __typename } };

[JGamboa]

@AnilMaktala sorry i cant, after this "upgrade" amplify team make, i lost 80% of functionalities, so i made the rework, i dont have any chance to know what version i was using. But i can say it was the previous version, im very sorry. :(