async function getRegisteredEvents(): Promise<any[]> {
    const res = await fetch("/api/events/registered");
    if (!res.ok) throw new Error("Couldn't load joined events");

    const data = await res.json();
    return data.map((ev: any) => ({
        title: ev.title,
        start: ev.eventDate,
        url: `/view.html?event=${ev.eventId}`
    }));
}


document.addEventListener("DOMContentLoaded", async () => {
    const calendarEl = document.getElementById("calendar") as HTMLElement;
    if (!calendarEl) return;

    const events = await getRegisteredEvents();

    const calendar = new (window as any).FullCalendar.Calendar(calendarEl, {
        initialView: 'dayGridMonth',
        headerToolbar: {
            left: 'prev,next today',
            center: 'title',
            right: 'dayGridMonth,timeGridWeek,listWeek'
        },
        themeSystem: 'bootstrap5',
        events: events,
        eventClick: function (info: any) {
            if (info.event.url) {
                window.location.href = info.event.url;
                info.jsEvent.preventDefault();
            }
        }
    });

    calendar.render();
});

