<script setup lang="ts">
import { onMounted, ref } from 'vue'

import EmbedableContent from 'src/components/shared/embedable-content.vue'

import { type MarkdownDefinition } from 'content/routes.js'
import { fetchAndParseMarkdown } from 'src/utilities/fetch'
import { getCurrentRoute } from 'src/utilities/vuetils'
import { useRouteStore } from 'src/routes'

const content = ref('')
const currentRoute = getCurrentRoute()
const routeStore = useRouteStore()
const routeConfig = routeStore._routes[currentRoute.path] as MarkdownDefinition

onMounted(async () => {
  content.value = await fetchAndParseMarkdown(routeConfig.content)
})
</script>

<template lang="pug">
.template.markdown
  EmbedableContent(
    v-if='content'
    :content='content'
  )
</template>

<style scoped lang="sass">

</style>
