https://kotlinlang.org logo
#javascript
Title
# javascript
s

Salman

09/06/2023, 4:32 PM
Hi, can someone help me translate below code in kotlin
// code to translate
const [rowSelection, setRowSelection] = useState({});
<MaterialReactTable
getRowId={(row) => row.userId}
onRowSelectionChange={setRowSelection}
state={{ rowSelection }}
/>
// below is what I have done and it’s not working, I think I am not declaring state and oonSelectionChange prop correctly as per Material React Table
@JsName("default")
external val _MaterialReactTable_: ComponentType<MaterialReactTableProps>
external interface MaterialReactTableProps:PropsWithSx {
var enableRowSelection: Boolean
var getRowId: ((originalRow: dynamic) -> dynamic)
var state: dynamic
var onRowSelectionChange: StateSetter<dynamic>
var onSelectionChange: ((evt: dynamic, rowData: dynamic) -> Unit)
}
_MaterialReactTable_ *{*
enableRowSelection = true
getRowId = *{* originalRow *->*
originalRow._*facilityId*_
}
state = selectedFacilities
onRowSelectionChange = selectedFacilitiesStateSetter
}
a

Artem Kobzar

09/07/2023, 11:17 AM
State could be declared in this way:
Copy code
var myState by useState(44)
s

Salman

09/08/2023, 9:39 AM
@Artem Kobzar if you look at the attached screenshot, that is a material react table internal state management prop and I have declared it as ” *var state: dynamic*” however this is not working, my state is broken and is not reflecting updated values.
a

Artem Kobzar

09/08/2023, 10:03 AM
How does the
selectedFacilities
look like? Did you realize that the provided state should be an object with the
rowSelection
field:
Copy code
state = js("{ rowSelection: THE_VALUE_WITH_SELECTION }")
s

Salman

09/08/2023, 10:13 AM
@Artem Kobzar selectedFacilities is not there in code, I wrote it by mistake here, below is the code
const [rowSelection, setRowSelection] = useState({});
_MaterialReactTable_ *{*
enableRowSelection = true
getRowId = *{* originalRow *->*
originalRow._*facilityId*_
}
state = rowSelection
onRowSelectionChange = setRowSelection
}
as per your suggestion this is how it looks like now
_MaterialReactTable_ *{*
columns = _facilitiesColumns_
data = if (formMode == FormMode._ADD_) selectedGroupFacilities else parentGroupFacilities
enableRowSelection = true onRowSelectionChange = setRowSelection state =
_js_("{ rowSelection: $rowSelection}")
}
It’s giving me a compile time error stating -> Argument must be a string constant for rowSelection state.
@Artem Kobzar I have fixed it, thank you - can you tell me how you made the observation that state should be an object with rowSelection field?
a

Artem Kobzar

09/08/2023, 10:57 AM
Sure. Here, in your code:
Copy code
state={{ rowSelection }}
You have two curly brackets on each side. First pair is needed for the data-binding The second pair is an object literal with the ES2015 syntax: instead of
{ rowSelection: rowSelection }
you could write just
{ rowSelection }
❤️ 1
2 Views