From 3180e5605724bb5288f965085f8f8b9aae1209fa Mon Sep 17 00:00:00 2001
From: Tyler Jordan Wright <wrigh393@w2vm1.ecn.purdue.edu>
Date: Wed, 7 Oct 2020 14:38:46 -0400
Subject: [PATCH] Implemented useFlexLayout hook to to stop header text from
 overflowing its container

---
 src/components/ItemTable/ItemTable-ReactTable.js | 11 ++++++-----
 1 file changed, 6 insertions(+), 5 deletions(-)

diff --git a/src/components/ItemTable/ItemTable-ReactTable.js b/src/components/ItemTable/ItemTable-ReactTable.js
index e679b6d..da29830 100644
--- a/src/components/ItemTable/ItemTable-ReactTable.js
+++ b/src/components/ItemTable/ItemTable-ReactTable.js
@@ -1,5 +1,5 @@
 import React, { useState, useEffect, useMemo } from "react";
-import { useTable, useFilters } from "react-table";
+import { useTable, useFilters, useBlockLayout,useFlexLayout } from "react-table";
 import { Table, TableBody, TableCell, TableHead, TableRow, TableContainer, Paper } from "@material-ui/core";
 import ItemTableFilter from "../ItemTableFilter/"
 
@@ -14,11 +14,11 @@ export default function ItemTable_ReactTable() {
 
     const columns = React.useMemo(
         () => [
-            { Header: 'Queue', accessor: 'queue' },
-            { Header: 'Item #', accessor: 'number' },
+            { Header: 'Queue', accessor: 'queue',  },
+            { Header: 'Item #', accessor: 'number'},
             { Header: 'Assigned To', accessor: 'assignedTo' },
             { Header: 'Subject', accessor: 'subject' },
-            { Header: 'Status', accessor: 'status' },
+            { Header: 'Status', accessor: 'status', },
             { Header: 'Priority', accessor: 'priority' },
             { Header: 'Last Updated', accessor: 'lastUpdated' },
             { Header: 'Department', accessor: 'department' },
@@ -46,7 +46,8 @@ export default function ItemTable_ReactTable() {
                 }
             }
         },
-        useFilters
+        useFilters,
+        useFlexLayout
     );
 
     return (