From 4a192784e7bc5f5f2b7a5c64147f6e30be86d22d Mon Sep 17 00:00:00 2001 From: saanuregh Date: Sun, 10 May 2020 02:16:32 +0530 Subject: [PATCH] added constants files --- src/App.js | 17 ++++++++++++++--- src/components/chart.js | 2 +- src/components/counter.js | 13 +++---------- src/components/lang.js | 13 ------------- src/components/map.js | 10 ++-------- src/components/table.js | 10 ++-------- src/constants.js | 27 +++++++++++++++++++++++++++ 7 files changed, 49 insertions(+), 43 deletions(-) delete mode 100644 src/components/lang.js create mode 100644 src/constants.js diff --git a/src/App.js b/src/App.js index ad37cfa..0cf258a 100644 --- a/src/App.js +++ b/src/App.js @@ -4,7 +4,7 @@ import Table from "./components/table"; import Counter from "./components/counter"; import Charts from "./components/charts"; import axios from "axios"; -import lang from "./components/lang"; +import { lang } from "./constants"; import { hot } from "react-hot-loader"; function App() { @@ -52,8 +52,19 @@ function App() { "https://keralastats.coronasafe.live/zones.json" ); let zones = response.data.districts; - let hotspots = {}; - Object.keys(dist.summary); + response = await axios.get( + "https://keralastats.coronasafe.live/hotspots.json" + ); + let k1 = "district"; + let k2 = "lsgd"; + let hpts = response.data.hotspots.reduce( + (a, b) => ({ + ...a, + [b[k1]]: a[b[k1]] ? a[b[k1]].concat(b[k2]) : [b[k2]], + }), + {} + ); + setHotspots(hpts); setChartData(tmp); setMaxActive(mx); setHistory(hist); diff --git a/src/components/chart.js b/src/components/chart.js index 67b34e3..2fe827a 100644 --- a/src/components/chart.js +++ b/src/components/chart.js @@ -8,7 +8,7 @@ import { Legend, ResponsiveContainer, } from "recharts"; -import lang from "./lang"; +import { lang } from "../constants"; function Chart({ data, dataKey, stroke }) { const CustomizedXAxisTick = ({ x, y, payload }) => { diff --git a/src/components/counter.js b/src/components/counter.js index 90d2495..9323fa9 100644 --- a/src/components/counter.js +++ b/src/components/counter.js @@ -1,21 +1,14 @@ import React from "react"; -import lang from "./lang"; +import { lang, statColor } from "../constants"; function Counter({ data }) { - const topBox = { - confirmed: "bg-red-500", - active: "bg-yellow-500", - recovered: "bg-green-500", - deceased: "bg-gray-500", - }; - return (
- {Object.keys(topBox).map((header) => { + {Object.keys(statColor).map((header) => { return (

diff --git a/src/components/lang.js b/src/components/lang.js deleted file mode 100644 index 398ddb8..0000000 --- a/src/components/lang.js +++ /dev/null @@ -1,13 +0,0 @@ -const lang = { - district: "District", - confirmed: "Confirmed", - active: "Active", - recovered: "Recovered", - deceased: "Deaths", - total_obs: "Under Observation", - hospital_obs: "Hospital Isolation", - home_obs: "Home Isolation", - hospital_today: "Hospitalized Today", -}; - -export default lang; diff --git a/src/components/map.js b/src/components/map.js index 54693cb..521de78 100644 --- a/src/components/map.js +++ b/src/components/map.js @@ -2,7 +2,7 @@ import React, { useState, useEffect, useCallback, useRef } from "react"; import * as d3 from "d3"; import { legendColor } from "d3-svg-legend"; import * as topojson from "topojson"; -import lang from "./lang"; +import { lang, zoneColor } from "../constants"; import { useWindowWidth } from "@react-hook/window-size/throttled"; function Map({ districts, summary, maxActive, zones }) { @@ -13,12 +13,6 @@ function Map({ districts, summary, maxActive, zones }) { const [legendPos, setLegendPos] = useState(0); const width = useWindowWidth(450, { fps: 30, leading: true, wait: 0 }); const map = useRef(null); - const color = { - containment: "text-blue-600", - red: "text-red-600", - orange: "text-orange-600", - green: "text-green-600", - }; useEffect(() => { if (renderData) { @@ -214,7 +208,7 @@ function Map({ districts, summary, maxActive, zones }) {

Zone

{zones[district.name]} diff --git a/src/components/table.js b/src/components/table.js index 8d77159..fb8c672 100644 --- a/src/components/table.js +++ b/src/components/table.js @@ -1,5 +1,5 @@ import React, { useState, useEffect } from "react"; -import lang from "./lang"; +import { lang, zoneColor } from "../constants"; function Table({ districts, summary, zones }) { const [data, setData] = useState([]); @@ -7,12 +7,6 @@ function Table({ districts, summary, zones }) { sortColumn: "confirmed", isAscending: false, }); - const color = { - containment: "text-blue-600", - red: "text-red-600", - orange: "text-orange-600", - green: "text-green-600", - }; useEffect(() => { if (Object.keys(districts.summary).length > 0) { @@ -103,7 +97,7 @@ function Table({ districts, summary, zones }) { className={ header !== "district" ? "text-center" - : color[zones[district[header]]] + : zoneColor[zones[district[header]]] } key={index} > diff --git a/src/constants.js b/src/constants.js new file mode 100644 index 0000000..c5a48a4 --- /dev/null +++ b/src/constants.js @@ -0,0 +1,27 @@ +const lang = { + district: "District", + confirmed: "Confirmed", + active: "Active", + recovered: "Recovered", + deceased: "Deaths", + total_obs: "Under Observation", + hospital_obs: "Hospital Isolation", + home_obs: "Home Isolation", + hospital_today: "Hospitalized Today", +}; + +const zoneColor = { + containment: "text-blue-600", + red: "text-red-600", + orange: "text-orange-600", + green: "text-green-600", +}; + +const statColor = { + confirmed: "bg-red-500", + active: "bg-yellow-500", + recovered: "bg-green-500", + deceased: "bg-gray-500", +}; + +export { lang, zoneColor, statColor };