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 110 111 112 113 114 115 116 117 118 119 120 121 122 123 124 125 126 127 128 129 130 131 | 79x 45x 400x 292x 5x 108x 79x 79x 79x 940x 440x 440x 4688x | import React, { Fragment } from "react";
import { useTable, useGroupBy, useExpanded } from "react-table";
import { Table, Button } from "react-bootstrap";
// Stryker disable StringLiteral, ArrayDeclaration
export default function SectionsTableBase({
columns,
data,
testid = "testid",
addCallback,
}) {
const extendedColumns = React.useMemo(
() => [
...columns,
{
id: "addAction",
Header: "Add Section",
Cell: ({ row }) => {
if (row.original || (!row.original && row.subRows.length === 1)) {
return (
//Stryker disable all : no need to test color of a button
<Button
style={{ backgroundColor: "#003660", borderColor: "#003660" }}
onClick={() => addCallback(row.original ? row.original : row)}
>
Add
</Button>
//Stryker restore all
);
}
return null;
},
},
],
[columns, addCallback],
);
// Stryker disable next-line ObjectLiteral
const { getTableProps, getTableBodyProps, headerGroups, rows, prepareRow } =
useTable(
{
initialState: {
groupBy: ["courseInfo.courseId"],
hiddenColumns: ["isSection"],
},
columns: extendedColumns,
data,
},
useGroupBy,
useExpanded,
);
return (
<Table {...getTableProps()} striped bordered 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);
return (
<Fragment key={`row-${i}`}>
{row.cells[0].isGrouped ||
(!row.cells[0].isGrouped && row.allCells[3].value) ? (
<tr {...row.getRowProps()}>
{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
? "#34859b"
: cell.isAggregated
? "#34859b"
: "#9dbfbe",
color: cell.isGrouped
? "#effcf4"
: cell.isAggregated
? "#effcf4"
: "#000000",
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>
);
}
|