From 5699c485f7aec83c88afa23b1732400b4a9395d4 Mon Sep 17 00:00:00 2001
From: Galen Guyer <galen@galenguyer.com>
Date: Sat, 14 Nov 2020 20:21:52 -0500
Subject: add toggle for one day or week ago

---
 src/App.js | 12 +++++++++++-
 1 file changed, 11 insertions(+), 1 deletion(-)

(limited to 'src/App.js')

diff --git a/src/App.js b/src/App.js
index 3c0b486..68d7f08 100644
--- a/src/App.js
+++ b/src/App.js
@@ -1,3 +1,4 @@
+import React from "react";
 import useSWR from "swr";
 import { DateTime } from "luxon";
 import { BrowserRouter, Route, Switch, Link } from "react-router-dom";
@@ -10,6 +11,8 @@ const url = "https://ritcoviddashboard.com/api/v0/history";
 function App() {
     const { data: data, error: error } = useSWR(url);
 
+    const [timeDifference, setTimeDifference] = React.useState(1);
+
     if (error)
         return (
             <div className="App">
@@ -26,7 +29,7 @@ function App() {
         );
 
     const latest = data[data.length - 1];
-    const prior = data[data.length - 2];
+    const prior = data[data.length - (1 + timeDifference)];
     const local = DateTime.local().zoneName;
     const lastUpdate = DateTime.fromSQL(latest.last_updated, { zone: "UTC" }).setZone(local);
     const priorUpdate = DateTime.fromSQL(prior.last_updated, { zone: "UTC" }).setZone(local);
@@ -57,6 +60,13 @@ function App() {
                         minute: "2-digit",
                     })}
                 </h4>
+
+                <button
+                    onClick={() => setTimeDifference(timeDifference == 1 ? 5 : 1)}
+                    class="bg-transparent text-sm hover:bg-orange-400 text-gray-600 hover:text-white py-1 my-1 px-2 border border-orange-300 hover:border-transparent rounded transition ease-in-out duration-300"
+                >
+                    Use one {timeDifference == 1 ? "week" : "day"} ago
+                </button>
                 <br />
                 <Switch>
                     <Route exact path="/">
-- 
cgit v1.2.3