diff --git a/src/components/CovidApp.js b/src/components/CovidApp.js
index e99025e..68fc329 100644
--- a/src/components/CovidApp.js
+++ b/src/components/CovidApp.js
@@ -1,51 +1,51 @@
-import React, { Component } from 'react';
-import axios from 'axios';
-import Lottie from 'react-lottie';
-import { formatDistance } from 'date-fns';
-import { withStyles } from '@material-ui/styles';
-import { FontAwesomeIcon } from '@fortawesome/react-fontawesome';
+import React, { Component } from "react";
+import axios from "axios";
+import Lottie from "react-lottie";
+import { formatDistance } from "date-fns";
+import { withStyles } from "@material-ui/styles";
+import { FontAwesomeIcon } from "@fortawesome/react-fontawesome";
 import {
   faBell,
   faBellSlash,
   faSyncAlt,
-} from '@fortawesome/free-solid-svg-icons';
+} from "@fortawesome/free-solid-svg-icons";
 
-import Barchart from './Barchart';
-import Charts from './Charts';
-import DisplayTable from './DisplayTable';
-import Footer from './Footer';
-import MapSection from './MapSection';
-import Overview from './Overview';
+import Barchart from "./Barchart";
+import Charts from "./Charts";
+import DisplayTable from "./DisplayTable";
+import Footer from "./Footer";
+import MapSection from "./MapSection";
+import Overview from "./Overview";
 
-import colors from '../constants/colors';
-import stateCodes from '../constants/stateCodes';
-import * as animationData from '../assets/loading.json';
+import colors from "../constants/colors";
+import stateCodes from "../constants/stateCodes";
+import * as animationData from "../assets/loading.json";
 
-import styles from '../styles/CovidAppStyles';
-import '../styles/DarkModeButton.css';
+import styles from "../styles/CovidAppStyles";
+import "../styles/DarkModeButton.css";
 
 const defaultOptions = {
   loop: true,
   autoplay: true,
   animationData: animationData.default,
   rendererSettings: {
-    preserveAspectRatio: 'xMidYMid slice',
+    preserveAspectRatio: "xMidYMid slice",
   },
 };
 
 const months = {
-  1: 'Jan',
-  2: 'Feb',
-  3: 'Mar',
-  4: 'Apr',
-  5: 'May',
-  6: 'Jun',
-  7: 'Jul',
-  8: 'Aug',
-  9: 'Sep',
-  10: 'Oct',
-  11: 'Nov',
-  12: 'Dec',
+  "1": "Jan",
+  "2": "Feb",
+  "3": "Mar",
+  "4": "Apr",
+  "5": "May",
+  "6": "Jun",
+  "7": "Jul",
+  "8": "Aug",
+  "9": "Sep",
+  "10": "Oct",
+  "11": "Nov",
+  "12": "Dec",
 };
 
 class CovidApp extends Component {
@@ -73,15 +73,15 @@ class CovidApp extends Component {
 
   async fetchData() {
     this.setState({ isLoading: !this.state.isLoading });
-    const countryData = axios.get('https://api.covid19india.org/data.json');
+    const countryData = axios.get("https://api.covid19india.org/data.json");
     const districtLevel = axios.get(
-      'https://api.covid19india.org/v2/state_district_wise.json'
+      "https://api.covid19india.org/v2/state_district_wise.json"
     );
     const stateChanges = axios.get(
-      'https://api.covid19india.org/states_daily.json'
+      "https://api.covid19india.org/states_daily.json"
     );
     const updates = axios.get(
-      'https://api.covid19india.org/updatelog/log.json'
+      "https://api.covid19india.org/updatelog/log.json"
     );
 
     axios.all([countryData, districtLevel, stateChanges, updates]).then(
@@ -114,7 +114,7 @@ class CovidApp extends Component {
     const formatedData = data.map((state, i) => {
       return {
         id: this.findId(state.state),
-        state: state.state.replace(' and ', ' & '),
+        state: state.state.replace(" and ", " & "),
         value: state.confirmed,
       };
     });
@@ -141,15 +141,12 @@ class CovidApp extends Component {
     this.setState({ expanded: !this.state.expanded });
   }
 
-  formatDate(timestamp) {
+  formatDate(date) {
     try {
-      const [date, time] = timestamp.split(' ');
-      const formattedDate = date.split('/');
-      console.log(time);
-      return `${formattedDate[0]} ${months[formattedDate[1]]}, ${time.slice(
-        0,
-        5
-      )} IST`;
+      const day = date.slice(0, 2);
+      const month = date.slice(3, 4);
+      const time = date.slice(10);
+      return `${day}th ${months[month]}, ${time.slice(0, 5)} IST`;
     } catch (err) {}
   }
 
@@ -177,7 +174,7 @@ class CovidApp extends Component {
         .slice(-5)
         .reverse()
         .map(({ update, timestamp }, i) => {
-          update = update.replace('\n', '<br/>');
+          update = update.replace("\n", "<br/>");
           return (
             <div className={classes.updateBox} key={i}>
               <h5 className={classes.updateHeading}>
@@ -211,7 +208,7 @@ class CovidApp extends Component {
             />
           </div>
           <div className={classes.lastUpdatedTime}>
-            Last Updated:{' '}
+            Last Updated:{" "}
             {this.formatDate(this.state.todayData.lastupdatedtime)}
           </div>
           <div className={classes.updates}>
@@ -271,7 +268,7 @@ class CovidApp extends Component {
               <div className={classes.tinyChart}>
                 <div
                   className={classes.tinych}
-                  style={{ background: 'rgba(249, 52, 94,.1)' }}
+                  style={{ background: "rgba(249, 52, 94,.1)" }}
                 >
                   <h3 style={{ color: colors.red }}>confirmed</h3>
                   <Barchart
@@ -285,7 +282,7 @@ class CovidApp extends Component {
               <div className={classes.tinyChart}>
                 <div
                   className={classes.tinych}
-                  style={{ background: 'rgba(250, 100, 0,.1)' }}
+                  style={{ background: "rgba(250, 100, 0,.1)" }}
                 >
                   <h3 style={{ color: colors.orange }}>active</h3>
                   <Barchart
@@ -299,7 +296,7 @@ class CovidApp extends Component {
               <div className={classes.tinyChart}>
                 <div
                   className={classes.tinych}
-                  style={{ background: 'rgba(28, 177, 66,.1)' }}
+                  style={{ background: "rgba(28, 177, 66,.1)" }}
                 >
                   <h3 style={{ color: colors.green }}>Recovered</h3>
                   <Barchart
@@ -313,7 +310,7 @@ class CovidApp extends Component {
               <div className={classes.tinyChart}>
                 <div
                   className={classes.tinych}
-                  style={{ background: 'rgba(98, 54, 255,.1)' }}
+                  style={{ background: "rgba(98, 54, 255,.1)" }}
                 >
                   <h3 style={{ color: colors.purple }}>Deceased</h3>
                   <Barchart
@@ -328,7 +325,7 @@ class CovidApp extends Component {
           </div>
           <div className={classes.tableContainer}>
             <h2 className={classes.tableHeading}>
-              State/UT Wise Data (Sortable){' '}
+              State/UT Wise Data (Sortable){" "}
             </h2>
             <DisplayTable
               tableData={data}