<script lang="ts">
	import { onMount } from 'svelte';
	import { liveQuery } from 'dexie';
	import { db_events } from '$lib/ae_events/db_events';
	import { events_slct } from '$lib/stores/ae_events_stores';
	import { page } from '$app/stores';

	let event_exhibit_obj_li = liveQuery(() => {
		const event_id = $page.params.event_id;
		if (!event_id) return [];
		return db_events.exhibit.where({ event_id_random: event_id }).sortBy('name');
	});
</script>

<section class="ae_events_leads_new h-full w-full flex flex-col items-center space-y-4">
	<h1 class="h2">Exhibitor Leads</h1>

	{#if $event_exhibit_obj_li && $event_exhibit_obj_li.length > 0}
		<h2 class="h3">Select your exhibit from the list</h2>
		<ul class="list">
			{#each $event_exhibit_obj_li as exhibit_obj}
				<li>
					<a href="/events/{$page.params.event_id}/leads/exhibit/{exhibit_obj.id_random}">
						{exhibit_obj.name} (Booth #{exhibit_obj.code})
					</a>
				</li>
			{/each}
		</ul>
	{:else}
		<p>No exhibits found for this event.</p>
	{/if}
</section>