From 48a73cc6813ad8fbc02ccde86cfaee0cbe2968a8 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Ari=20Perkki=C3=B6?= <ari.perkkio@gmail.com>
Date: Fri, 18 Oct 2024 12:29:38 +0300
Subject: [PATCH] docs: add missing docs for `meta` configuration option

---
 .../content/docs/reference/configuration.mdx  | 30 +++++++++++++++++++
 packages/types/src/schemas/common.ts          |  2 +-
 2 files changed, 31 insertions(+), 1 deletion(-)

diff --git a/docs/tutorialkit.dev/src/content/docs/reference/configuration.mdx b/docs/tutorialkit.dev/src/content/docs/reference/configuration.mdx
index e22dfc681..03fd3cb8d 100644
--- a/docs/tutorialkit.dev/src/content/docs/reference/configuration.mdx
+++ b/docs/tutorialkit.dev/src/content/docs/reference/configuration.mdx
@@ -404,6 +404,36 @@ type TemplateType = "html" | "node" | "angular-cli" | "create-react-app" | "java
 
 ```
 
+##### `meta`
+
+Configures `<meta>` tags for Open Graph protocole and Twitter.
+TutorialKit will use your logo as the default image.
+<PropertyTable inherited type="MetaTagsSchema" />
+
+The `MetaTagsSchema` type has the following shape:
+
+```ts
+type MetaTagsSchema = {
+  image?: string;
+  description?: string;
+  title?: string;
+}
+
+```
+
+Example value:
+```yaml
+meta:
+  image: /cover.png
+  title: Title shown on social media and search engines
+  description: Description shown on social media and search engines
+```
+
+:::tip
+If your logo uses the SVG format, it may not display on most social platforms.
+Use a raster format instead, such as WEBP or PNG.
+:::
+
 ##### `custom`
 
 Assign custom fields to a chapter/part/lesson.
diff --git a/packages/types/src/schemas/common.ts b/packages/types/src/schemas/common.ts
index cd854b563..1cabc31b2 100644
--- a/packages/types/src/schemas/common.ts
+++ b/packages/types/src/schemas/common.ts
@@ -211,7 +211,7 @@ export type EditorSchema = z.infer<typeof editorSchema>;
 export type CustomSchema = z.infer<typeof customSchema>;
 
 export const webcontainerSchema = commandsSchema.extend({
-  meta: metaTagsSchema.optional(),
+  meta: metaTagsSchema.optional().describe('Configures `<meta>` tags for Open Graph protocole and Twitter.'),
 
   custom: customSchema.optional().describe('Assign custom fields to a chapter/part/lesson in the Astro collection'),