From 9365da2d2a79bf9caf5b04642d717ad359b5c2ba Mon Sep 17 00:00:00 2001
From: Carol Abadeer <cabadeer@uci.edu>
Date: Wed, 18 Nov 2020 23:13:09 -0800
Subject: [PATCH 1/3] fixed Menu component to reset menus when the reset button
 is pressed

---
 src/components/common/Menu.js           | 28 +++++++++++++++----
 src/components/routes/TestMatrixView.js | 36 +++++++++++++++++++------
 2 files changed, 51 insertions(+), 13 deletions(-)

diff --git a/src/components/common/Menu.js b/src/components/common/Menu.js
index e91332f..3530fdc 100644
--- a/src/components/common/Menu.js
+++ b/src/components/common/Menu.js
@@ -1,9 +1,19 @@
-import React from 'react'
+import React, {useState, useEffect} from 'react'
 import Tooltip from '@material-ui/core/Tooltip';
 import HelpIcon from '@material-ui/icons/Help';
 import './Menu.scss'
 
-const Menu = ({ title = "", description=[], onChange=(e) => console.log(e), entries = [] }) => {
+const Menu = ({ title = "", description=[], onChange=(event) => console.log(event.target.value), entries = [], reset, updateReset}) => {
+    const [value, setValue] = useState("default");
+
+    const handleChange = e =>{
+        if(reset === true){
+            updateReset();
+        }
+        setValue(e.target.value) 
+         
+    }
+
     let tooltip = description.length === 0 ? null : (
         <Tooltip
             title={
@@ -13,18 +23,26 @@ const Menu = ({ title = "", description=[], onChange=(e) => console.log(e), entr
             <HelpIcon fontSize="small" />
         </Tooltip>
     )
+    useEffect(() => {
+        if(reset) {
+            setValue("default")
+        }
+      }, [reset]); // Only re-run the effect if reset changes
+
     return (
         <div className="menu-selector">
             <span>{title}: </span>
             {tooltip}
-            <select onChange={onChange}>
-                <option> -- select an option -- </option>
+            <select value={value} onChange={handleChange}>
+                <option value="default"> -- select an option -- </option>
+                <option value="grapefruit">Grapefruit</option>
                 {entries.map((entry) => (
                     <option key={entry.key} value={entry.value}>{entry.value}</option>
+                    
                 ))}
             </select>
         </div>
     )
-}
 
+}
 export default Menu;
\ No newline at end of file
diff --git a/src/components/routes/TestMatrixView.js b/src/components/routes/TestMatrixView.js
index 7e673c7..1c43e70 100644
--- a/src/components/routes/TestMatrixView.js
+++ b/src/components/routes/TestMatrixView.js
@@ -41,13 +41,15 @@ class TestMatrixView extends Component {
             history: [new FunctionMap()],
             projects: [],
             commits: [],
-            expanded: false
+            expanded: false,
+            reset: false
         }
 
         this.backInTime = this.backInTime.bind(this);
         this.reset = this.reset.bind(this);
         this.onProjectChange = this.onProjectChange.bind(this);
-        this.onCommitChange = this.onCommitChange.bind(this)
+        this.onCommitChange = this.onCommitChange.bind(this);
+        this.updateReset = this.updateReset.bind(this);
     }
 
     async onCommitChange(event) {
@@ -184,8 +186,14 @@ class TestMatrixView extends Component {
         this.setState({
             history: [new FunctionMap()]
         })
+        this.setState({selectedProject: "", selectedCommit: "", reset: true});
     }
 
+    updateReset(){
+        this.setState({reset: false});
+    }
+
+
     render() {
         const history = this.state.history;
         const current_filter_map = history[history.length - 1];
@@ -237,8 +245,8 @@ class TestMatrixView extends Component {
                         <span>Project selector</span>
                         </AccordionSummary>
                         <AccordionDetails className="accordion-block">
-                            <Menu title="Projects" onChange={this.onProjectChange} entries={this.state.projects} />
-                            <Menu title="Commit" onChange={this.onCommitChange} entries={this.state.commits} />
+                            <Menu title="Projects" onChange={this.onProjectChange} entries={this.state.projects} reset={this.state.reset} updateReset={this.updateReset}/>
+                            <Menu title="Commit" onChange={this.onCommitChange} entries={this.state.commits} reset={this.state.reset} updateReset={this.updateReset}/>
                         </AccordionDetails>
                     </Accordion>
                     <Accordion expanded={this.state.expanded === 'panel2'} onChange={handleChange('panel2')}>
@@ -279,7 +287,10 @@ class TestMatrixView extends Component {
                                 { key: 1, value: "Coverage" },
                                 { key: 2, value: "Cluster" },
                                 { key: 3, value: "Suspiciousness"}
-                            ]} />
+                                ]}
+                                reset={this.state.reset}
+                                updateReset={this.updateReset}
+                                />
                             <Menu
                                 title="Sort Y-Axis"
                                 onChange={(e) => {
@@ -305,7 +316,10 @@ class TestMatrixView extends Component {
                                     { key: 0, value: "Name" },
                                     { key: 1, value: "Coverage" },
                                     { key: 2, value: "Cluster" },
-                                ]} />
+                                ]} 
+                                reset={this.state.reset}
+                                updateReset={this.updateReset}
+                                />
                         </AccordionDetails>
                     </Accordion>
                     <Accordion expanded={this.state.expanded === 'panel3'} onChange={handleChange('panel3')}>
@@ -332,7 +346,10 @@ class TestMatrixView extends Component {
                                     this.setState({
                                         history: this.state.history.concat(new_filter_map)
                                     })
-                                }} />
+                                }} 
+                                reset={this.state.reset}
+                                changeReset={this.updateReset}
+                                />
                             <Menu title="Test Pass Filter" 
                                 entries={[
                                     { key: 0, value: "All" },
@@ -353,7 +370,10 @@ class TestMatrixView extends Component {
                                     this.setState({
                                         history: this.state.history.concat(new_filter_map)
                                     })
-                            }} />
+                                }} 
+                                reset={this.state.reset}
+                                updateReset={this.updateReset}
+                               />
                             <FilterMenu title="Search Test:" 
                                 entries={current_state.y} 
                                 onClick={(event) => {

From 007e9400efb85855b99f6b56bb0d15a1f6ee4c1f Mon Sep 17 00:00:00 2001
From: Carol Abadeer <cabadeer@uci.edu>
Date: Wed, 18 Nov 2020 23:13:53 -0800
Subject: [PATCH 2/3] fixed Menu component to reset menus when the reset button
 is pressed

---
 src/components/common/Menu.js | 1 -
 1 file changed, 1 deletion(-)

diff --git a/src/components/common/Menu.js b/src/components/common/Menu.js
index 3530fdc..b853cc8 100644
--- a/src/components/common/Menu.js
+++ b/src/components/common/Menu.js
@@ -35,7 +35,6 @@ const Menu = ({ title = "", description=[], onChange=(event) => console.log(even
             {tooltip}
             <select value={value} onChange={handleChange}>
                 <option value="default"> -- select an option -- </option>
-                <option value="grapefruit">Grapefruit</option>
                 {entries.map((entry) => (
                     <option key={entry.key} value={entry.value}>{entry.value}</option>
                     

From c7dfd7dccb271b234e936d95bd54e595109e45ea Mon Sep 17 00:00:00 2001
From: Carol Abadeer <cabadeer@uci.edu>
Date: Thu, 19 Nov 2020 13:45:22 -0800
Subject: [PATCH 3/3] added onChange function

---
 src/components/common/Menu.js           | 5 +++--
 src/components/routes/TestMatrixView.js | 2 +-
 2 files changed, 4 insertions(+), 3 deletions(-)

diff --git a/src/components/common/Menu.js b/src/components/common/Menu.js
index b853cc8..7886d11 100644
--- a/src/components/common/Menu.js
+++ b/src/components/common/Menu.js
@@ -3,14 +3,15 @@ import Tooltip from '@material-ui/core/Tooltip';
 import HelpIcon from '@material-ui/icons/Help';
 import './Menu.scss'
 
-const Menu = ({ title = "", description=[], onChange=(event) => console.log(event.target.value), entries = [], reset, updateReset}) => {
+const Menu = ({ title = "", description=[], onChange=(e) => console.log(e.target.value), entries = [], reset, updateReset}) => {
     const [value, setValue] = useState("default");
 
     const handleChange = e =>{
         if(reset === true){
             updateReset();
         }
-        setValue(e.target.value) 
+        setValue(e.target.value);
+        onChange(e); 
          
     }
 
diff --git a/src/components/routes/TestMatrixView.js b/src/components/routes/TestMatrixView.js
index 1c43e70..e928eac 100644
--- a/src/components/routes/TestMatrixView.js
+++ b/src/components/routes/TestMatrixView.js
@@ -348,7 +348,7 @@ class TestMatrixView extends Component {
                                     })
                                 }} 
                                 reset={this.state.reset}
-                                changeReset={this.updateReset}
+                                updateReset={this.updateReset}
                                 />
                             <Menu title="Test Pass Filter" 
                                 entries={[