better default meta tags

eric-burel · eric-burel · commit bf7872cf169e · 2024-09-26T09:31:26.000+02:00
diff --git a/packages/astro/src/default/layouts/Layout.astro b/packages/astro/src/default/layouts/Layout.astro
@@ -4,19 +4,27 @@ import { joinPaths } from '../utils/url';
 
 interface Props {
   title: string;
+  description?: string;
 }
 
-const { title } = Astro.props;
+const { title, description = 'TutorialKit' } = Astro.props;
 const baseURL = import.meta.env.BASE_URL;
+const logoUrl = joinPaths(baseURL, '/logo.svg');
 ---
 
 <!doctype html>
 <html lang="en" transition:animate="none" class="h-full overflow-hidden">
   <head>
     <meta charset="UTF-8" />
-    <meta name="description" content="TutorialKit" />
+    <meta name="description" content={description} />
     <meta name="viewport" content="width=device-width" />
     <meta name="generator" content={Astro.generator} />
+    <meta name="og:title" content={title} />
+    <meta name="og:description" content={description} />
+    <meta name="og:image" content={logoUrl} />
+    <meta name="twitter:title" content={title} />
+    <meta name="twitter:description" content={description} />
+    <meta name="twitter:image" content={logoUrl} />
     <title>{title}</title>
     <link rel="icon" type="image/svg+xml" href={joinPaths(baseURL, '/favicon.svg')} />
     <link rel="preconnect" href="https://fonts.googleapis.com" />
diff --git a/packages/astro/src/default/pages/[...slug].astro b/packages/astro/src/default/pages/[...slug].astro
@@ -17,7 +17,7 @@ type Props = InferGetStaticPropsType<typeof getStaticPaths>;
 const { lesson, logoLink, navList, title } = Astro.props as Props;
 ---
 
-<Layout title={title}>
+<Layout title={title} description="A TutorialKit interactive lesson">
   <PageLoadingIndicator />
   <div id="previews-container"></div>
   <main class="max-w-full flex flex-col h-full overflow-hidden" data-swap-root>
