How to create object array in react for graphql

Question

Graphql schema:

type SDKConfig @model 
  @key(name: "byPublisher", fields: ["publisher_id", "id"]){
  id: ID!
  publisher_id: ID!
  facebook_app_id: String

  adjust_app_token: String
}

type GameConfig @model
  @auth(rules: [
    {allow: owner},
    {allow: groups, groupsField: "groups"}]){
  id: ID!
  game_name: String!
  bundle_identifier: String!

  sdkConfigs: [SDKConfig] @connection(keyName: "byPublisher", fields: ["id"])
  groups: [String]
}

Mutations:

export const createGameConfig = /* GraphQL */ `
  mutation CreateGameConfig(
    $input: CreateGameConfigInput!
    $condition: ModelGameConfigConditionInput
  ) {
    createGameConfig(input: $input, condition: $condition) {
      id
      game_name
      bundle_identifier
      sdkConfigs {
        items {
          id
          publisher_id
          facebook_app_id
          adjust_app_token
          createdAt
          updatedAt
        }
        nextToken
      }
      groups
      createdAt
      updatedAt
      owner
    }
  }
`;

React function:

    async function createGame() {
      try {
        const newgame = { 
            "game_name": "deneme",
            "bundle_identifier": "com.magiclab.deneme",
            sdkConfigs: [
                {   "publisher_id": 5,
                    "facebook_app_id": "fb12313",
                    "adjust_app_token": "adjusttoken123123",
                }
            ] 
        }
        await API.graphql(graphqlOperation(createGameConfig, {input: newgame}))
      } catch (err) {
        console.log('error creating game sdk config:', err)
      }
    }

Error message:

"The variables input contains a field name 'sdkConfigs' that is not defined for input object type 'CreateGameConfigInput' "

I want to create an array of objects within the object. How to fix input object for graphql ?

Answer 1

You should run two different mutations, one for creating the GameConfig and anorther one for create the SDKConfig it will be something like this

async function createGame() {
  try {
    const newgame = {
      game_name: 'deneme',
      bundle_identifier: 'com.magiclab.deneme',
    };
    const sdk = {
      publisher_id: null,
      facebook_app_id: 'fb12313',
      adjust_app_token: 'adjusttoken123123',
    };
    const {
      data: {
        createGameConfig: { id: publisher_id },
      },
    } = await API.graphql(
      graphqlOperation(createGameConfig, { input: newgame })
    );
    sdk.publisher_id = publisher_id;
    await API.graphql(graphqlOperation(createSDKConfig, { input: sdk }));
  } catch (err) {
    console.log('error creating game sdk config:', err);
  }
}

then you will use the id return by the first mutation as an input for the second mutation, this identifier will bound these two entries and when you query any gameConfig it will pull in an array any SDKConfig that their publisher_id matches with the gameConfig.

You could expand these information in this section of the official documentation https://docs.amplify.aws/cli/graphql-transformer/directives#belongs-to