TypeScript Warning and Prisma Model Parameters

Get Help and Help Others
2

Hi @st0w I’m no TypeScript expert myself, but am learning and I think there may be a few options:

SDL Interfaces

You can implement a type like a VideoClipThumbnail:

export const schema = gql`
  interface VideoClipThumbnail {
    id: String!
    sequence: Int!
    path: String!
    thumbnail: String!
    eventRecordId: Int!
  }

  type VideoClip implements VideoClipThumbnail {
    id: String!
    sequence: Int!
    path: String!
    thumbnail: String!
    eventRecordId: Int!
    relatedNotes: [String!]!
    dataValues: [String!]!
  }
`

Note: I made up the data types for your properties

And this generates:

export type VideoClip = VideoClipThumbnail & {
  __typename?: 'VideoClip'
  dataValues: Array<Scalars['String']>
  eventRecordId: Scalars['Int']
  id: Scalars['String']
  path: Scalars['String']
  relatedNotes: Array<Scalars['String']>
  sequence: Scalars['Int']
  thumbnail: Scalars['String']
}

export type VideoClipThumbnail = {
  eventRecordId: Scalars['Int']
  id: Scalars['String']
  path: Scalars['String']
  sequence: Scalars['Int']
  thumbnail: Scalars['String']
}

Thus your

interface Props {
  videoClip: VideoClip
}

could just be

interface Props {
  videoClip: VideoClipThumbnail
}

or if you change your query

export const QUERY = gql`
  query FindVideoClipQuery($id: Int!) {
    videoClipThumbnail: videoClip(id: $id) {
      id
      sequence
      path
      thumbnail
      eventRecordId
    }
  }
`

it would be


interface Props {
  videoClipThumbnail: VideoClipThumbnail
}

Make a more concise prop type

Do similar but use TS Omit

interface Props {
  videoClip: Omit<VideoClip, 'dataValues' | 'eventRecord' | 'relatedNotes">
}

Define a thumbnail prop type



interface VideoClipThumbNail {
  eventRecordId: number
  id: string
  path: string
  sequence: string
  thumbnail: string
}

interface Props {
  videoClip: VideoClipThumbNail
}

const VideoClipThumbNail = ({ videoClip }: Props) => {

But at that point, seems to pass in the VideoClipThumbNail makes sense.

Thoughts?

Those are some ideas I had.

The Redwood team does some have ideas to rework the codeine based on @sdl-codegen/node - npm to make the types less complicated.

This may happen in v6.

Let me know how it goes! Am digging to more GraphQL codegen recently to always learning and want to improve it,

2 Likes