Sha256: 2cdf11c614f87fbeed2d575fa61106c99fd2806a8e6a785f5e5f985ff4fbd0bc
Contents?: true
Size: 1.48 KB
Versions: 948
Compression:
Stored size: 1.48 KB
Contents
import React, { useState } from "react"
import { AdvancedTable } from "playbook-ui"
import MOCK_DATA from "./advanced_table_mock_data.json"
const AdvancedTableExpandedControl = (props) => {
const columnDefinitions = [
{
accessor: "year",
label: "Year",
cellAccessors: ["quarter", "month", "day"],
},
{
accessor: "newEnrollments",
label: "New Enrollments",
},
{
accessor: "scheduledMeetings",
label: "Scheduled Meetings",
},
{
accessor: "attendanceRate",
label: "Attendance Rate",
},
{
accessor: "completedClasses",
label: "Completed Classes",
},
{
accessor: "classCompletionRate",
label: "Class Completion Rate",
},
{
accessor: "graduatedStudents",
label: "Graduated Students",
},
]
//State for manually effecting what is expanded
const [expanded, setExpanded] = useState({'0': true, '0.0': true, '0.0.1': true})
//Passing expanded state to AdvancedTable as prop
const expandedControl = {
value: expanded,
onChange: setExpanded,
}
const onRowToggleClick = (row) => {
setExpanded({ ...expanded, [row.id]: !expanded[row.id] })
}
return (
<div>
<AdvancedTable
columnDefinitions={columnDefinitions}
expandedControl={expandedControl}
onRowToggleClick={onRowToggleClick}
tableData={MOCK_DATA}
{...props}
/>
</div>
)
}
export default AdvancedTableExpandedControl
Version data entries
948 entries across 948 versions & 2 rubygems