Implement calendar module

src/app/calendar/page.tsx

@@ -0,0 +1,17 @@
+import { CalendarShell } from "@/modules/calendar/components/calendar-shell";
+import { listCalendars, listEvents } from "@/modules/calendar/server/queries";
+
+export default async function CalendarPage() {
+  const now = new Date();
+  const from = new Date(now);
+  from.setMonth(from.getMonth() - 2);
+  const to = new Date(now);
+  to.setMonth(to.getMonth() + 10);
+
+  const [calendars, events] = await Promise.all([
+    listCalendars(),
+    listEvents({ from, to, calendarIds: "all" }),
+  ]);
+
+  return <CalendarShell calendars={calendars} events={events} />;
+}

src/app/globals.css

@@ -197,4 +197,41 @@
   html {
     @apply font-sans;
     }
-}
+}
+
+.fc {
+    --fc-border-color: var(--border);
+    --fc-page-bg-color: var(--background);
+    --fc-neutral-bg-color: var(--muted);
+    --fc-neutral-text-color: var(--muted-foreground);
+    --fc-button-bg-color: var(--primary);
+    --fc-button-border-color: var(--primary);
+    --fc-button-text-color: var(--primary-foreground);
+    --fc-button-hover-bg-color: var(--foreground);
+    --fc-button-hover-border-color: var(--foreground);
+    color: var(--foreground);
+}
+
+.fc .fc-button {
+    border-radius: var(--radius-md);
+    font-size: 0.875rem;
+    font-weight: 500;
+    padding: 0.35rem 0.6rem;
+    text-transform: none;
+}
+
+.fc .fc-toolbar-title {
+    font-size: 1.25rem;
+    font-weight: 600;
+}
+
+.fc .fc-daygrid-day-number,
+.fc .fc-col-header-cell-cushion {
+    color: var(--foreground);
+    text-decoration: none;
+}
+
+.fc .fc-event {
+    border-radius: 6px;
+    padding: 1px 3px;
+}