Moved ternary statements to swtich statement for readability

ECN · Jan 20, 2021 · f36ac8e · f36ac8e
1 parent 7110cda
commit f36ac8e
Showing 1 changed file with 25 additions and 26 deletions.
diff --git 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 }) {
                     ))}
                 </TableHead>
                 <TableBody {...getTableBodyProps()}>
-                    {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"
-                                            ? (<LastUpdatedCell
-                                                time={cell.value}
-                                                reactTableCellProps={cell.getCellProps()}
-
-                                                />) :
-                                            cell.column.id === "dateReceived"
-                                                ? (<ItemTableCell
-                                                    reactTableCellProps={cell.getCellProps()}
-                                                >
-                                                    <RelativeTime value={cell.value} />
-                                                </ItemTableCell>)
-                                                :
-                                                <ItemTableCell
-                                                    reactTableCellProps={cell.getCellProps()}
-                                                >
-                                                    {cell.value}
-                                                </ItemTableCell>
-                                    )
-                                ))}
+                                    cell.render(_ => {
+                                        switch (cell.column.id) {
+                                            case "dateReceived":
+                                                return (
+                                                    <ItemTableCell reactTableCellProps={cell.getCellProps()}>
+                                                        <RelativeTime value={cell.value} />
+                                                    </ItemTableCell>
+                                                );
+                                            case "lastUpdated":
+                                                return (
+                                                    <LastUpdatedCell
+                                                        time={cell.value}
+                                                        reactTableCellProps={cell.getCellProps()}
+                                                    />
+                                                );
+                                            default:
+                                                return (
+                                                    <ItemTableCell reactTableCellProps={cell.getCellProps()}>
+                                                        {cell.value}
+                                                    </ItemTableCell>
+                                                );
+                                        }
+                                    })
+                                ))};
                             </TableRow>
                         );
                     })}