"use client";

import type { ReactElement } from "react";
import { Calendar } from "@/components/calendar/Calendar";
import { mockEvents } from "@/lib/api/events";

export default function CalendarPage(): ReactElement {
  // TODO: Replace with real API call when backend is ready
  // const { data: events, isLoading } = useQuery({
  //   queryKey: ["events"],
  //   queryFn: fetchEvents,
  // });

  const events = mockEvents;
  const isLoading = false;

  return (
    <main className="container mx-auto px-4 py-8">
      <div className="mb-8">
        <h1 className="text-3xl font-bold text-gray-900">Calendar</h1>
        <p className="text-gray-600 mt-2">View your schedule at a glance</p>
      </div>
      <Calendar events={events} isLoading={isLoading} />
    </main>
  );
}
