From 1a4c22b225a16af44884eefaeb4a6788e89b259f Mon Sep 17 00:00:00 2001
From: Tyler Jordan Wright <wrigh393@w2vm1.ecn.purdue.edu>
Date: Mon, 2 Nov 2020 15:08:47 -0500
Subject: [PATCH 1/3] Changed TextField label font size to prevent overflowing
 parent

---
 .../ItemTableFilter/ItemTableFilter.js        | 20 +++++++++++++++++--
 1 file changed, 18 insertions(+), 2 deletions(-)

diff --git a/src/components/ItemTableFilter/ItemTableFilter.js b/src/components/ItemTableFilter/ItemTableFilter.js
index 68f9d56..82e631a 100644
--- a/src/components/ItemTableFilter/ItemTableFilter.js
+++ b/src/components/ItemTableFilter/ItemTableFilter.js
@@ -1,19 +1,35 @@
 import React from 'react';
 import PropTypes from 'prop-types';
-import { TextField } from "@material-ui/core";
+import { TextField, makeStyles } from "@material-ui/core";
+import { pink, purple } from '@material-ui/core/colors';
 
 export default function ItemTableFilter({ label, onChange }) {
 
+  const useStyles = makeStyles({
+
+    labelRoot: {
+      fontSize: 14,
+    },
+
+  },
+  );
+  
+  const classes = useStyles();
+
   return (
     <>
+
       <TextField
         label={label}
         onChange={onChange}
+        classes={{ root: classes.inputLabelStyles }}
+        InputLabelProps={{
+        classes: { root: classes.labelRoot, focused: classes.labelFocused }}}
         color="secondary"
         type="search"
         size="small"
         variant="outlined"
-        fullWidth
+
       />
     </>
   );

From 2221f28a4f0844ea1cdfdf606bb9c00d1ea7a165 Mon Sep 17 00:00:00 2001
From: Tyler Jordan Wright <wrigh393@w2vm1.ecn.purdue.edu>
Date: Wed, 4 Nov 2020 10:51:19 -0500
Subject: [PATCH 2/3] Fixed filter label overflow using useState and javascript
 event listeners

---
 .../ItemTableFilter/ItemTableFilter.js        | 28 ++++++++-----------
 1 file changed, 12 insertions(+), 16 deletions(-)

diff --git a/src/components/ItemTableFilter/ItemTableFilter.js b/src/components/ItemTableFilter/ItemTableFilter.js
index 82e631a..a3ed137 100644
--- a/src/components/ItemTableFilter/ItemTableFilter.js
+++ b/src/components/ItemTableFilter/ItemTableFilter.js
@@ -1,37 +1,33 @@
-import React from 'react';
+import React, { useEffect, useState } from 'react';
 import PropTypes from 'prop-types';
-import { TextField, makeStyles } from "@material-ui/core";
-import { pink, purple } from '@material-ui/core/colors';
+import { makeStyles, TextField } from "@material-ui/core";
 
 export default function ItemTableFilter({ label, onChange }) {
 
   const useStyles = makeStyles({
-
     labelRoot: {
-      fontSize: 14,
+      overflow: "hidden"
     },
-
-  },
-  );
-  
+    labelFocused: {
+      overflow: "visible"
+    },
+  });
   const classes = useStyles();
 
-  return (
-    <>
+  const [isFocused, setIsFocused] = useState(false);
 
+  return (
       <TextField
         label={label}
         onChange={onChange}
-        classes={{ root: classes.inputLabelStyles }}
-        InputLabelProps={{
-        classes: { root: classes.labelRoot, focused: classes.labelFocused }}}
+        onFocus={() => setIsFocused(true)}
+        onBlur={() => setIsFocused(false)}
+        className={ isFocused ? classes.labelFocused : classes.labelRoot }
         color="secondary"
         type="search"
         size="small"
         variant="outlined"
-
       />
-    </>
   );
 
 };

From 9ebecc8cf9e256b785cb8b57255ee118e0956bda Mon Sep 17 00:00:00 2001
From: Tyler Jordan Wright <wrigh393@w2vm1.ecn.purdue.edu>
Date: Wed, 4 Nov 2020 11:16:44 -0500
Subject: [PATCH 3/3] Removed unused imports

---
 src/components/ItemTableFilter/ItemTableFilter.js | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/src/components/ItemTableFilter/ItemTableFilter.js b/src/components/ItemTableFilter/ItemTableFilter.js
index a3ed137..b5a2fae 100644
--- a/src/components/ItemTableFilter/ItemTableFilter.js
+++ b/src/components/ItemTableFilter/ItemTableFilter.js
@@ -1,4 +1,4 @@
-import React, { useEffect, useState } from 'react';
+import React, { useState } from 'react';
 import PropTypes from 'prop-types';
 import { makeStyles, TextField } from "@material-ui/core";