1 files changed, 40 insertions, 0 deletions
diff --git a/src/HistoryTable.js b/src/HistoryTable.js
new file mode 100644
index 0000000..fb27f0e
--- /dev/null
+++ b/src/HistoryTable.js
@@ -0,0 +1,40 @@
+import { React } from "react";
+import { DateTime } from "luxon";
+import GoatCounter from "./GoatCounter";
+
+const HistoryTable = (props) => {
+    const data = props.data;
+    console.log(data);
+    let table = (
+        <table className="table-auto" style={{ marginLeft: "auto", marginRight: "auto" }}>
+            <tbody>
+                <tr>
+                    <td className="border py-2 px-4">Date</td>
+                    <td className="border py-2 px-4">Positive Case Rate</td>
+                </tr>
+                {data.map((element) => {
+                    return (
+                        <tr>
+                            <td className="border px-4" py-2>
+                                {DateTime.fromSQL(element.date, { zone: "UTC" })
+                                    .setZone(DateTime.local().zoneName)
+                                    .toLocaleString({ weekday: "long", month: "long", day: "2-digit" })}
+                            </td>
+                            <td className="border px-4 py-2">{element.value}%</td>
+                        </tr>
+                    );
+                })}
+            </tbody>
+        </table>
+    );
+
+    return (
+        <>
+            <h3 className="text-3xl">{props.name}</h3>
+            {table}
+            <GoatCounter />
+        </>
+    );
+};
+
+export default HistoryTable;