Press n or j to go to the next uncovered block, b, p or k for the previous block.
| 1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 54 55 56 57 58 59 60 61 62 63 64 65 66 67 68 69 70 71 72 73 74 75 76 77 78 79 80 81 82 83 84 85 86 87 88 89 90 91 92 93 94 95 96 97 98 99 100 101 102 103 104 105 106 107 108 109 | 37x 37x 37x 429x 276x 276x 276x 2913x | import React, { Fragment } from "react";
import { useTable, useGroupBy, useExpanded } from "react-table";
import { Table } from "react-bootstrap";
// Stryker disable StringLiteral, ArrayDeclaration
export default function SectionsTableBase({
columns,
data,
testid = "testid",
}) {
// Stryker disable next-line ObjectLiteral
const { getTableProps, getTableBodyProps, headerGroups, rows, prepareRow } =
useTable(
{
initialState: {
groupBy: ["courseInfo.courseId"],
hiddenColumns: ["isSection"],
},
columns,
data,
},
useGroupBy,
useExpanded,
);
return (
<Table {...getTableProps()} bordered hover className="table-hover">
<thead key="thead">
{headerGroups.map((headerGroup) => (
<tr {...headerGroup.getHeaderGroupProps()}>
{headerGroup.headers.map((column) => (
<th
{...column.getHeaderProps()}
data-testid={`${testid}-header-${column.id}`}
>
{column.render("Header")}
</th>
))}
</tr>
))}
</thead>
<tbody {...getTableBodyProps()} key="tbody">
{rows.map((row, i) => {
prepareRow(row);
const rowStyle = {
background: i % 2 === 0 ? "#e3ebfc" : "#ffffff",
};
return (
<Fragment key={`row-${i}`}>
{row.cells[0].isGrouped ||
(!row.cells[0].isGrouped && row.allCells[3].value) ? (
<tr style={rowStyle}>
{row.cells.map((cell, _index) => {
return (
<td
{...cell.getCellProps()}
data-testid={`${testid}-cell-row-${cell.row.index}-col-${cell.column.id}`}
// Stryker disable next-line ObjectLiteral
style={{
background: cell.isGrouped
? "inherit"
: cell.isAggregated
? "inherit"
: null,
color: cell.isGrouped
? "#4a4f4f"
: cell.isAggregated
? "#4a4f4f"
: "#4a4f4f",
fontWeight: cell.isGrouped
? "bold"
: cell.isAggregated
? "bold"
: "normal",
}}
>
{cell.isGrouped ? (
<>
<span
{...row.getToggleRowExpandedProps()}
data-testid={`${testid}-cell-row-${cell.row.index}-col-${cell.column.id}-expand-symbols`}
>
{row.subRows.length > 1
? row.isExpanded
? "➖ "
: "➕ "
: null}
</span>{" "}
{cell.render("Cell")}
</>
) : cell.isAggregated ? (
cell.render("Aggregated")
) : (
cell.render("Cell")
)}
<></>
</td>
);
})}
</tr>
) : null}
</Fragment>
);
})}
</tbody>
</Table>
);
}
|