document.addEventListener("DOMContentLoaded", () => {
    const applyBtn = document.getElementById("applyBtn") as HTMLButtonElement | null;

    if (!applyBtn) return;

    const eventId = getEventIdFromURL();

    if (!eventId) {
        console.error("Event ID not found.");
        return;
    }

    applyBtn.addEventListener("click", async () => {
        try {
            const response = await fetch(`/api/events/join/${eventId}`, {
                method: "POST",
                headers: {
                    "Content-Type": "application/json"
                },
            });

            const result: {
                success: boolean;
                error_msg?: string;
            } = await response.json();

            if (result.success) {
                applyBtn.disabled = true;
                applyBtn.textContent = "Applied Succesfully";
            } else {
                alert(`Error: ${result.error_msg ?? "Unknown error occurred."}`);
            }
        } catch (error) {
            console.error("Failed to apply:", error);
            alert("Failed to apply due to a network or server error.");
        }
    });

    function getEventIdFromURL(): number | null {
        const params = new URLSearchParams(window.location.search);
        const idParam = params.get("event");
        return idParam ? parseInt(idParam, 10) : null;
    }
});