refactored code base and fixed some code

__tests__/index.js

@@ -0,0 +1,6 @@
+describe('Main', () => {
+    test('main test', () => {
+      expect(true).toBe(true)
+    })
+  })
+

__tests__/util/index.js

@@ -0,0 +1,5 @@
+describe('Util', () => {
+  test('util test', () => {
+    expect(true).toBe(true)
+  })
+})

components/DatePicker.js

@@ -4,7 +4,7 @@ import DayPicker from 'react-day-picker'
 
 import { connect } from 'react-redux'
 import { updateGraph, selectFilter } from './Redux/actions'
-import { rowsToGraph } from '../util/parse'
+import { useLog, useError, rowsToGraph } from '../util'
 import { isBrowser } from 'react-device-detect'
 
 const Container = styled.div`
@@ -27,19 +27,19 @@ const DatePickerButton = styled.button`
 `
 
 function DatePicker({ updateGraph, selectFilter }) {
-  const [selectedDay, changeSelectedDay] = useState(new Date());
-  const [isDayPickerVisible, changeDayPickerVisibility] = useState(false);
+  const [selectedDay, changeSelectedDay] = useState(new Date())
+  const [isDayPickerVisible, changeDayPickerVisibility] = useState(false)
 
-  const toggleDayPickerVisibility = () => changeDayPickerVisibility(!isDayPickerVisible);
+  const toggleDayPickerVisibility = () =>
+    changeDayPickerVisibility(!isDayPickerVisible)
 
   function handleDayClick(date, modifiers) {
-
     // Do not proceed with click action if the date is disabled
-    if(modifiers.disabled){
-      return;
+    if (modifiers.disabled) {
+      return
     }
 
-    toggleDayPickerVisibility();
+    toggleDayPickerVisibility()
 
     function formatDate(date) {
       var d = new Date(date),
@@ -56,51 +56,44 @@ function DatePicker({ updateGraph, selectFilter }) {
     const newDate = formatDate(date)
 
     if (formatDate(selectedDay) !== newDate) {
-      console.log(newDate)
+      useLog(newDate)
       changeSelectedDay(date)
 
-      const apiURL =
-        'https://api.rootnet.in/covid19-in/unofficial/covid19india.org/patientdb/' +
-        newDate
-
-      fetch(apiURL, {
-        cors: 'no-cors',
-        method: 'GET',
-        redirect: 'follow',
-      })
-        .then(resp => resp.json())
-        .then(res => {
-          console.log(res)
-          // Update the graph only if res.success is true
-          if(res.success){
-            updateGraph(rowsToGraph(res.data.rawPatientData))
-            selectFilter('P2P');
-          }
-        })
+      try {
+        const data = getAPIData(
+          `https://api.rootnet.in/covid19-in/unofficial/covid19india.org/patientdb/${newDate}`
+        )
+
+        if (data) {
+          updateGraph(rowsToGraph(data.rawPatientData))
+          selectFilter('P2P')
+        }
+      } catch (error) {
+        useError(error)
+      }
     }
   }
 
-  const renderDayPicker = () => isDayPickerVisible ? (
-    <DayPicker
-      selectedDays={selectedDay}
-      onDayClick={handleDayClick}
-      disabledDays={[
-        {
-          before: new Date(2020, 2, 23),
-          after: new Date(),
-        },
-      ]}
-    />
-  ) : null
+  const renderDayPicker = () =>
+    isDayPickerVisible ? (
+      <DayPicker
+        selectedDays={selectedDay}
+        onDayClick={handleDayClick}
+        disabledDays={[
+          {
+            before: new Date(2020, 2, 23),
+            after: new Date(),
+          },
+        ]}
+      />
+    ) : null
 
   return (
     <Container>
       {isBrowser ? (
         <>
           {renderDayPicker()}
-          <DatePickerButton
-            onClick={toggleDayPickerVisibility}
-          >
+          <DatePickerButton onClick={toggleDayPickerVisibility}>
             <span>{selectedDay.toDateString()}</span>
           </DatePickerButton>
         </>

components/FilterPanel/index.js

@@ -3,18 +3,18 @@ import styled from 'styled-components'
 
 import { connect } from 'react-redux'
 import _ from 'lodash'
-import normalize from '../../util/normalize'
 import { state, city, abroad, p2p } from '../../images/index'
 import {
+  normalize,
   addStates,
   removeStates,
   addCities,
   removeCities,
   addTravel,
   removeTravel,
-} from '../../util/filters'
+  rowsToGraph
+} from '../..//util'
 import { updateGraph, selectFilter, updatePatients } from '../Redux/actions'
-import { rowsToGraph } from '../../util/parse'
 
 const filters = [
   {
@@ -108,7 +108,7 @@ const FilterPanel = ({
   // const [selected, selectCategory] = React.useState('P2P')
 
   const changeGraph = name => {
-    // console.log('Changegraph', graph, patients.byId)
+    // useLog('Changegraph', graph, patients.byId)
     let currentFilter = _.find(filters, function(o) {
       return o.name === filter
     })

components/NetworkMap/index.js

@@ -2,11 +2,25 @@ import React, { useState, useEffect, useRef, useMemo } from 'react'
 import Graph from 'react-graph-vis'
 import { Tooltip, TooltipArrow, TooltipInner } from 'styled-tooltip-component'
 import { connect, useSelector } from 'react-redux'
-import { updateGraph, updatePatients, updateLastRefreshed, selectPatient, updateStates, updateRawPatients } from '../Redux/actions'
-import { rowsToGraph, letterToCode } from '../../util/parse'
-import normalize from '../../util/normalize'
+
+import {
+  updateGraph,
+  updatePatients,
+  updateLastRefreshed,
+  selectPatient,
+  updateStates,
+  updateRawPatients,
+} from '../Redux/actions'
+
 import DatePicker from '../DatePicker'
-import NetworkMapLegend from '../NetworkMapLegend'
+import NetworkMapLegend from './Legend'
+import {
+  useError,
+  getAPIData,
+  rowsToGraph,
+  letterToCode,
+  normalize,
+} from '../../util'
 
 const NetworkMap = ({
   filter,
@@ -19,7 +33,7 @@ const NetworkMap = ({
   height,
   width,
   states,
-  updateRawPatients
+  updateRawPatients,
 }) => {
   const graphRef = useRef()
   const [isLoading, setIsLoading] = useState(true)
@@ -28,44 +42,52 @@ const NetworkMap = ({
   const toolTipVisible = useMemo(() => {
     return toolTipPosition !== null
   }, [toolTipPosition])
-  const { selected, searchTerm } = useSelector(state => ({
+  const { selected, searchTerm } = useSelector((state) => ({
     searchTerm: state.searchTerm,
     selected: state.patient,
   }))
-
+
+  async function fetchStateWiseData() {
+    const data = await getAPIData(
+      'https://api.covid19india.org/state_district_wise.json'
+    )
+    if (data) {
+      updateStates(Object.keys(data))
+    }
+  }
+
+  async function fetchUnofficialData() {
+    const data = await getAPIData(
+      'https://api.rootnet.in/covid19-in/unofficial/covid19india.org'
+    )
+    if (data) {
+      const _rawPatientData = data.rawPatientData
+      updateGraph(rowsToGraph(_rawPatientData))
+      updatePatients(normalize(_rawPatientData))
+      updateLastRefreshed(data.lastRefreshed)
+      // setIsLoading(false)
+    }
+  }
+
   useEffect(() => {
-    if(!states){
-      fetch('https://api.covid19india.org/state_district_wise.json', {
-        cors: 'no-cors',
-        method: 'GET',
-        redirect: 'follow',
-      })
-        .then(resp => resp.json())
-        .then(res => {
-          if(res){
-            let stateNames = Object.keys(res);
-            updateStates(stateNames);
-          }
-        })
+    if (!states) {
+      try {
+        fetchStateWiseData()
+      } catch (error) {
+        useError(error)
+      }
     }
   }, [])
 
   useEffect(() => {
-    fetch('https://api.rootnet.in/covid19-in/unofficial/covid19india.org', {
-      cors: 'no-cors',
-      method: 'GET',
-      redirect: 'follow',
-    })
-      .then(resp => resp.json())
-      .then(res => {
-        updateGraph(rowsToGraph(res.data.rawPatientData, false, true));
-        updatePatients(normalize(res.data.rawPatientData, true));
-        updateLastRefreshed(res.data.lastRefreshed);
-        updateRawPatients(res.data.rawPatientData);
-        setIsLoading(false);
-      })
-      .catch(err => console.log('error', err))
-  }, [])
+    if (!states) {
+      try {
+        fetchUnofficialData()
+      } catch (error) {
+        useError(error)
+      }
+    }
+  }, [isLoading])
 
   useEffect(() => {
     // TODO: Figure out a way to make this do-able with patient Id search
@@ -95,6 +117,7 @@ const NetworkMap = ({
         selectPatient({ id: nodeKey, coords: coordsMap[nodeKey] })
       } catch (e) {
         // None found. TODO: Add a UI response
+        useError(e)
       }
     }
   }, [searchTerm])
@@ -122,9 +145,9 @@ const NetworkMap = ({
   }
 
   const events = {
-    select: function(event) {
+    select: function (event) {
       const selectedNodeId = event.nodes[0]
-      const selectedNode = graph.nodes.find(v => v.id === selectedNodeId)
+      const selectedNode = graph.nodes.find((v) => v.id === selectedNodeId)
       if (selectedNode) {
         switch (selectedNode.group) {
           case 'patient':
@@ -137,16 +160,16 @@ const NetworkMap = ({
         }
       }
     },
-    hoverNode: function(e) {
+    hoverNode: function (e) {
       const { node, event } = e
-      const selectedNode = graph.nodes.find(v => v.id === node)
+      const selectedNode = graph.nodes.find((v) => v.id === node)
       setToolTipContent(selectedNode.label)
       setToolTipPosition({
         top: event.pageY,
         left: event.pageX,
       })
     },
-    blurNode: function(event) {
+    blurNode: function (event) {
       setToolTipContent('')
       setToolTipPosition(null)
     },
@@ -182,9 +205,9 @@ const NetworkMap = ({
   )
 }
 
-const mapStateToProps = state => {
+const mapStateToProps = (state) => {
   let { graph, searchTerm, filter, states, rawPatientData } = state
-  return { graph, searchTerm, filter, states, rawPatientData}
+  return { graph, searchTerm, filter, states, rawPatientData }
 }
 
 export default connect(mapStateToProps, {
@@ -193,5 +216,5 @@ export default connect(mapStateToProps, {
   updateStates,
   updateLastRefreshed,
   selectPatient,
-  updateRawPatients
+  updateRawPatients,
 })(NetworkMap)

components/Redux/actions.js

@@ -6,6 +6,7 @@
 
 // Action Types
 import actionTypes from './actionTypes'
+import { useLog } from '../../util'
 
 const updateGraph = graph => (dispatch, getState) => {
   // Dispatch the result.
@@ -73,7 +74,7 @@ const setSearchTerm = term => (dispatch, getState) => {
 }
 
 const updateStates = states => (dispatch, getState) => {
-  console.log('Action updateStates', states);
+  useLog('Action updateStates', states);
   dispatch({
     type: actionTypes.UPDATE_STATES,
     payload: {