Docs/ Add MetaData component for Open Graph and Twitter embeds (#784)

* Docs/ Add MetaData component for Open Graph and Twitter embeds

* Switch twitter card type to `summary_large_image`

* Add a version tag to the default-og-image url for cache busting

* Update docs/src/config.ts

Co-authored-by: Fred K. Schott <fkschott@gmail.com>

* Incorporate changes from review

* Construct `canonicalImageSrc` from `Astro.site`, which is not useful now, but could be if #788 is implemented

Co-authored-by: Fred K. Schott <fkschott@gmail.com>

1 files changed, 5 insertions, 1 deletions

diff --git a/docs/src/layouts/Main.astro b/docs/src/layouts/Main.astro
index 25292896f..e9805dc42 100644
--- a/docs/src/layouts/Main.astro
+++ b/docs/src/layouts/Main.astro
@@ -4,6 +4,7 @@ import SiteSidebar from '../components/SiteSidebar.astro';
 import ThemeToggle from '../components/ThemeToggle.tsx';
 import DocSidebar from '../components/DocSidebar.tsx';
 import MenuToggle from '../components/MenuToggle.tsx';
+import MetaData from "../components/MetaData.astro";
 import { site } from "../config.ts";
 
 const { content = {}, centered = false } = Astro.props;
@@ -22,6 +23,7 @@ if (currentPage) {
     <meta name="viewport" content="width=device-width, initial-scale=1.0">
     
     <title>{content.title ? `${content.title} 🚀 ${site.title}` : site.title}</title>
+    <MetaData {content} canonicalURL={Astro.request.canonicalURL}/>
 
     <!-- This is intentionally inlined to avoid FOUC -->
     <script>
@@ -45,7 +47,9 @@ if (currentPage) {
 
     <link rel="icon" 
           type="image/svg+xml" 
-          href="/favicon.svg">
+          href="/favicon.svg"/>
+
+    <link rel="sitemap" href="/sitemap.xml"/>
 
     <link rel="preconnect" href="https://fonts.googleapis.com">
     <link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>