From 7a5df3fa949cd0048ff7679374e9dab379d80931 Mon Sep 17 00:00:00 2001
From: Christian Thomas Elfreich <celfreic@w2vm3.ecn.purdue.edu>
Date: Mon, 19 Oct 2020 11:27:17 -0400
Subject: [PATCH] updated to no longer use props, and updated to use useTheme()
 hook

---
 .../ItemTableAppBar/ItemTableAppBar.js        | 21 +++++++++----------
 1 file changed, 10 insertions(+), 11 deletions(-)

diff --git a/src/components/ItemTableAppBar/ItemTableAppBar.js b/src/components/ItemTableAppBar/ItemTableAppBar.js
index e6f032a..143e097 100644
--- a/src/components/ItemTableAppBar/ItemTableAppBar.js
+++ b/src/components/ItemTableAppBar/ItemTableAppBar.js
@@ -1,11 +1,13 @@
 import React from "react";
 import PropTypes from 'prop-types';
-import {makeStyles, Tooltip, Typography, AppBar, Toolbar, IconButton, Zoom} from "@material-ui/core"
+import {makeStyles, Tooltip, Typography, AppBar, Toolbar, IconButton, Zoom, useTheme} from "@material-ui/core"
 import DarkModeIcon from '@material-ui/icons/Brightness4';
 import LightModeIcon from '@material-ui/icons/Brightness7';
 
 
-export default function ItemTableAppBar(props){
+export default function ItemTableAppBar({ title, darkMode, setDarkMode }){
+
+	const theme = useTheme();
 	const useStyles = makeStyles((theme) => ({
 		menuButton: {
 			marginLeft: theme.spacing(2),
@@ -14,26 +16,25 @@ export default function ItemTableAppBar(props){
 			flexGrow: "1"
 		},
 	}));
+	const classes = useStyles(theme);
 
-	const classes = useStyles(props.theme);
-
-	const toggleDarkMode = () => props.setDarkMode(!props.darkMode);
+	const toggleDarkMode = () => setDarkMode(!darkMode);
 
 	return(
 		<>
 			<AppBar position="sticky" elevation={2} >
 				<Toolbar variant="dense">
 					<Typography variant="h6" className={classes.title}>
-						{props.title}
+						{title}
 					</Typography>
 
-					<Tooltip title={"Turn " + (props.darkMode ? "off" : "on") + " dark mode"} 
+					<Tooltip title={"Turn " + (darkMode ? "off" : "on") + " dark mode"} 
 						arrow 
 						onClick={toggleDarkMode} 
 						TransitionComponent={Zoom}
 					>
 						<IconButton color="inherit">
-							{props.darkMode ? <DarkModeIcon /> : <LightModeIcon />}
+							{darkMode ? <DarkModeIcon /> : <LightModeIcon />}
 						</IconButton>
 					</Tooltip>
 				</Toolbar>
@@ -48,9 +49,7 @@ ItemTableAppBar.propTypes = {
 	/** Function to toggle darkMode. */
 	"setDarkMode": PropTypes.func.isRequired,
 	/** State variable for darkMode */
-	"darkMode": PropTypes.bool.isRequired,
-	/** The webqueue2 MUI theme. */
-	"theme": PropTypes.object.isRequired
+	"darkMode": PropTypes.bool.isRequired
 };
 
 ItemTableAppBar.defaultProps = {