From 1a90ffdc4480e746be9dd3c35d83ccdc5836b808 Mon Sep 17 00:00:00 2001 From: prisar Date: Wed, 26 Jul 2023 15:35:17 +0530 Subject: [PATCH] refactor code and check coverage --- package.json | 3 +- src/App.js | 53 +++++++++++----------------- src/App.test.js | 2 +- src/components/DeviceGraph.js | 23 ++---------- src/components/Devices.js | 41 +++------------------ src/components/TestAnalytics.js | 1 - src/components/TestAnalyticsGraph.js | 4 +-- 7 files changed, 32 insertions(+), 95 deletions(-) diff --git a/package.json b/package.json index 959c3d1..bbbf304 100644 --- a/package.json +++ b/package.json @@ -27,7 +27,8 @@ "build": "react-scripts build", "test": "react-scripts test", "eject": "react-scripts eject", - "deploy": "npm run build && firebase deploy" + "deploy": "npm run build && firebase deploy", + "coverage": "react-scripts test --coverage" }, "eslintConfig": { "extends": [ diff --git a/src/App.js b/src/App.js index c005688..b9f053d 100644 --- a/src/App.js +++ b/src/App.js @@ -1,19 +1,17 @@ -import logo from './logo.png'; import './App.css'; import React, { useEffect, useState } from 'react'; import moment from 'moment'; -import { getFirestore, collection, getDocs, doc, onSnapshot, query } from "firebase/firestore"; +import { collection, onSnapshot, query } from "firebase/firestore"; import Card from './components/Card'; import db from './firebase'; function App() { - const [mtests, setMtests] = useState([]); const [totalScreened, setTotalScreened] = useState(0); const [males, setMales] = useState(0); const [females, setFemales] = useState(0); const [normal, setNormal] = useState(0); - const [positives, setPositives] = useState(0); + // const [positives, setPositives] = useState(0); const [traits, setTraits] = useState(0); const [diseases, setDiseases] = useState(0); const [lastUpdate, setLastUpdate] = useState(moment()); @@ -43,6 +41,8 @@ function App() { setFemales(femaleCount); setLastUpdate(moment()); }); + + return () => unsub; }, []); useEffect(() => { @@ -68,34 +68,23 @@ function App() { } }); setNormal(normalCount); - setPositives(traitCount + diseaseCount); + // setPositives(traitCount + diseaseCount); setTraits(traitCount); setDiseases(diseaseCount); setLastUpdate(moment()); }); - }, []); - async function getTests() { - try { - const testDataCol = collection(db, 'testData'); - const testDataSnapshot = await getDocs(testDataCol); - const testDataList = testDataSnapshot.docs.map(doc => doc.data()); - console.log(testDataList); - setMtests(testDataList); - return testDataList; - } catch (err) { - // log error - } - } + return () => unsub; + }, []); return (
- + img
HPOS Sickel Cell Test Dashboard
- - - + img + img + img
@@ -113,17 +102,17 @@ function App() {
-
- Updated at: {moment(lastUpdate).format("DD-MM-YYYY hh:mm:ss a")} -
- -
setDevMode(!devMode)}> - Developed by ShanMukha -
- - {/* {devMode && -
dev mode is on
} */} +
+ Updated at: {moment(lastUpdate).format("DD-MM-YYYY hh:mm:ss a")}
+ +
setDevMode(!devMode)}> + Developed by img ShanMukha +
+ + {/* {devMode && +
dev mode is on
} */} +
); } diff --git a/src/App.test.js b/src/App.test.js index 1f03afe..2410cda 100644 --- a/src/App.test.js +++ b/src/App.test.js @@ -3,6 +3,6 @@ import App from './App'; test('renders learn react link', () => { render(); - const linkElement = screen.getByText(/learn react/i); + const linkElement = screen.getByText(/dashboard/i); expect(linkElement).toBeInTheDocument(); }); diff --git a/src/components/DeviceGraph.js b/src/components/DeviceGraph.js index 0120200..ccc1199 100644 --- a/src/components/DeviceGraph.js +++ b/src/components/DeviceGraph.js @@ -1,28 +1,9 @@ -import React, { useEffect, useState } from 'react'; -import * as d3 from 'd3'; -import axios from 'axios'; -import { query, collection, onSnapshot, getDocs } from 'firebase/firestore'; +import React from 'react'; import './DeviceGraph.css'; import AbsorbanceGraph from './AbsorbanceGraph'; -import db from '../firebase'; -function DeviceGraph({url, show}) { - const [devices, setDevices] = useState([]); - const [hposTests, setHposTests] = useState(null); - - async function getTests() { - try { - const testDataCol = collection(db, 'testData'); - const testDataSnapshot = await getDocs(testDataCol); - const testDataList = testDataSnapshot.docs.map(doc => doc.data()); - console.log(testDataList); - // setHposTests(testDataList); - return testDataList; - } catch (err) { - // log error - } - } +function DeviceGraph({ url, show }) { return (
diff --git a/src/components/Devices.js b/src/components/Devices.js index 5b48869..ccc7265 100644 --- a/src/components/Devices.js +++ b/src/components/Devices.js @@ -1,35 +1,13 @@ import React, { useEffect, useState } from 'react'; -import { query, collection, onSnapshot, getDocs } from 'firebase/firestore'; -import * as _ from 'lodash'; +import { query, collection, onSnapshot } from 'firebase/firestore'; import Dropdown from 'react-dropdown'; import 'react-dropdown/style.css'; import moment from 'moment'; -import Select from 'react-select'; import DeviceGraph from "./DeviceGraph"; import db from '../firebase'; import './Devices.css'; -const styles = { - menuList: (base) => ({ - ...base, - - "::-webkit-scrollbar": { - width: "4px", - height: "0px", - }, - "::-webkit-scrollbar-track": { - background: "#f1f1f1" - }, - "::-webkit-scrollbar-thumb": { - background: "#888" - }, - "::-webkit-scrollbar-thumb:hover": { - background: "#555" - } - }) -}; - const Devices = () => { const [device, setDevice] = useState("Select a device"); const [testDate, setTestDate] = useState("Select a test date"); @@ -42,14 +20,9 @@ const Devices = () => { const [showGraph, setShowGraph] = useState(false); const changeDevice = ({ value }) => { - console.log(value); - // console.log(event); - setDevice(value); setDays([...new Set(allTests - .filter((x) => { - if (x.deviceSerialNumber === value) return x; - }) + .filter((x) => x.deviceSerialNumber === value) .map(x => moment(x.testTime).format("YYYY-MM-DD")))] .sort() .reverse()); @@ -61,9 +34,7 @@ const Devices = () => { setCurTestData(null); setShowGraph(false); setTests(allTests - .filter((x) => { - if (x.deviceSerialNumber === device && moment(x.testTime).isBetween(moment(value).startOf('day'), moment(value).endOf('day'))) return x; - }) + .filter((x) => x.deviceSerialNumber === device && moment(x.testTime).isBetween(moment(value).startOf('day'), moment(value).endOf('day'))) .map(x => x._id) .sort()); } @@ -99,17 +70,15 @@ const Devices = () => { hposTests.push(hposTestData); const { deviceSerialNumber } = hposTestData; testDevices.add(deviceSerialNumber); - // console.log(document.data()); }); const groups = [...testDevices]; - // console.log(groups); setDevices(groups); setAllTests(hposTests); }); return () => unsub; } - }, [curTestData, curTest, device, testDate]); + }, [curTestData, curTest, device, testDate, allTests]); return (
@@ -123,7 +92,7 @@ const Devices = () => { { return { value: x, label: x }; })} menuPlacement='auto' maxMenuHeight={220} menuShouldScrollIntoView={true} onChange={changeTestDate} /> */} - +
diff --git a/src/components/TestAnalytics.js b/src/components/TestAnalytics.js index 2ae53df..2525476 100644 --- a/src/components/TestAnalytics.js +++ b/src/components/TestAnalytics.js @@ -45,7 +45,6 @@ const TestAnalytics = () => { const [dailyResults, setDailyResults] = useState(null); const changeDevice = ({ value }) => { - console.log(value); // console.log(event); setDevice(value); diff --git a/src/components/TestAnalyticsGraph.js b/src/components/TestAnalyticsGraph.js index 590f511..996492f 100644 --- a/src/components/TestAnalyticsGraph.js +++ b/src/components/TestAnalyticsGraph.js @@ -1,7 +1,5 @@ import React, { Component } from 'react'; import * as d3 from 'd3'; -import { sgg } from 'ml-savitzky-golay-generalized'; -import axios from 'axios'; import moment from 'moment'; import './DeviceGraph.css'; @@ -35,7 +33,7 @@ class TestAnalyticsGraph extends Component { .attr("height", height + margin.top + margin.bottom) .append("g").attr("transform", "translate(" + margin.left + "," + margin.top + ")"); - var g = svg.append("g").attr("transform", "translate(" + margin.left + "," + margin.top + ")"); + // var g = svg.append("g").attr("transform", "translate(" + margin.left + "," + margin.top + ")"); // const options = { // windowSize: 5,