From e8bcb994cf33ae8288ce5cf91320cb95ccbf6f27 Mon Sep 17 00:00:00 2001
From: Hans Pagel <hans.pagel@ueber.io>
Date: Fri, 6 Nov 2020 14:20:00 +0100
Subject: [PATCH] add page titles

---
 docs/gridsome.config.js              |  4 +--
 docs/src/docPages/introduction.md    |  4 +++
 docs/src/templates/DocPage/index.vue | 38 ++++++++++++++++++++++++++++
 3 files changed, 44 insertions(+), 2 deletions(-)

diff --git a/docs/gridsome.config.js b/docs/gridsome.config.js
index c3fb6c70..0e7d1212 100644
--- a/docs/gridsome.config.js
+++ b/docs/gridsome.config.js
@@ -12,7 +12,7 @@ function addStyleResource(rule) {
 
 module.exports = {
   siteName: 'tiptap',
-  titleTemplate: '%s',
+  titleTemplate: '%s | tiptap',
   port: 3000,
   plugins: [
     {
@@ -20,7 +20,7 @@ module.exports = {
       options: {
         typeName: 'DocPage',
         baseDir: './src/docPages',
-        template: './src/templates/DocPage',
+        template: './src/templates/DocPage/index.vue',
         index: './introduction',
         plugins: [
           '@gridsome/remark-prismjs',
diff --git a/docs/src/docPages/introduction.md b/docs/src/docPages/introduction.md
index b8a3280b..57036556 100644
--- a/docs/src/docPages/introduction.md
+++ b/docs/src/docPages/introduction.md
@@ -1,3 +1,7 @@
+---
+title: Renderless rich-text editor
+---
+
 :::error Don’t try this at home
 Nothing here is production-ready, don’t use it anywhere.
 :::
diff --git a/docs/src/templates/DocPage/index.vue b/docs/src/templates/DocPage/index.vue
index 0fb293a6..ef5b0a2f 100644
--- a/docs/src/templates/DocPage/index.vue
+++ b/docs/src/templates/DocPage/index.vue
@@ -6,4 +6,42 @@
   </Layout>
 </template>
 
+<page-query>
+query($path: String!) {
+  docPage(path: $path) {
+    id
+    title
+    fileInfo {
+      path
+    }
+  }
+}
+</page-query>
+
+<script>
+export default {
+  metaInfo() {
+    return {
+      title: this.$page?.docPage?.title,
+      meta: [
+        /* OpenGraph */
+        {
+          property: 'og:title',
+          content: this.$page?.docPage?.title,
+        },
+        /* Twitter */
+        {
+          name: 'twitter:title',
+          content: this.$page?.docPage?.title,
+        },
+        {
+          name: 'twitter:site',
+          content: '@_ueberdosis',
+        },
+      ],
+    }
+  },
+}
+</script>
+
 <style lang="scss" src="./style.scss" scoped></style>