feat: prerender public site pages

frontend/src/features/landing/publicPageMeta.js

@@ -0,0 +1,51 @@
+import { useHead } from '@vueuse/head';
+
+function getCanonicalUrl(path) {
+    const configuredSiteUrl = import.meta.env.VITE_PUBLIC_SITE_URL
+        ?? (typeof process !== 'undefined' ? process.env.VITE_PUBLIC_SITE_URL : undefined)
+        ?? (typeof process !== 'undefined' ? process.env.SITE_URL : undefined);
+
+    if (configuredSiteUrl) {
+        return new URL(path, `${configuredSiteUrl.replace(/\/$/, '')}/`).toString();
+    }
+
+    if (typeof window === 'undefined') {
+        return path;
+    }
+
+    return new URL(path, window.location.origin).toString();
+}
+
+export function usePublicPageMeta({ title, description, path }) {
+    useHead({
+        title,
+        meta: [
+            {
+                name: 'description',
+                content: description,
+            },
+            {
+                name: 'robots',
+                content: 'index,follow',
+            },
+            {
+                property: 'og:title',
+                content: title,
+            },
+            {
+                property: 'og:description',
+                content: description,
+            },
+            {
+                property: 'og:type',
+                content: 'website',
+            },
+        ],
+        link: [
+            {
+                rel: 'canonical',
+                href: getCanonicalUrl(path),
+            },
+        ],
+    });
+}

frontend/src/features/landing/views/BlogsPage.vue

@@ -1,5 +1,12 @@
 <script setup>
     import LandingSiteMenu from '@/features/landing/components/LandingSiteMenu.vue';
+    import { usePublicPageMeta } from '@/features/landing/publicPageMeta.js';
+
+    usePublicPageMeta({
+        title: 'Blogs | Socialize',
+        description: 'Practical articles on content review workflows, client approval, revision tracking, and publication handoff.',
+        path: '/blogs',
+    });
 </script>
 
 <template>

frontend/src/features/landing/views/GuidesPage.vue

@@ -1,5 +1,12 @@
 <script setup>
     import LandingSiteMenu from '@/features/landing/components/LandingSiteMenu.vue';
+    import { usePublicPageMeta } from '@/features/landing/publicPageMeta.js';
+
+    usePublicPageMeta({
+        title: 'Guides | Socialize',
+        description: 'Reusable guides for content intake, review rounds, approval decisions, and delivery readiness.',
+        path: '/guides',
+    });
 </script>
 
 <template>

frontend/src/features/landing/views/Landing.vue

@@ -1,6 +1,13 @@
 <script setup>
     import { computed } from 'vue';
     import LandingSiteMenu from '@/features/landing/components/LandingSiteMenu.vue';
+    import { usePublicPageMeta } from '@/features/landing/publicPageMeta.js';
+
+    usePublicPageMeta({
+        title: 'Socialize | Social media approval workflow',
+        description: 'Socialize helps teams manage social media content review, revisions, approval decisions, and publication handoff in one workflow.',
+        path: '/',
+    });
 
     const pillars = computed(() => [
         {

frontend/src/features/landing/views/PricingPage.vue

@@ -1,5 +1,12 @@
 <script setup>
     import LandingSiteMenu from '@/features/landing/components/LandingSiteMenu.vue';
+    import { usePublicPageMeta } from '@/features/landing/publicPageMeta.js';
+
+    usePublicPageMeta({
+        title: 'Pricing | Socialize',
+        description: 'Socialize workspace pricing for teams managing social media content approvals with clients.',
+        path: '/pricing',
+    });
 </script>
 
 <template>

frontend/src/features/landing/views/ProductPage.vue

@@ -1,5 +1,12 @@
 <script setup>
     import LandingSiteMenu from '@/features/landing/components/LandingSiteMenu.vue';
+    import { usePublicPageMeta } from '@/features/landing/publicPageMeta.js';
+
+    usePublicPageMeta({
+        title: 'Product | Socialize',
+        description: 'Socialize keeps content items, assets, revisions, comments, approval decisions, and publishing handoff details in one workspace.',
+        path: '/product',
+    });
 </script>
 
 <template>