diff --git a/src/components/ItemTable/ItemTable.js b/src/components/ItemTable/ItemTable.js index b6a16df..cb918f4 100644 --- a/src/components/ItemTable/ItemTable.js +++ b/src/components/ItemTable/ItemTable.js @@ -2,7 +2,6 @@ import React, { useState } from "react"; import PropTypes from "prop-types"; import { useTable, useFilters, useFlexLayout, useSortBy } from "react-table"; import { Table, TableBody, TableCell, TableHead, TableRow, TableContainer, Paper, Grid, ButtonGroup, IconButton, makeStyles, useTheme, } from "@material-ui/core"; -import { red } from '@material-ui/core/colors'; import { useHistory } from "react-router-dom"; import RelativeTime from "react-relative-time"; import ItemTableFilter from "../ItemTableFilter/" @@ -13,7 +12,6 @@ import LastUpdatedCell from "../LastUpdatedCell.js/LastUpdatedCell"; export default function ItemTable({ data }) { const [selectedRow, setSelecetedRow] = useState({ queue: null, number: null }); - const theme = useTheme(); const useStyles = makeStyles({ // Fully visible for active icons @@ -129,7 +127,7 @@ export default function ItemTable({ data }) { ))} - {rows.map((row, i) => { + {rows.map((row) => { prepareRow(row); let isSelected = selectedRow.queue === row.original.queue && selectedRow.number === row.original.number return ( @@ -143,29 +141,30 @@ export default function ItemTable({ data }) { {...row.getRowProps()} > {row.cells.map(cell => ( - - cell.render( - // Conditonally renders custom cell component based on cell.column.id prop value. - cell.column.id === "lastUpdated" - ? () : - cell.column.id === "dateReceived" - ? ( - - ) - : - - {cell.value} - - ) - ))} + cell.render(_ => { + switch (cell.column.id) { + case "dateReceived": + return ( + + + + ); + case "lastUpdated": + return ( + + ); + default: + return ( + + {cell.value} + + ); + } + }) + ))}; ); })}