From c9a9e03b604da457ff2aa7a494661dbe2c826b53 Mon Sep 17 00:00:00 2001
From: Pascal Martineau <pascal@lewebsimple.ca>
Date: Thu, 26 Mar 2026 14:56:38 -0400
Subject: [PATCH] feat: useNodeSeo

---
 .../themes/headless/app/composables/useNodeSeo.gql | 13 +++++++++++++
 .../themes/headless/app/composables/useNodeSeo.ts  | 14 ++++++++++++++
 wp-content/themes/headless/app/pages/[...uri].gql  |  5 +++++
 wp-content/themes/headless/app/pages/[...uri].vue  |  2 ++
 4 files changed, 34 insertions(+)
 create mode 100644 wp-content/themes/headless/app/composables/useNodeSeo.gql
 create mode 100644 wp-content/themes/headless/app/composables/useNodeSeo.ts

diff --git a/wp-content/themes/headless/app/composables/useNodeSeo.gql b/wp-content/themes/headless/app/composables/useNodeSeo.gql
new file mode 100644
index 0000000..899eaae
--- /dev/null
+++ b/wp-content/themes/headless/app/composables/useNodeSeo.gql
@@ -0,0 +1,13 @@
+fragment NodeSeo on RankMathSeo {
+  title
+  description
+  robots
+  canonicalUrl
+  openGraph {
+    title
+    description
+    image {
+      url
+    }
+  }
+}
diff --git a/wp-content/themes/headless/app/composables/useNodeSeo.ts b/wp-content/themes/headless/app/composables/useNodeSeo.ts
new file mode 100644
index 0000000..a990f26
--- /dev/null
+++ b/wp-content/themes/headless/app/composables/useNodeSeo.ts
@@ -0,0 +1,14 @@
+import type { NodeSeoFragment } from "#graphql/types";
+
+export function useNodeSeo(seo: NodeSeoFragment) {
+  const { title, description, robots, canonicalUrl, openGraph } = seo;
+  useSeoMeta({
+    title,
+    description,
+    robots: robots?.join(","),
+    ogTitle: openGraph?.title,
+    ogDescription: openGraph?.description,
+    ogImage: openGraph?.image?.url,
+    ogUrl: canonicalUrl,
+  });
+}
diff --git a/wp-content/themes/headless/app/pages/[...uri].gql b/wp-content/themes/headless/app/pages/[...uri].gql
index 5327de0..8e6cb3d 100644
--- a/wp-content/themes/headless/app/pages/[...uri].gql
+++ b/wp-content/themes/headless/app/pages/[...uri].gql
@@ -4,5 +4,10 @@ query NodeByUri($uri: String!) {
     ... on Page {
       ...NodePage
     }
+    ... on NodeWithRankMathSeo {
+      seo @nonNull {
+        ...NodeSeo
+      }
+    }
   }
 }
diff --git a/wp-content/themes/headless/app/pages/[...uri].vue b/wp-content/themes/headless/app/pages/[...uri].vue
index e9d8090..083d703 100644
--- a/wp-content/themes/headless/app/pages/[...uri].vue
+++ b/wp-content/themes/headless/app/pages/[...uri].vue
@@ -28,6 +28,8 @@ if (!useNuxtApp().vueApp.component(componentName)) {
     fatal: true,
   });
 }
+
+useNodeSeo(node.value.seo);
 </script>
 
 <template>