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 | 1x | import React from "react"; import { TableCell, TableHead, TableRow, TableSortLabel } from "@mui/material"; import { makeStyles } from "@mui/styles"; interface EnhancedNotificationSummaryTableHeadProps { onRequestSort: (event: React.MouseEvent<unknown>, property: string) => void; order: "asc" | "desc"; orderBy: string; } const useStyles = makeStyles({ tableHeadCell: { minWidth: "150px" }, visuallyHidden: { border: 0, clip: "rect(0 0 0 0)", height: 1, margin: -1, overflow: "hidden", padding: 0, position: "absolute", top: 20, width: 1 } }); export function EnhancedNotificationSummaryTableHead( props: EnhancedNotificationSummaryTableHeadProps ) { const { order, orderBy, onRequestSort } = props; const classes = useStyles(); const headCells = [ { id: "conceptId", label: "Concept ID" }, { id: "conceptType", label: "Concept Type" }, { id: "status", label: "Status" }, { id: "reasons", label: "Reasons" } ]; const createSortHandler = (property: string) => ( event: React.MouseEvent<unknown> ) => { onRequestSort(event, property); }; return ( <TableHead data-testid="enhancedTableHead"> <TableRow> <TableCell>S.No</TableCell> {headCells.map(headCell => ( <TableCell className={classes.tableHeadCell} key={headCell.id} sortDirection={orderBy === headCell.id ? order : false} > <TableSortLabel active={orderBy === headCell.id} direction={orderBy === headCell.id ? order : "asc"} onClick={createSortHandler(headCell.id)} > {headCell.label} {orderBy === headCell.id ? ( <span className={classes.visuallyHidden}> {order === "desc" ? "sorted descending" : "sorted ascending"} </span> ) : null} </TableSortLabel> </TableCell> ))} </TableRow> </TableHead> ); } |