<script setup lang="ts">
definePageMeta({ middleware: 'auth' })
const { api } = useApi()
const route = useRoute()
const toast = useToast()
const { t } = useI18n()

onMounted(async () => {
  try {
    const routineId = route.query.routine ? Number(route.query.routine) : undefined
    const res = await api<{ session: { id: number } }>('/api/sessions', {
      method: 'POST',
      body: { routine_id: routineId }
    })
    await navigateTo(`/session/${res.session.id}`)
  } catch {
    toast.add({ title: t('session.cantStart'), color: 'error' })
    await navigateTo('/')
  }
})
</script>

<template>
  <div class="flex flex-col items-center justify-center py-24 gap-4">
    <SfLogo :size="72" loader />
    <p class="text-sm text-zinc-500">{{ t('session.preparing') }}</p>
  </div>
</template>
