marcolink/cf-content-types-generator-app

Property 'contentType' does not exist on type 'Link<"Entry">'

seballoon opened this issue · 2 comments

I'm getting errors like these:

Property 'contentType' does not exist on type 'Link<"Entry"> | (EntrySys & { contentType: { sys: { id: string; }; }; })'.
Property 'contentType' does not exist on type 'Link<"Entry">'.

Property 'fields' does not exist on type 'UnresolvedLink<"Entry"> | Entry<EntrySkeletonType, undefined, string>'.
Property 'fields' does not exist on type 'UnresolvedLink<"Entry">'.

In this code here:

content.map((d) => {
              const Component = dynamicComponents[d.sys.contentType.sys.id]
              return Component ? <Component {...d.fields} /> : null
            })

the values are coming from getStaticPaths():

export async function getStaticPaths() {
  const pages = await contentfulClient.getEntries<TypePageSkeleton>({
    content_type: 'page',
  })

  const result = pages.items.map((page) => {
    const { slug, content } = page.fields
    return {
      params: { id: slug },
      props: { content },
    }
  })

  return result
}

These are the types generated by the app:

import type { ChainModifiers, Entry, EntryFieldTypes, EntrySkeletonType, LocaleCode } from "contentful";

export interface TypePageFields {
    title: EntryFieldTypes.Symbol;
    slug: EntryFieldTypes.Symbol;
    content?: EntryFieldTypes.Array<EntryFieldTypes.EntryLink<EntrySkeletonType>>;
}

export type TypePageSkeleton = EntrySkeletonType<TypePageFields, "page">;
export type TypePage<Modifiers extends ChainModifiers, Locales extends LocaleCode = LocaleCode> = Entry<TypePageSkeleton, Modifiers, Locales>;

And just to clarify, the "content" is a type "references to many"

I know this is probably not a bug, but i'd appreciate if you can give me any clue to what I'm doing wrong?

Hi @seballoon 👋

in your current setup, the response from the server might contain unresolvable links. This is also reflected in the types. You can fix this, by dropping unresolvable links with a chain modifier:

export async function getStaticPaths() {
  const pages = await contentfulClient.withoutUnresolvableLinks.getEntries<TypePageSkeleton>({
    content_type: 'page',
  })

  const result = pages.items.map((page) => {
    const { slug, content } = page.fields
    return {
      params: { id: slug },
      props: { content },
    }
  })

  return result
}

closing this for now!