<script setup lang="ts">
import '@/assets/main.scss'
import type { NuxtError } from '#app'

const config = useRuntimeConfig()
const { fetchData } = useApiFetch()

import og_img from '/og_img.png'

const { data: seo } = await fetchData<Seo[]>(`seo`)
useSeoMeta({
    title: seo.value && seo.value[0].title,
    ogTitle: seo.value && seo.value[0].title,
    description: seo.value && seo.value[0].content,
    ogDescription: seo.value && seo.value[0].content,
    ogImage: config.public.baseUrl + og_img,
})

const props = defineProps({
    error: Object as () => NuxtError
})
const route = useRoute()
if (route.path !== '/404') {
    // navigateTo('/404')
}
</script>
<template>
    <div>
        <Header />
        <div class="siteblock bg-white min-h-[calc(100vh-26.8rem)]">
            <div class="container prose">
                <div class="col-span-full">
                    <h1>Вы ищете страницу, которой не существует. Вернитесь на главную страницу сайта</h1>
                    <p>Извините, но мы не можем найти запрашиваемую страницу. К сожалению, мы не можем помочь вам с
                        покупкой забора здесь.</p>
                    <p class="hidden">
                        <code>
                            {{ error?.message }}
                        </code>
                    </p>
                    <button @click="navigateTo('/')" class="not-prose">Вернуться на главную</button>
                </div>
            </div>
        </div>
        <Footer />
        <Modal />
    </div>
</template>
