Sorry I can't figure this out. I want to use an `F...
# javascript
h
Sorry I can't figure this out. I want to use an
FC
with
Props
that have generics. I already saw this https://kotlinlang.slack.com/archives/C0B8L3U69/p1669835459380739 but I can't wrap my head around it somehow. Small example (shortened for brevity):
Copy code
external interface CustomTableProps<T : RowData> : Props {
    var table: Table<T>
    var columns: Array<ColumnDef<T, String>>
    var userSettings: TanStackUserSettingsStates
    var handleClick: ((Row<T>) -> Unit)?
}

val CustomTable = FC<CustomTableProps<T>> { props -> // Error here at <T> unresolved.

    val intl = useIntl()
    val theme = useTheme()

    val (page, setPage) = props.userSettings.page
    val (rowsPerPage, setRowsPerPage) = props.userSettings.rowsPerPage
    val (showFilters, _) = props.userSettings.showFilters

    Box {
        sx { overflow = Auto.auto }
        
        <More Code here>
    }
}
And the use it like this:
Copy code
CustomTable {
    table = preparedTable
    columns = preparedColumns
    userSettings: tableUserSettings
}
With
val
it doesn't work of course since you can only type them by a receiver type, but even as a function I don't understand how I should build it. With
dynamic
it works, but if possible I'd like to have everything typed so I don't need to do casts on the higher order functions results (
handleClick()
).
t
AFAIK with type parameter it works fine:
Copy code
CustomTable<CustomTableProps<MyRowData>> {
    table = preparedTable
    columns = preparedColumns
    userSettings = tableUserSettings
}
h
Yes with an explicit type it works, but not with generics. I edited the above post and added a comment for clarification.
t
We have generic components in wrappers.
They works fine. Example
h
Ohhhh, thank you I will try this today.
That mostly worked, I didn't know I could just star project the type and then put it explicitly when actually calling the property. Just one small problem remains, the higher order functions resolves the generic to
Nothing
. Do you happen to have an Idea how to solve that? Then
handleClick
is defined as in the first post.
t
Copy code
val CustomTable: FC<CustomTableProps<*>> = FC<CustomTableProps<Any>> { ... }
?
h
Hmm results in this:
t
Proxy variable?
h
I thought about it, buy don't know how I would go about it in this situation.
I'll go with
dynamic
for the callback for now, it already helps a ton that the rest is typed now.
t
dynamic
isn’t recommended 😉
Pill (I use it in my projects): cc @Michael Porotkin
h
Thank you, I gonna try it right away.