<script setup>
const { data: participants } = await useFetch('/api/participants')
</script>

<template>
    <div>
        <div class="grid md:grid-cols-2 gap-4">
            <div v-for="participant in participants" :key="participant.id">
                <ArtistListItem :runningOrder="participant.runningOrder" :country="participant.country" :artist="participant.artist" :title="participant.title" :flag="participant.flag" :artistID="participant.id" />
            </div>
        </div>
    </div>
</template>