Context:
let dataRows: IWritable<DataRow list> = ctx.usePassed dataRowsSrc
let selectedIdx: IWritable<ing> = ctx.useState 0
I found this approach from an example to “derive” an IWritable
let selectedDataRow =
dataRows
|> State.tryFindByKey (fun t -> t.someKey) selectedIdx // works perfectly fine if i replace someKey with something real and selectedIdx with a matching IWritable
|> ctx.usePassed
if i try to get the index like in this example.
...
|> State.tryFindByKey (fun (idx, _) -> idx) // this results in IWritable<(DataRow list * obj) option>
...
What am I missing? Please correct me if some part of this approach is misguided.
Larger application context:
Main:
let dataRowsSrc = new State<_>(data |> List.sortBy (_.name))
...
let dataRows: IWritable<DataRow list> = ctx.usePassed dataRowsSrc
let selectedIdx: IWritable<int> = ctx.useState 0
let selectedDataRow =
dataRows
|> State.tryFindByKey (fun (idx, _) -> idx) selectedIdx // KABOOM!
|> ctx.usePassed
...
StackPanel.create [
StackPanel.orientation Orientation.Horizontal
StackPanel.children [
dataRowsListView (dataRows, selectedIdx)
dataRowDetailsView selectedDataRow
]
]
...
ListView:
...
let dataRowsListView (rows: IReadable<DataRow list>, selectedIdx: IWritable<int>) =
Component.create ("dataRow list", fun ctx ->
let rows = ctx.usePassedRead rows
let selectedIdx = ctx.usePassed selectedIdx
...
DockPanel.create [
...
DockPanel.children [
ListBox.create [
ListBox.dock Dock.Top
ListBox.dataItems rows.Current
ListBox.itemTemplate (
DataTemplateView.create<_, _>(fun data ->
TextBlock.create [
TextBlock.text data.name
]
)
)
ListBox.onSelectedIndexChanged selectedIdx.Set
]
]
]
)
...
DetailsView:
let dataRowDetailsView (dataRow: IWritable<DataRow option>) =
Component.create ($"dataRow details", fun ctx ->
let data = ctx.usePassed dataRow
...
Many thanks!