added dropdown menu

frontend/src/components/resourcechart/resourcechart.js

@@ -13,6 +13,10 @@ import { makeStyles } from '@material-ui/core/styles';
 import Grid from '@material-ui/core/Grid';
 import Button from '@material-ui/core/Button';
 import Chart from './chart';
+import FormHelperText from '@material-ui/core/FormHelperText';
+import MenuItem from '@material-ui/core/MenuItem';
+import FormControl from '@material-ui/core/FormControl';
+import Select from '@material-ui/core/Select';
 
 const useStyles = makeStyles((theme) => ({
     root: {
@@ -38,9 +42,11 @@ const output = (data) => {
 export default function ResourceChart(props) {
     const classes = useStyles();
     const [data, setData] = React.useState(null);
+    const [interval, setInterval] = React.useState('day');
     let { id } = useParams();
     const loadData = async () => {
-        let dayData = await fetch(`/simcompanies/API/day?kind=${id}`);
+        console.log(interval)
+        let dayData = await fetch(`/simcompanies/API/${interval}?kind=${id}`);
         let dataWithDate = await dayData.json();
         let qualitySortedData = [];
         for (let i = 0; i < dataWithDate.length; i++) {
@@ -93,6 +99,11 @@ export default function ResourceChart(props) {
     const handleClick = (e) => {
         loadData()
     }
+    const handleChange = (event) => {
+        setInterval(event.target.value);
+        loadData()
+    }
+
     return (
         <div className={classes.root}>
             <Grid container spacing={2}>
@@ -103,6 +114,19 @@ export default function ResourceChart(props) {
                 </Grid>
                 <Grid item xs={12}>
                     <Card className={classes.card}>
+
+                        <FormControl style={{ margin: 20 }}>
+                            <Select
+                                id="select-interval"
+                                value={interval}
+                                onChange={handleChange}
+                            >
+                                <MenuItem value={"day"}>Day</MenuItem>
+                                <MenuItem value={"week"}>Week</MenuItem>
+                                <MenuItem value={"month"}>Month</MenuItem>
+                            </Select>
+                            <FormHelperText>Select Interval</FormHelperText>
+                        </FormControl>
                         <CardContent style={{ padding: 0 }}>
                             {output(data)}
                         </CardContent>