From 0dcfea64b22a2bff442524ddf1ad2c32a06a4c96 Mon Sep 17 00:00:00 2001
From: Regalijan <r@regalijan.com>
Date: Mon, 16 Sep 2024 15:54:40 -0400
Subject: [PATCH] Create events calendar skeleton

---
 app/routes/events-calendar.tsx | 31 +++++++++++++++++++++++++++++++
 1 file changed, 31 insertions(+)
 create mode 100644 app/routes/events-calendar.tsx

diff --git a/app/routes/events-calendar.tsx b/app/routes/events-calendar.tsx
new file mode 100644
index 0000000..be25802
--- /dev/null
+++ b/app/routes/events-calendar.tsx
@@ -0,0 +1,31 @@
+import calendarStyles from "react-big-calendar/lib/css/react-big-calendar.css";
+import { Calendar, dayjsLocalizer } from "react-big-calendar";
+import dayjs from "dayjs";
+import { Container } from "@chakra-ui/react";
+
+export async function loader({ context }: { context: RequestContext }) {
+  const now = new Date();
+  const eventsData = await context.env.D1.prepare("SELECT answer, approved, created_by, day, details, id, month, pending, performed_at, reached_minimum_player_count, type, year FROM events WHERE month = ? AND year = ? ORDER BY day;")
+    .bind(now.getUTCMonth() + 1, now.getUTCFullYear())
+    .all();
+
+  if (eventsData.error) throw new Response(null, {
+    status: 500,
+  });
+
+  const eventList = eventsData.results.map(e => {
+    return {
+      id: e.id,
+      title: (e.type as string).toUpperCase(),
+      allDay: true,
+      start: new Date(e.year, e.month, e.day),
+      end: new Date(e.year, e.month, e.day)
+    }
+  })
+}
+
+export default function () {
+  return (
+    <Calendar localizer={dayjsLocalizer(dayjs)} style={{ height: 500 }} />
+  )
+}