TS Error while linking to custom components from structure

[tstikvoort]

Hi, I am migrating to Sanity V3 and am really happy with the typescript support.
In my structure I want to link to a custom view / component (in this case a component where you can import and review data).
This is the code I wrote in the structure:

S.listItem()
    .title('Import collection')
    .child(S.view.component(ImportCollectionView).id('ImportCollection').title('Import collection'))

It works as expected to me, by I do get the following typescript error:

Argument of type 'ComponentViewBuilder' is not assignable to parameter of type 'UnserializedListItemChild'.
  Type 'ComponentViewBuilder' is missing the following properties from type 'ComponentBuilder': child, getChild, menuItems, getMenuItems, and 2 more.ts(2345)

How can I fix this?

[bryandowning]

Have you tried just passing the component to .child?

S.listItem()
    .title('Import collection')
    .child(ImportCollectionView)

[tstikvoort]

Interesting, haven't thought of it, but that doesn't work. Both runtime and TS error.

[wrux]

Looks like you are close, how about this:

S.listItem()
  .title('Import collection')
  .child(S.component(ImportCollectionView).id('ImportCollection').title('Import collection')),

[tstikvoort]

Yes, that works! thanks