feat(front): add config route to expose site configuration variables

front/composables/useSeo.ts

@@ -0,0 +1,26 @@
+type UseSeoProps = {
+    head?: Record<string, any>
+    seo?: Record<string, any>
+}
+const useSeo = async (props: UseSeoProps = {}) => {
+    const { head, seo } = props || {}
+    const { data } = await useFetch<any>('/config')
+    const seoMeta = computed(() => data.value?.data)
+    const { title } = head || {}
+    useHead({
+        ...head,
+        title: title ? `${title} - ${seoMeta?.value?.site_title}` : seoMeta?.value?.site_title,
+    })
+    useSeoMeta({
+        ...seo,
+        title: seoMeta?.value?.site_title,
+        description: seoMeta?.value?.site_desc,
+        ogTitle: seoMeta?.value?.site_title,
+        ogDescription: seoMeta?.value?.site_desc,
+        // ogImage: seoMeta?.value?.site_url,
+        // twitterCard: 'summary_large_image',
+    })
+    return
+}
+
+export default useSeo

front/layouts/default.vue

@@ -1,5 +1,6 @@
 <script lang="ts" setup>
 import { Toaster } from 'vue-sonner'
+await useSeo()
 </script>
 <template>
   <div class="h-screen w-screen ">

front/server/routes/config.ts

@@ -0,0 +1,8 @@
+export default defineEventHandler(() => {
+    const { SITE_TITLE, SITE_DESC, SITE_URL } = process.env || {}
+    return {
+        site_title: SITE_TITLE,
+        site_desc: SITE_DESC,
+        site_url: SITE_URL,
+    }
+})