<template>
	<main>
		<h1>Schedule & Events</h1>
		<p>
			Study carefully, we only hold these events once a year.
		</p>
		<p v-if="!session">
			<NuxtLink to="/login">Login</NuxtLink> or <NuxtLink to="/login#create-account">Create an account</NuxtLink>
			to get notified about updates to the schedule.
		</p>
		<p v-else>
			Check out your <NuxtLink to="/account/settings">Account Setting</NuxtLink> to set up notifications for changes to schedule.
		</p>
		<h2>Schedule</h2>
		<Timetable :schedule />
		<EventsEdit />
		<h2>Events</h2>
		<EventCard v-for="event in schedule.events" :event/>
		<h2>Locations</h2>
		<ul>
			<li v-for="location in schedule.locations" :key="location.id">
				<h3>{{ location.name }}</h3>
				{{ location.description ?? "No description provided" }}
			</li>
		</ul>
	</main>
</template>

<script setup lang="ts">
const { data: session } = await useAccountSession();
const schedule = await useSchedule();
</script>
