Fields not typed correctly

[perenstrom]

Hello, I'm currently in the process of migrating a project to TypeScript, and have encountered some problems with nested linked content.

When formatting the data received from Contentful I map over the results and do some serialization of the data. But sometimes (I haven't figured out when) I don't get correct typings for the fields of a linked object.

In the following screenshot I've added prints of the types of different variables using the Two Slash Queries plugin.

1. I get an array of ApiReferenceSubsection into my function
2. I loop over them with a map, and the subsection is indeed typed correctly
3. I extract the table property from the fields of that subsection, and get the correct typing
4. But suddenly, when I try to access the fields of the table, I get a very generic type ([x: string]: string | number | boolean | JsonObject | JsonArray | Document | (string | Entry<EntrySkeletonType, "WITHOUT_UNRESOLVABLE_LINKS", string> | Asset<...> | undefined)[] | ... 4 more ... | undefined;)

I'm using contentful 10.6.5, and cf-content-types-generator 2.12.9.

I'm generating the types with cf-content-types-generator -g -s $CONTENTFUL_SPACE_ID -t $CONTENTFUL_MANAGEMENT_API_KEY -e $CONTENTFUL_ENV -X -o ./types/generated/contentful

The generated files for subsection and table are as follows:

import type { ChainModifiers, Entry, EntryFieldTypes, EntrySkeletonType, LocaleCode } from "contentful";
import type { TypeApiObjectPropertySkeleton } from "./TypeApiObjectProperty";
import type { TypeTableSkeleton } from "./TypeTable";

export interface TypeApiReferenceSubsectionFields {
    heading?: EntryFieldTypes.Symbol;
    text?: EntryFieldTypes.RichText;
    properties?: EntryFieldTypes.Array<EntryFieldTypes.EntryLink<TypeApiObjectPropertySkeleton>>;
    table?: EntryFieldTypes.EntryLink<TypeTableSkeleton>;
}

export type TypeApiReferenceSubsectionSkeleton = EntrySkeletonType<TypeApiReferenceSubsectionFields, "apiReferenceSubsection">;
export type TypeApiReferenceSubsection<Modifiers extends ChainModifiers, Locales extends LocaleCode> = Entry<TypeApiReferenceSubsectionSkeleton, Modifiers, Locales>;

export function isTypeApiReferenceSubsection<Modifiers extends ChainModifiers, Locales extends LocaleCode>(entry: Entry<EntrySkeletonType, Modifiers, Locales>): entry is TypeApiReferenceSubsection<Modifiers, Locales> {
    return entry.sys.contentType.sys.id === 'apiReferenceSubsection'
}

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

export interface TypeTableFields {
    title: EntryFieldTypes.Symbol;
    data?: EntryFieldTypes.Object;
}

export type TypeTableSkeleton = EntrySkeletonType<TypeTableFields, "table">;
export type TypeTable<Modifiers extends ChainModifiers, Locales extends LocaleCode> = Entry<TypeTableSkeleton, Modifiers, Locales>;

export function isTypeTable<Modifiers extends ChainModifiers, Locales extends LocaleCode>(entry: Entry<EntrySkeletonType, Modifiers, Locales>): entry is TypeTable<Modifiers, Locales> {
    return entry.sys.contentType.sys.id === 'table'
}

[perenstrom]

And of course, just by writing this down in an issue I found what the problem was. This relates to this open issue: #296. My project has module: NodeNext and requires file extensions on imports. Adding .js manually to all imports in the generated files solved my problem.

[marcolink]

@perenstrom will close this in favour of #296