First stage of the new flow
This commit is contained in:
@@ -1,53 +1,24 @@
|
||||
<script lang="ts">
|
||||
import { onMount } from 'svelte';
|
||||
import SingleEvent from './SingleEvent.svelte';
|
||||
|
||||
let { data } = $props();
|
||||
|
||||
let events: any[] = $state([]);
|
||||
let archived_events: any[] = $state([]);
|
||||
let loading = $state(true);
|
||||
|
||||
onMount(async () => {
|
||||
const { data: evs } = await data.supabase
|
||||
.from('events')
|
||||
.select('id, name, date')
|
||||
.order('date', { ascending: false });
|
||||
|
||||
const { data: aevs } = await data.supabase
|
||||
.from('events_archived')
|
||||
.select('id, name, date')
|
||||
.order('date', { ascending: false });
|
||||
|
||||
events = evs || [];
|
||||
archived_events = aevs || [];
|
||||
loading = false;
|
||||
});
|
||||
export let data;
|
||||
</script>
|
||||
|
||||
<h1 class="text-2xl font-bold mb-4 mt-2 text-center">All Events</h1>
|
||||
<div class="grid grid-cols-1 md:grid-cols-2 gap-4 max-w-2xl mx-auto">
|
||||
{#if loading}
|
||||
{#each Array(4) as _}
|
||||
<div class="block border border-gray-300 rounded bg-white p-4 shadow-none min-h-[72px] h-full w-full">
|
||||
<div class="flex flex-col gap-1">
|
||||
<span class="font-semibold text-lg text-gray-300 bg-gray-200 rounded w-1/2 h-6 mb-2 inline-block"></span>
|
||||
<span class="text-gray-300 text-sm bg-gray-100 rounded w-1/3 h-4 inline-block"></span>
|
||||
</div>
|
||||
{#each data.events as event}
|
||||
<a
|
||||
href={`/private/events/event?id=${event.id}`}
|
||||
class="block border border-gray-300 rounded bg-white p-4 shadow-none transition cursor-pointer hover:border-blue-500 group"
|
||||
>
|
||||
<div class="flex flex-col gap-1">
|
||||
<span class="font-semibold text-lg text-black-700 group-hover:underline">{event.name}</span>
|
||||
<span class="text-gray-500 text-sm">{event.date}</span>
|
||||
</div>
|
||||
{/each}
|
||||
{:else}
|
||||
{#each events as event}
|
||||
<SingleEvent id={event.id} name={event.name} date={event.date} archived={false} />
|
||||
{/each}
|
||||
{#each archived_events as event}
|
||||
<SingleEvent id={event.id} name={event.name} date={event.date} archived={true} />
|
||||
{/each}
|
||||
{/if}
|
||||
</a>
|
||||
{/each}
|
||||
</div>
|
||||
|
||||
<a
|
||||
href="/private/events/creator"
|
||||
href="/private/events/event/new"
|
||||
class="fixed bottom-6 left-1/2 -translate-x-1/2 z-50 bg-blue-600 hover:bg-blue-700 text-white font-bold py-3 px-8 rounded-full shadow-none border border-gray-300"
|
||||
>
|
||||
New Event
|
||||
|
||||
Reference in New Issue
Block a user