scalar DateTime from graphql-scalars

[go-aegian]

Describe the bug

how to define on typescript client side graphql-scalars.GraphQLDateTime. Using KitQL instead of Apollo

schema contains scalar definition

scalar Time

type List {
from: Time!
to: Time
}

codegen configured as
...
config:
scalars:
Time: import('graphql-scalars').GraphQLDateTime

---

npm run generate - generates the codegen.ts

import type { GraphQLDateTime } from 'graphql-scalars';

export type Scalars = {
/// TS2749: 'GraphQLDateTime' refers to a value, but is being used as a type here. Did you mean 'typeof GraphQLDateTime'?
Time: GraphQLDateTime;
};

What am I missing in order to use client side typescript datetime scalar?

Your Example Website or App

don't have one

Steps to Reproduce the Bug or Issue

see bug description for the question

Expected behavior

Expecting to be able to get a json response with fields typed as Time their value to be converted to JS Date object instead of string

current response example:
...
"from": "2021-01-27T14:00:00-04:00",
"to": "2021-01-29T15:00:00-04:00"
...

Screenshots or Videos

No response

Platform

"@graphql-codegen/cli": "^2.6.2",
"@graphql-codegen/near-operation-file-preset": "^2.2.12",
"@graphql-codegen/typed-document-node": "^2.2.8",
"@graphql-codegen/typescript": "^2.4.11",
"@graphql-codegen/typescript-operations": "^2.3.5",
"@kitql/client": "^0.5.2",
"@kitql/graphql-codegen": "^0.5.1",
"graphql": "^15.8.0",
"graphql-request": "^4.2.0",
"graphql-scalars": "^1.18.0",
"graphql-upload": "^13.0.0",

Codegen Config File

schema:

• http://localhost:3000/schema

overwrite: true

documents: './src/graphql/**/*.gql'

generates:
./src/graphql/codegen.ts:
plugins:
- typescript
- typescript-operations
- typed-document-node
- '@kitql/graphql-codegen'

config:
useTypeImports: true
scalars:
Time: import('graphql-scalars').GraphQLDateTime

hooks:
afterAllFileWrite:
- prettier --write

Additional context

No response

[charlypoly]

Hi @go-aegian,

Here, GraphQLDateTime refers to a class, not a type.
Instead, you should refer to GraphQLScalarType (from graphql), which is not exactly the type that you want to manipulate on the client side since the response will be returned by this scalar's serialize() function (which returns a Date type).
For this reason, please know that graphql-scalar is not meant to be used on the client side.
The only way to currently integrate graphql-scalars with codegen is to provide the mapping manually: https://www.the-guild.dev/graphql/scalars/docs/quick-start#graphql-code-generator-integration.

We are working on providing a better integration; you can follow the progress here: #8296