<script setup lang="ts">
import { unifySlug } from '#shared/general.util';
import { CampaignSheet } from '#shared/campaign.util';

definePageMeta({
    requiresAuth: true,
});

const id = unifySlug(useRoute().params.id ?? '');
const { user } = useUserSession();
const container = useTemplateRef('container');

onMounted(() => {
    queueMicrotask(() => {
        if(container.value && id)
        {
            const campaign = new CampaignSheet(id, user);
            container.value.appendChild(campaign.container);

            onUnmounted(() => {
                campaign.ws?.close();
            })
        }
    });
})
</script>

<template>
    <div class="flex flex-1 w-full h-full items-start justify-center" ref="container"></div>
</template>