smiuser/hpos-web
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

refactor code and check coverage

Browse Source
This commit is contained in:
prisar
2023-07-26 15:35:17 +05:30
parent f2b07f63f7
commit 1a90ffdc44
7 changed files with 32 additions and 95 deletions
Download Patch File Download Diff File Expand all files Collapse all files

53
src/App.js
View File

@@ -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 (
<div>
<div class='dashboard-title'>
<img className="nscm-logo" src={require('./logo_nobg.png')} />
<img className="nscm-logo" src={require('./logo_nobg.png')} alt='img' />
<div className='title-text'>HPOS Sickel Cell Test Dashboard</div>
<img className="gov-logo-1" src={require('./gov_logo2.png')} />
<img className="gov-logo" src={require('./gov_logo3.png')} />
<img className="gov-logo-3" src={require('./gov_logo4.png')} />
<img className="gov-logo-1" src={require('./gov_logo2.png')} alt='img' />
<img className="gov-logo" src={require('./gov_logo3.png')} alt='img' />
<img className="gov-logo-3" src={require('./gov_logo4.png')} alt='img' />
</div>
<div className='cards-container'>
@@ -113,17 +102,17 @@ function App() {
</div>
<div className='footer'>
<div className='last-update'>
Updated at: {moment(lastUpdate).format("DD-MM-YYYY hh:mm:ss a")}
</div>
<div className='developer' onClick={() => setDevMode(!devMode)}>
Developed by <img className="dev-logo" src={require('./smi-logo-120x120.webp')} /> ShanMukha
</div>
{/* {devMode &&
<div>dev mode is on</div>} */}
<div className='last-update'>
Updated at: {moment(lastUpdate).format("DD-MM-YYYY hh:mm:ss a")}
</div>
<div className='developer' onClick={() => setDevMode(!devMode)}>
Developed by <img className="dev-logo" alt='img' src={require('./smi-logo-120x120.webp')} /> ShanMukha
</div>
{/* {devMode &&
<div>dev mode is on</div>} */}
</div>
</div>
);
}

2
src/App.test.js
View File

@@ -3,6 +3,6 @@ import App from './App';
test('renders learn react link', () => {
render(<App />);
const linkElement = screen.getByText(/learn react/i);
const linkElement = screen.getByText(/dashboard/i);
expect(linkElement).toBeInTheDocument();
});

23
src/components/DeviceGraph.js
View File

@@ -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 (
<div>

41
src/components/Devices.js
View File

@@ -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 (
<div className="devices-page">
@@ -123,7 +92,7 @@ const Devices = () => {
<Select className='day-dropdown' options={days.map(x => { return { value: x, label: x }; })} menuPlacement='auto' maxMenuHeight={250} menuShouldScrollIntoView={true} onChange={changeTestDate} />
<Select className='test-dropdown' options={tests.map(x => { return { value: x, label: x }; })} menuPlacement='auto' maxMenuHeight={220} menuShouldScrollIntoView={true} onChange={changeTestDate} /> */}
<button className='clear-button' onClick={toggleShowGraph}><img className="graph-icon" src={require('./graph_icon.png')}></img>{curTestData ? 'Clear' : 'Show'}</button>
<button className='clear-button' onClick={toggleShowGraph}><img className="graph-icon" src={require('./graph_icon.png')} alt='icon'></img>{curTestData ? 'Clear' : 'Show'}</button>
</div>
<div className='graph-person-conatiner'>

1
src/components/TestAnalytics.js
View File

@@ -45,7 +45,6 @@ const TestAnalytics = () => {
const [dailyResults, setDailyResults] = useState(null);
const changeDevice = ({ value }) => {
console.log(value);
// console.log(event);
setDevice(value);

4
src/components/TestAnalyticsGraph.js
View File

@@ -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,