├── images ├── man.png ├── woman.png ├── female │ ├── dead.png │ ├── cured.png │ └── hospitalized.png ├── male │ ├── cured.png │ ├── dead.png │ └── hospitalized.png └── index.js ├── next.config.js ├── .prettierrc ├── public ├── favicon.ico └── zeit.svg ├── pages ├── api │ ├── test.js │ ├── client_secret.json │ ├── db.js │ └── raw.js ├── index.js └── _document.js ├── .babelrc ├── components ├── Redux │ ├── actionTypes.js │ ├── store.js │ ├── actions.js │ └── reducers.js ├── Dashboard │ └── index.js ├── SidePanel │ ├── index.js │ ├── header.js │ └── datagrid.js └── NetworkMap │ ├── dummyData.js │ └── index.js ├── .gitignore ├── util ├── normalize.js └── parse.js ├── package.json ├── LICENSE └── README.md /images/man.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/covid19india/covid19india-network/HEAD/images/man.png -------------------------------------------------------------------------------- /next.config.js: -------------------------------------------------------------------------------- 1 | const withImages = require('next-images') 2 | module.exports = withImages() 3 | -------------------------------------------------------------------------------- /.prettierrc: -------------------------------------------------------------------------------- 1 | { 2 | "semi": false, 3 | "singleQuote": true, 4 | "trailingComma": "es5" 5 | } 6 | -------------------------------------------------------------------------------- /images/woman.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/covid19india/covid19india-network/HEAD/images/woman.png -------------------------------------------------------------------------------- /public/favicon.ico: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/covid19india/covid19india-network/HEAD/public/favicon.ico -------------------------------------------------------------------------------- /images/female/dead.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/covid19india/covid19india-network/HEAD/images/female/dead.png -------------------------------------------------------------------------------- /images/male/cured.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/covid19india/covid19india-network/HEAD/images/male/cured.png -------------------------------------------------------------------------------- /images/male/dead.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/covid19india/covid19india-network/HEAD/images/male/dead.png -------------------------------------------------------------------------------- /images/female/cured.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/covid19india/covid19india-network/HEAD/images/female/cured.png -------------------------------------------------------------------------------- /images/male/hospitalized.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/covid19india/covid19india-network/HEAD/images/male/hospitalized.png -------------------------------------------------------------------------------- /images/female/hospitalized.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/covid19india/covid19india-network/HEAD/images/female/hospitalized.png -------------------------------------------------------------------------------- /pages/api/test.js: -------------------------------------------------------------------------------- 1 | module.exports = (req, res) => { 2 | res.json({ 3 | body: req.body, 4 | query: req.query, 5 | cookies: req.cookies, 6 | }) 7 | } 8 | -------------------------------------------------------------------------------- /.babelrc: -------------------------------------------------------------------------------- 1 | { 2 | "presets": ["next/babel"], 3 | "plugins": [ 4 | [ 5 | "styled-components", 6 | { 7 | "ssr": true, 8 | "displayName": true, 9 | "preprocess": false 10 | } 11 | ] 12 | ] 13 | } 14 | -------------------------------------------------------------------------------- /pages/api/client_secret.json: -------------------------------------------------------------------------------- 1 | { 2 | "type": "", 3 | "project_id": "", 4 | "private_key_id": "", 5 | "private_key": "", 6 | "client_email": "", 7 | "client_id": "", 8 | "auth_uri": "", 9 | "token_uri": "", 10 | "auth_provider_x509_cert_url": "", 11 | "client_x509_cert_url": "" 12 | } 13 | -------------------------------------------------------------------------------- /components/Redux/actionTypes.js: -------------------------------------------------------------------------------- 1 | /** 2 | * Redux Action Types 3 | * 4 | * Available action types for Redux dispatch operations 5 | * for the application. 6 | */ 7 | 8 | export default { 9 | //Graph 10 | UPDATE_GRAPH: 'UPDATE_GRAPH', 11 | //Patients 12 | UPDATE_PATIENTS: 'PATIENT_GRAPH', 13 | SELECT_PATIENT: 'SELECT_PATIENT', 14 | } 15 | -------------------------------------------------------------------------------- /.gitignore: -------------------------------------------------------------------------------- 1 | # See https://help.github.com/articles/ignoring-files/ for more about ignoring files. 2 | 3 | # dependencies 4 | /node_modules 5 | /.pnp 6 | .pnp.js 7 | 8 | # testing 9 | /coverage 10 | 11 | # next.js 12 | /.next/ 13 | /out/ 14 | 15 | # production 16 | /build 17 | 18 | # misc 19 | .DS_Store 20 | .env* 21 | 22 | # debug 23 | npm-debug.log* 24 | yarn-debug.log* 25 | yarn-error.log* 26 | 27 | .now -------------------------------------------------------------------------------- /images/index.js: -------------------------------------------------------------------------------- 1 | import male_cured from './male/cured.png' 2 | import male_dead from './male/dead.png' 3 | import male_hosp from './male/hospitalized.png' 4 | import female_cured from './female/cured.png' 5 | import female_dead from './female/dead.png' 6 | import female_hosp from './female/hospitalized.png' 7 | 8 | export { 9 | male_cured, 10 | male_dead, 11 | male_hosp, 12 | female_cured, 13 | female_dead, 14 | female_hosp, 15 | } 16 | -------------------------------------------------------------------------------- /pages/api/db.js: -------------------------------------------------------------------------------- 1 | const { GoogleSpreadsheet } = require('google-spreadsheet') 2 | 3 | // const creds = { 4 | // client_email: process.env.google_service_account_email, 5 | // private_key: process.env.google_private_key, 6 | // } 7 | 8 | const creds = require('./client_secret.json') 9 | 10 | const sheetId = '1nzXUdaIWC84QipdVGUKTiCSc5xntBbpMpzLm6Si33zk' 11 | 12 | const doc = new GoogleSpreadsheet(sheetId) 13 | 14 | module.exports = { doc, creds } 15 | -------------------------------------------------------------------------------- /util/normalize.js: -------------------------------------------------------------------------------- 1 | import { letterToCode } from './parse' 2 | const normalize = array => { 3 | const newArray = { 4 | byId: {}, 5 | allIds: [], 6 | } 7 | 8 | array.forEach(item => { 9 | let patientCode = letterToCode('P' + item.patientId.toString()) 10 | item.patientId = patientCode 11 | newArray.byId[patientCode] = item 12 | newArray.allIds.push(patientCode) 13 | }) 14 | return newArray 15 | } 16 | 17 | export default normalize 18 | -------------------------------------------------------------------------------- /components/Dashboard/index.js: -------------------------------------------------------------------------------- 1 | import React from 'react' 2 | import styled from 'styled-components' 3 | import NetworkMap from '../NetworkMap' 4 | import SidePanel from '../SidePanel' 5 | import { Provider } from 'react-redux' 6 | import { store } from '../Redux/store' 7 | 8 | const Container = styled.div` 9 | height: 100vh; 10 | width: 100vw; 11 | display: grid; 12 | grid-template-columns: 30% 70%; 13 | ` 14 | 15 | const Dashboard = () => { 16 | return ( 17 | 18 | 19 | 20 | 21 | 22 | 23 | ) 24 | } 25 | 26 | export default Dashboard 27 | -------------------------------------------------------------------------------- /package.json: -------------------------------------------------------------------------------- 1 | { 2 | "name": "covid19india-network", 3 | "version": "0.1.0", 4 | "private": true, 5 | "scripts": { 6 | "dev": "next dev", 7 | "build": "next build", 8 | "start": "next start" 9 | }, 10 | "dependencies": { 11 | "google-spreadsheet": "^3.0.10", 12 | "lodash": "^4.17.15", 13 | "next": "9.3.1", 14 | "next-images": "^1.3.1", 15 | "react": "16.13.0", 16 | "react-dom": "16.13.0", 17 | "react-github-fork-ribbon": "^0.6.0", 18 | "react-graph-vis": "^1.0.5", 19 | "react-no-ssr": "^1.1.0", 20 | "react-redux": "^7.2.0", 21 | "redux": "^4.0.5", 22 | "redux-logger": "^3.0.6", 23 | "redux-thunk": "^2.3.0", 24 | "styled-components": "^5.0.1" 25 | } 26 | } 27 | -------------------------------------------------------------------------------- /components/Redux/store.js: -------------------------------------------------------------------------------- 1 | /** 2 | * Redux Store 3 | * 4 | * Creates a Redux store for the application and passes the root reducer 5 | * to the store. Also applies the thunk middleware so that actions can 6 | * be dispatched asynchronously. 7 | */ 8 | 9 | // Dependencies 10 | import { createStore, applyMiddleware } from 'redux' 11 | import logger from 'redux-logger' 12 | import thunk from 'redux-thunk' 13 | //import storage from "redux-persist/lib/storage/session"; 14 | // Reducers 15 | import rootReducer from './reducers' 16 | 17 | // Create the Redux store. 18 | 19 | const store = 20 | process.env.NODE_ENV === 'production' 21 | ? createStore(rootReducer, applyMiddleware(thunk)) 22 | : createStore(rootReducer, applyMiddleware(thunk, logger)) 23 | 24 | // Export the Redux store. 25 | export { store } 26 | -------------------------------------------------------------------------------- /public/zeit.svg: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | 7 | 8 | 9 | 10 | 11 | -------------------------------------------------------------------------------- /components/Redux/actions.js: -------------------------------------------------------------------------------- 1 | /** 2 | * Action Types 3 | * 4 | * all action 5 | */ 6 | 7 | // Action Types 8 | import actionTypes from './actionTypes' 9 | 10 | const updateGraph = graph => (dispatch, getState) => { 11 | // Dispatch the result. 12 | dispatch({ 13 | type: actionTypes.UPDATE_GRAPH, 14 | payload: { 15 | graph: graph, 16 | }, 17 | }) 18 | } 19 | 20 | const updatePatients = patients => (dispatch, getState) => { 21 | // Dispatch the result. 22 | dispatch({ 23 | type: actionTypes.UPDATE_PATIENTS, 24 | payload: { 25 | patients: patients, 26 | }, 27 | }) 28 | } 29 | const selectPatient = patient => (dispatch, getState) => { 30 | // Dispatch the result. 31 | dispatch({ 32 | type: actionTypes.SELECT_PATIENT, 33 | payload: { 34 | patient: patient, 35 | }, 36 | }) 37 | } 38 | 39 | // Export the actions. 40 | export { updateGraph, updatePatients, selectPatient } 41 | -------------------------------------------------------------------------------- /components/Redux/reducers.js: -------------------------------------------------------------------------------- 1 | /** 2 | * Graph Reducer 3 | * 4 | * Creates a Redux reducer for populating the graph. 5 | */ 6 | 7 | // Action Types 8 | import actionTypes from './actionTypes' 9 | 10 | // Setup initial state with an fleet info object. 11 | const initialState = { 12 | selected: null, 13 | graph: null, 14 | patients: null, 15 | } 16 | 17 | // Export the Device Reducer. 18 | export default (state = initialState, action) => { 19 | switch (action.type) { 20 | case actionTypes.UPDATE_GRAPH: { 21 | const { graph } = action.payload 22 | return { ...state, graph: graph } 23 | } 24 | case actionTypes.UPDATE_PATIENTS: { 25 | const { patients } = action.payload 26 | return { ...state, patients: patients } 27 | } 28 | case actionTypes.SELECT_PATIENT: { 29 | const { patient } = action.payload 30 | return { ...state, selected: patient } 31 | } 32 | default: 33 | return state 34 | } 35 | } 36 | -------------------------------------------------------------------------------- /LICENSE: -------------------------------------------------------------------------------- 1 | MIT License 2 | 3 | Copyright (c) 2020 Somesh Kar 4 | 5 | Permission is hereby granted, free of charge, to any person obtaining a copy 6 | of this software and associated documentation files (the "Software"), to deal 7 | in the Software without restriction, including without limitation the rights 8 | to use, copy, modify, merge, publish, distribute, sublicense, and/or sell 9 | copies of the Software, and to permit persons to whom the Software is 10 | furnished to do so, subject to the following conditions: 11 | 12 | The above copyright notice and this permission notice shall be included in all 13 | copies or substantial portions of the Software. 14 | 15 | THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR 16 | IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY, 17 | FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE 18 | AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER 19 | LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM, 20 | OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE 21 | SOFTWARE. 22 | -------------------------------------------------------------------------------- /components/SidePanel/index.js: -------------------------------------------------------------------------------- 1 | import React from 'react' 2 | import styled from 'styled-components' 3 | 4 | import Header from './header' 5 | import DataGrid from './datagrid' 6 | 7 | import { connect } from 'react-redux' 8 | 9 | const Container = styled.div` 10 | background-color: #fafafa; 11 | padding: 25px; 12 | overflow: auto; 13 | ` 14 | 15 | const SidePanel = ({ patient }) => { 16 | return ( 17 | 18 | {patient ?
: null} 19 | {patient ? : null} 20 | 21 | ) 22 | } 23 | // const SidePanel = ({ patient }) => { 24 | // console.log('Sidepanel', patient) 25 | // return ( 26 | //
27 | // {patient ? patient.patientId : 'hello'} 28 | //
29 | // ) 30 | // } 31 | 32 | const mapStateToProps = state => { 33 | let { patients } = state 34 | let { selected } = state 35 | let selectedPatient = selected ? selected : 251 36 | let patient = patients ? patients.byId[selectedPatient] : null 37 | 38 | return { patient } 39 | } 40 | 41 | export default connect(mapStateToProps, null)(SidePanel) 42 | -------------------------------------------------------------------------------- /components/SidePanel/header.js: -------------------------------------------------------------------------------- 1 | import React from 'react' 2 | import styled from 'styled-components' 3 | 4 | import { getIcon } from '../../util/parse' 5 | 6 | const Container = styled.div` 7 | font-family: 'Lato', sans-serif; 8 | user-select: none; 9 | ` 10 | 11 | const Title = styled.div` 12 | text-transform: uppercase; 13 | font-weight: bold; 14 | font-size: 14px; 15 | color: #858383; 16 | ` 17 | 18 | const Dot = styled.div` 19 | color: #eb5757; 20 | font-size: 28px; 21 | transform: translateY(3px); 22 | display: inline-block; 23 | font-weight: bold; 24 | ` 25 | 26 | const PatientContainer = styled.div` 27 | display: grid; 28 | grid-template-columns: 20% 80%; 29 | height: 10vh; 30 | padding: 15px; 31 | padding-left: 0; 32 | user-select: text; 33 | ` 34 | 35 | const Image = styled.img` 36 | height: 90%; 37 | ` 38 | 39 | const Name = styled.div` 40 | display: flex; 41 | align-items: center; 42 | font-size: 40px; 43 | ` 44 | 45 | export default function Header(patient) { 46 | const { patientId } = patient 47 | 48 | return ( 49 | 50 | 51 | covid19india.org Tracker Live <Dot> · </Dot> 2H ago 52 | 53 | 54 | 55 | P {patientId.toString().substring(2)} 56 | 57 | 58 | ) 59 | } 60 | -------------------------------------------------------------------------------- /pages/index.js: -------------------------------------------------------------------------------- 1 | import Head from 'next/head' 2 | import NoSSR from 'react-no-ssr' 3 | 4 | import Dashboard from '../components/Dashboard' 5 | import NetworkMap from '../components/NetworkMap' 6 | import SidePanel from '../components/SidePanel' 7 | 8 | const Home = () => ( 9 |
10 | 11 | COVID 19 India Network 12 | 13 | 14 | 15 |
16 | {/*
COVID 19 India Network Map
*/} 17 | {/*
*/} 18 | {/*
*/} 19 | {/* */} 20 | 21 | 22 | 23 |
24 | 25 | 54 |
55 | ) 56 | 57 | export default Home 58 | -------------------------------------------------------------------------------- /pages/_document.js: -------------------------------------------------------------------------------- 1 | import Document, { Head, Main, NextScript } from 'next/document' 2 | // Import styled components ServerStyleSheet 3 | import GitHubForkRibbon from 'react-github-fork-ribbon' 4 | import { ServerStyleSheet } from 'styled-components' 5 | 6 | export default class MyDocument extends Document { 7 | static getInitialProps({ renderPage }) { 8 | // Step 1: Create an instance of ServerStyleSheet 9 | const sheet = new ServerStyleSheet() 10 | 11 | // Step 2: Retrieve styles from components in the page 12 | const page = renderPage(App => props => 13 | sheet.collectStyles() 14 | ) 15 | 16 | // Step 3: Extract the styles as