diff --git a/src/incidents/visualize/VisualizeIncidents.tsx b/src/incidents/visualize/VisualizeIncidents.tsx index 6ab624aaae..e9b4f16de9 100644 --- a/src/incidents/visualize/VisualizeIncidents.tsx +++ b/src/incidents/visualize/VisualizeIncidents.tsx @@ -1,5 +1,5 @@ -import { Spinner, LineGraph } from '@hospitalrun/components' -import React from 'react' +import { LineGraph } from '@hospitalrun/components' +import React, { useEffect, useState } from 'react' import useIncidents from '../hooks/useIncidents' import IncidentFilter from '../IncidentFilter' @@ -9,15 +9,62 @@ const VisualizeIncidents = () => { const searchFilter = IncidentFilter.reported const searchRequest: IncidentSearchRequest = { status: searchFilter } const { data, isLoading } = useIncidents(searchRequest) + const [monthlyIncidents, setMonthlyIncidents] = useState({ + January: 0, + February: 0, + March: 0, + April: 0, + May: 0, + June: 0, + July: 0, + August: 0, + September: 0, + November: 0, + December: 0, + }) - if (data === undefined || isLoading) { - return + const getIncidentMonth = (reportedOn: string) => { + // reportedOn: "2020-08-12T19:53:30.153Z" + // splices the data.reportedOn string at position 5-6 to get the month + const months = [ + 'January', + 'February', + 'March', + 'April', + 'May', + 'June', + 'July', + 'August', + 'September', + 'November', + 'December', + ] + return months[Number(reportedOn.slice(5, 7)) - 1] } - // reportedOn: "2020-08-12T19:53:30.153Z" - // we can use a function that splices the string at position 6-7 to get the month + useEffect(() => { + if (data === undefined || isLoading) { + console.log('data is undefined') + } else { + let incidentMonth: string + const totalIncidents: number = data.length + for (let incident = 0; incident < totalIncidents; incident += 1) { + incidentMonth = getIncidentMonth(data[incident].reportedOn) + setMonthlyIncidents((state) => ({ + ...state, + // incidentMonth: incidentMonth + 1, + })) + console.log('incidentMonth: ', incidentMonth) + } + } + }, []) + + // if (data === undefined || isLoading) { + // return + // } + + console.log('August: ', monthlyIncidents.August) - console.log('data: ', data) return ( <>