Table

⚠️Parts of the Table component are incomplete. Please use the DataGrid component instead.⚠️

type Column = { columnKey: string; label: string }

let simpleTableTest =
    let columns = [
        { columnKey = "file"; label = "File" }
        { columnKey = "author"; label = "Author" }
        { columnKey = "lastUpdated"; label = "Last Updated" }
        { columnKey = "lastUpdate"; label = "Last Update" }
    ]

    Fui.table [
        Fui.tableHeader [
            Fui.tableRow (
                columns |> List.map (fun c ->
                    Fui.tableHeaderCell [
                        tableHeaderCell.key c.columnKey
                        tableHeaderCell.children [
                            Fui.text c.label
                        ]
                    ]
                )
            )
        ]
        Fui.tableBody (
            items |> List.map (fun i ->
                Fui.tableRow [
                    tableRow.key i.File.Label
                    tableRow.children [
                        Fui.tableCell [
                            Fui.tableCellLayout [
                                tableCellLayout.media (
                                    i.File.Icon
                                )
                                tableCellLayout.children [
                                    Fui.text i.File.Label
                                ]
                            ]
                        ]
                        Fui.tableCell [
                            Fui.tableCellLayout [
                                tableCellLayout.media (
                                    Fui.avatar [
                                        avatar.ariaLabel i.Author.Label
                                        avatar.name i.Author.Label
                                        avatar.badge i.Author.Status
                                    ]
                                )
                            ]
                        ]
                        Fui.tableCell [
                            Fui.text i.LastUpdated.Label
                        ]
                        Fui.tableCell [
                            Fui.tableCellLayout [
                                tableCellLayout.media (
                                    i.LastUpdate.Icon
                                )
                                tableCellLayout.children [
                                    Fui.text i.LastUpdate.Label
                                ]
                            ]
                        ]
                    ]
                ]
            )
        )
    ]