feat: added policies route

Author: blaquewithaq

app/pages/docs/[...slug].vue

@@ -39,7 +39,7 @@ const date = computed(() => {
     timeZoneName: 'short'
   })
 
-  return `Updated at ${_timeString} (${_dateString})`
+  return `${_timeString} (${_dateString})`
 })
 
 useSeoMeta({
@@ -49,7 +49,7 @@ useSeoMeta({
   ogDescription: description
 })
 
-defineOgImageComponent('Saas')
+// defineOgImageComponent('Saas')
 
 onMounted(() => {
   timeZone.value = Intl.DateTimeFormat().resolvedOptions().timeZone || 'UTC'

app/pages/policies/[name].vue

@@ -0,0 +1,71 @@
+<script setup lang="ts">
+const route = useRoute()
+const { data: page } = await useAsyncData(`page-${route.path}`, () => queryCollection('policies').path(route.path).first())
+
+if (!page.value) {
+  throw createError({ statusCode: 404, statusMessage: 'Page not found.', fatal: true })
+}
+
+const title = page.value.seo?.title || page.value.title
+const description = page.value.seo?.description || page.value.description
+const timeZone = ref()
+
+const headline = computed(() => {
+  if (!page.value?.date || !timeZone.value) {
+    return undefined
+  }
+
+  const _date = new Date(page.value?.date)
+  const _dateString = _date.toLocaleDateString('en-US', {
+    year: 'numeric',
+    month: '2-digit',
+    day: '2-digit',
+    timeZone: timeZone.value
+  })
+  const _timeString = _date.toLocaleTimeString('en-US', {
+    hour: '2-digit',
+    minute: '2-digit',
+    timeZone: timeZone.value,
+    timeZoneName: 'short'
+  })
+
+  return `${_timeString} (${_dateString})`
+})
+
+useSeoMeta({
+  title,
+  ogTitle: title,
+  description,
+  ogDescription: description
+})
+
+// defineOgImageComponent('Saas')
+
+// if (page.value.image?.src) {
+//   defineOgImage({
+//     url: page.value.image.src
+//   })
+// } else {
+//   defineOgImageComponent('myOgImage', {
+//     headline: 'Blog'
+//   })
+// }
+
+onMounted(() => {
+  timeZone.value = Intl.DateTimeFormat().resolvedOptions().timeZone || 'UTC'
+})
+</script>
+
+<template>
+  <UContainer>
+    <UPageHeader
+      :title="page?.title"
+      :headline="headline"
+    />
+
+    <ContentRenderer
+      v-if="page"
+      :value="page"
+    />
+  </UContainer>
+</template>

app/pages/privacy-policy.vue

@@ -181,6 +181,13 @@ const collections = {
       date: z.date(),
       badge: z.object({ label: z.string().nonempty() })
     })
+  }),
+  policies: defineCollection({
+    type: 'page',
+    source: 'policies/*.md',
+    schema: z.object({
+      date: z.string()
+    })
   })
 }
 

app/pages/terms-of-service.vue

@@ -1,6 +1,6 @@
 ---
 title: Our New Website
-description: "We are excited to announce the launch of our new website, designed to enhance your experience and provide better access to our resources."
+description: We are excited to announce the launch of our new website, designed to enhance your experience and provide better access to our resources.
 image:
   src: /assets/images/blog/website-example.png
 date: 2025-06-15

bun.lock

@@ -46,10 +46,10 @@ footer:
   copyright: Copyright © 2025 ProjectM Visualizer. All rights reserved.
   links:
       - label: Privacy Policy
-        to: /privacy-policy
+        to: /policies/privacy-policy
         target: _blank
-      - label: Terms of Service
-        to: /terms-of-service
+      - label: Imprint
+        to: /policies/imprint
         target: _blank
   socialButtons:
       - ariaLabel: Youtube

content.config.ts

@@ -0,0 +1,7 @@
+---
+title: Imprint
+description: This is the imprint page for our website, providing legal information and contact details.
+date: 2025-10-17
+---
+
+## Imprint

content/4.blog/1.getting-started.md

@@ -0,0 +1,7 @@
+---
+title: Privacy Policy
+description: This is the privacy policy page for our website, outlining how we handle user data and privacy.
+date: 2025-10-17
+---
+
+## Privacy Policy