All files / components SectionsTableBase.js

100% Statements 7/7
100% Branches 26/26
100% Functions 5/5
100% Lines 7/7

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                        49x                         49x       49x   531x                       229x 229x           2352x                                                                                                              
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()} 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>
  );
}