<script lang="ts">
    import { eventRepo } from "@components/repo/event";
    import FightsGenerator from "./FightsGenerator.svelte";

    interface Props {
        params: { id: number };
    }

    let { params }: Props = $props();

    let id = params.id;

    let future = $eventRepo.getEvent(id.toString());
</script>

{#await future}
    <p>Loading...</p>
{:then event}
    <FightsGenerator data={event} />
{:catch error}
    <p class="text-red-500">Error loading event: {error.message}</p>
{/await}
