Datastore: TS error while using a query (Angular)

Describe the bug The build fails if I use Datastore.query(ToDo)

Error:

ERROR in src/app/app.component.ts:23:43 - error TS2345: Argument of type 'typeof Todo' is not assignable to parameter of type 'PersistentModelConstructor<Readonly<{ id: string; } & Record<string, any>>>'.
  Types of property 'copyOf' are incompatible.
    Type '(source: Todo, mutator: (draft: Pick<{ id: string; name: string; description?: string; }, "name" | "description">) => void | Pick<{ id: string; name: string; description?: string; }, "name" | "description">) => Todo' is not assignable to type '(src: Readonly<{ id: string; } & Record<string, any>>, mutator: (draft: Pick<{ [x: string]: any; id: string; }, string>) => void | Readonly<{ id: string; } & Record<string, any>>) => Readonly<...>'.
      Types of parameters 'mutator' and 'mutator' are incompatible.
        Type 'void | Readonly<{ id: string; } & Record<string, any>>' is not assignable to type 'void | Pick<{ id: string; name: string; description?: string; }, "name" | "description">'.
          Type 'Readonly<{ id: string; } & Record<string, any>>' is not assignable to type 'void | Pick<{ id: string; name: string; description?: string; }, "name" | "description">'.
            Property 'name' is missing in type 'Readonly<{ id: string; } & Record<string, any>>' but required in type 'Pick<{ id: string; name: string; description?: string; }, "name" | "description">'.

23     let todos:any = await DataStore.query(Todo);
                                             ~~~~

  src/models/index.d.ts:7:12
    7   readonly name: string;
                 ~~~~
    'name' is declared here.

the model is the basic Todo schema and generated using amplify codegen models

type Todo @model {
  id: ID!
  name: String!
  description: String
}

To Reproduce

1. add an qraphql api
2. generate the models
3. add Datastore
4. use Datastore.save (work)
5. use Datastore.query (build error)

Sample Repo: https://github.com/XC3S/RealtimeOfflineTest

The main logic is in the app.components.ts https://github.com/XC3S/RealtimeOfflineTest/blob/master/src/app/app.component.ts

Versions node: v10.18.1 npm: 6.13.4 amplify-cli: 4.13.0

    "@angular/animations": "~8.2.14",
    "@angular/common": "~8.2.14",
    "@angular/compiler": "~8.2.14",
    "@angular/core": "~8.2.14",
    "@angular/forms": "~8.2.14",
    "@angular/platform-browser": "~8.2.14",
    "@angular/platform-browser-dynamic": "~8.2.14",
    "@angular/router": "~8.2.14",
    "@aws-amplify/core": "^2.2.2",
    "@aws-amplify/datastore": "^1.0.4",
    "aws-amplify": "^2.2.2",
    "aws-amplify-angular": "^4.1.3",
    "rxjs": "~6.4.0",
    "tslib": "^1.10.0",
    "zone.js": "~0.9.1"

[SteeveGL]

Angular and typescript is new for me, so I’m not really sure what I’m doing.

I got the same issue like yours, but I succeed to fix it with a T type. In your case: let todos:any = await DataStore.query<Todo>(Todo);

But like I said, I don’t know why it’s working that way.

[stale[bot]]

This issue has been automatically closed because of inactivity. Please open a new issue if are still encountering problems.