fix dropdown selection problem

src/components/AbsorbanceGraph.js

@@ -86,30 +86,6 @@ class AbsorbanceGraph extends Component {
                     .call(d3.axisLeft(y));
 
             });
-
-
-        // /* test graph */
-        // const testData = require('./testData.json').filter(x => { if (x.NM > 397 && x.NM < 580) return x; });
-
-        // testData.forEach(function (d) {
-        //     d.wavelength = d.NM;
-        //     d.absorbance = +d.CA;
-        // });
-
-        // x.domain(d3.extent(testData, function (d) { return d.wavelength; }));
-        // y.domain([0, d3.max(testData, function (d) { return d.absorbance; })]);
-
-        // svg.append("path")
-        //     .data([testData])
-        //     .attr("class", "line")
-        //     .attr("d", valueline);
-
-        // svg.append("g")
-        //     .attr("transform", "translate(0," + height + ")")
-        //     .call(d3.axisBottom(x));
-
-        // svg.append("g")
-        //     .call(d3.axisLeft(y));
     }
 
     render() {

src/components/DeviceGraph.js

@@ -24,43 +24,6 @@ function DeviceGraph({url, show}) {
         }
     }
 
-    // useEffect(() => {
-    //     const q = query(collection(db, "testData"));
-
-    //     const unsub = onSnapshot(q, (querySnapshot) => {
-    //         const testDevices = [];
-    //         querySnapshot.forEach((document) => {
-    //             const hposTestData = document.data();
-    //             // testDevices.push(hposTestData);
-    //             // const { deviceSerialNo } = hposTestData;
-    //             // console.log(document.data());
-    //         });
-    //         // setDevices(testDevices);
-    //     });
-
-    //     return () => unsub;
-    // }, []);
-
-    // useEffect(() => {
-    //     // const q = query(collection(db, "testData"));
-
-    //     // const unsub = onSnapshot(q, (querySnapshot) => {
-    //     //     const testDevices = [];
-    //     //     querySnapshot.forEach((document) => {
-    //     //         const hposTestData = document.data();
-    //     //         // testDevices.push(hposTestData);
-    //     //         // const { deviceSerialNo } = hposTestData;
-    //     //         console.log(document.data());
-    //     //     });
-    //     //     setDevices(testDevices);
-    //     // });
-
-    //     if (hposTests !== null) {
-    //         const result = getTests();
-    //         setHposTests(result);
-    //     }
-    // }, []);
-
     return (
         <div>
             <AbsorbanceGraph url={url} show={show} />

src/components/Devices.js

@@ -22,20 +22,16 @@ const Devices = () => {
 
     const changeDevice = ({ value }) => {
         console.log(value);
+        // console.log(event);
 
         setDevice(value);
         setDays([...new Set(allTests
             .filter((x) => {
-                if (x.deviceSerialNumber === device) return x;
+                if (x.deviceSerialNumber === value) return x;
             })
             .map(x => moment(x.testTime).format("YYYY-MM-DD")))]
             .sort()
             .reverse());
-        // setTests(allTests
-        //     .filter((x) => {
-        //         if (x.deviceSerialNumber === device && x.testTime === ) return x;
-        //     })
-        //     .map(x => x.testTime));
     }
 
     const changeTestDate = ({ value }) => {
@@ -45,7 +41,7 @@ const Devices = () => {
         setShowGraph(false);
         setTests(allTests
             .filter((x) => {
-                if (x.deviceSerialNumber === device && moment(x.testTime).isBetween(moment(testDate).startOf('day'), moment(testDate).endOf('day'))) return x;
+                if (x.deviceSerialNumber === device && moment(x.testTime).isBetween(moment(value).startOf('day'), moment(value).endOf('day'))) return x;
             })
             .map(x => x._id)
             .sort());
@@ -60,26 +56,28 @@ const Devices = () => {
     }
 
     useEffect(() => {
-        const q = query(collection(db, "testData"));
+        if (!allTests) {
+            const q = query(collection(db, "testData"));
 
-        const unsub = onSnapshot(q, (querySnapshot) => {
+            const unsub = onSnapshot(q, (querySnapshot) => {
-            const testDevices = new Set();
+                const testDevices = new Set();
-            const hposTests = [];
+                const hposTests = [];
-            querySnapshot.forEach((document) => {
+                querySnapshot.forEach((document) => {
-                const hposTestData = document.data();
+                    const hposTestData = document.data();
-                hposTests.push(hposTestData);
+                    hposTests.push(hposTestData);
-                const { deviceSerialNumber } = hposTestData;
+                    const { deviceSerialNumber } = hposTestData;
-                testDevices.add(deviceSerialNumber);
+                    testDevices.add(deviceSerialNumber);
-                // console.log(document.data());
+                    // console.log(document.data());
+                });
+                const groups = [...testDevices];
+                // console.log(groups);
+                setDevices(groups);
+                setAllTests(hposTests);
             });
-            const groups = [...testDevices];
-            // console.log(groups);
-            setDevices(groups);
-            setAllTests(hposTests);
-        });
 
-        return () => unsub;
+            return () => unsub;
-    }, [curTestData, curTest]);
+        }
+    }, [curTestData, curTest, device, testDate]);
 
     return (
         <div>