<script setup>
import BookingPortalView from '~/components/track/BookingPortalView.vue'
import { buildTrackPageSeo, useTrackFlowContent } from '~/content/bookingFlow'
import { resolvePrivateFlowToken } from '~/utils/private-flow-route'
import { buildPublicSeoLinks } from '~/utils/public-seo'

definePageMeta({
  sitePageSurfaceClass: 'bg-[#FCF3EA]',
})

const route = useRoute()
const token = computed(() => resolvePrivateFlowToken(route, '/track', 'id'))

const { trackPage } = useTrackFlowContent(token)
const trackPageSeo = computed(() => buildTrackPageSeo(trackPage.value, { privateFlow: true }))

useSeoMeta({
  title: () => trackPageSeo.value.title,
  description: () => trackPageSeo.value.description,
  ogTitle: () => trackPageSeo.value.ogTitle,
  ogDescription: () => trackPageSeo.value.ogDescription,
  robots: () => trackPageSeo.value.robots,
})

useHead(() => ({
  link: buildPublicSeoLinks(trackPageSeo.value),
}))
</script>

<template>
  <BookingPortalView :token="token" />
</template>
