stuck on aws amplify API.graphql(...) call to run query, query works in graphql playground

Update: I have added at the very bottom the schema and generate query that was working before, it seems the addition of _version seems to breaking something, and I am not sure why.

I can't quite figure this one out. I am getting the following error "Cannot return null for non-nullable field Recipe._version."

It was working prior, but I used aws amplifies new visual data modeling tool and added in the ingredients model. Ran amplify pull and it seemed to break my code, but not exactly sure why.

Any help would be great.

Thanks

Note: I am able to run queries and mutations just fine in graphql playground

I have the following code

//...
import { listRecipes as ListRecipes } from "./graphql/queries";


async function getData() {
    try {
      const recipeData = await API.graphql(graphqlOperation(ListRecipes));
      console.log("listData:", recipeData);
    } catch (err) {
      console.log("error fetching recipes...", err);
    }
  }

graphql schema

type Ingredient
  @model
  @auth(rules: [{ allow: private }])
  @key(name: "byRecipe", fields: ["recipeID"]) {
  id: ID!
  amount: String
  ingredient: String
  recipeID: ID!
}

type Recipe @model @auth(rules: [{ allow: private }]) {
  id: ID!
  userId: ID
  name: String!
  description: String!
  recipe: String!
  comments: [Comment] @connection(name: "RecipeComments")
  original_author: String
  Ingredients: [Ingredient] @connection(keyName: "byRecipe", fields: ["id"])
}

type Comment @model @auth(rules: [{ allow: private }]) {
  id: ID!
  message: String
  createdBy: String
  recipe: Recipe @connection(name: "RecipeComments")
}

type Test {
  id: String!
  name: String!
  price_usd: String!
}

type Query {
  getTest(limit: Int, start: Int): [Test] @function(name: "test-${env}")
}

Here is the queries.js file that's generated by amplify mock

export const listRecipes = /* GraphQL */ `
  query ListRecipes(
    $filter: ModelRecipeFilterInput
    $limit: Int
    $nextToken: String
  ) {
    listRecipes(filter: $filter, limit: $limit, nextToken: $nextToken) {
      items {
        id
        userId
        name
        description
        recipe
        original_author
        _version
        _deleted
        _lastChangedAt
        createdAt
        updatedAt
      }
      nextToken
      startedAt
    }
  }
`;

So before I added in the Ingredients model with the data model ui editor I had the following schmea and querie.js file that was working.

schema

type Recipe @model {
  id: ID!
  userId: ID
  name: String!
  description: String!
  recipe: String!
  comments: [Comment] @connection(name: "RecipeComments")
}

type Comment
  @model
  @auth(rules: [{ allow: owner, queries: null, ownerField: "createdBy" }]) {
  id: ID!
  message: String
  createdBy: String
  recipe: Recipe @connection(name: "RecipeComments")
}

type Test {
  id: String!
  name: String!
  price_usd: String!
}

type Query {
  getTest(limit: Int, start: Int): [Test] @function(name: "test-${env}")
}

queries.js

export const listRecipes = /* GraphQL */ `
  query ListRecipes(
    $filter: ModelRecipeFilterInput
    $limit: Int
    $nextToken: String
  ) {
    listRecipes(filter: $filter, limit: $limit, nextToken: $nextToken) {
      items {
        id
        userId
        name
        description
        recipe
        createdAt
        updatedAt
      }
      nextToken
    }
  }
`;