docs: refactor social links configuration reference (withastro#869)

* docs: refactor social links configuration reference * docs: update supported link icons wording Co-authored-by: Chris Swithinbank <swithinbank@gmail.com> * chore: add changes from withastro#881 * chore: fix eof newline --------- Co-authored-by: Chris Swithinbank <swithinbank@gmail.com>
morinokami · Oct 15, 2023 · ce9a739 · ce9a739
1 parent b4f649c
commit ce9a739
Show file tree

Hide file tree

Showing 4 changed files with 39 additions and 28 deletions.
diff --git a/docs/src/components/social-links-type.astro b/docs/src/components/social-links-type.astro
@@ -0,0 +1,7 @@
+---
+import { socialLinks } from '../../../packages/starlight/schemas/social';
+
+const socials = [...socialLinks].sort((a, b) => a.localeCompare(b, 'en'));
+---
+
+<code>{`Partial<Record<${socials.map((social) => `'${social}'`).join(' | ')}, string>>`}</code>
diff --git a/docs/src/content/docs/guides/customization.mdx b/docs/src/content/docs/guides/customization.mdx
@@ -191,7 +191,7 @@ defineConfig({
 
 Starlight has built-in support for adding links to your social media accounts to the site header via the [`social`](/reference/configuration/#social) option in the Starlight integration.
 
-Currently, links to Bitbucket, Codeberg, CodePen, Discord, Email, Facebook, GitHub, GitLab, Gitter, Instagram, LinkedIn, Mastodon, Microsoft Teams, Patreon, Reddit, an RSS feed, Stack Overflow, Telegram, Threads, Twitch, Twitter, X, and Youtube are supported.
+You can find a full list of supported link icons in the [Configuration Reference](/reference/configuration/#social).
 Let us know on GitHub or Discord if you need support for another service!
 
 ```js

diff --git a/...c/content/docs/reference/configuration.md → .../content/docs/reference/configuration.mdx b/...c/content/docs/reference/configuration.md → .../content/docs/reference/configuration.mdx
@@ -208,7 +208,7 @@ interface BadgeConfig {
 
 ### `locales`
 
-**type:** <code>{ \[dir: string\]: [LocaleConfig](#localeconfig) }</code>
+**type:** <code>\{ \[dir: string\]: [LocaleConfig](#localeconfig) \}</code>
 
 [Configure internationalization (i18n)](/guides/i18n/) for your site by setting which `locales` are supported.
 
@@ -308,7 +308,9 @@ The default locale will be used to provide fallback content where translations a
 
 ### `social`
 
-**type:** `Partial<Record<'bitbucket' | 'codeberg' | 'codePen' | 'discord' | 'email' | 'facebook' | 'github' | 'gitlab' | 'gitter' | 'instagram' | 'linkedin' | 'mastodon' | 'microsoftTeams' | 'patreon' | 'reddit' | 'rss' | 'stackOverflow' | 'telegram' | 'threads' | 'twitch' | 'twitter' | 'x.com' | 'youtube', string>>`
+import SocialLinksType from '../../../components/social-links-type.astro';
+
+**type:** <SocialLinksType />
 
 Optional details about the social media accounts for this site. Adding any of these will display them as icon links in the site header.
 

diff --git a/packages/starlight/schemas/social.ts b/packages/starlight/schemas/social.ts
@@ -1,33 +1,35 @@
 import { z } from 'astro/zod';
 
+export const socialLinks = [
+	'twitter',
+	'mastodon',
+	'github',
+	'gitlab',
+	'bitbucket',
+	'discord',
+	'gitter',
+	'codeberg',
+	'codePen',
+	'youtube',
+	'threads',
+	'linkedin',
+	'twitch',
+	'microsoftTeams',
+	'instagram',
+	'stackOverflow',
+	'x.com',
+	'telegram',
+	'rss',
+	'facebook',
+	'email',
+	'reddit',
+	'patreon',
+] as const;
+
 export const SocialLinksSchema = () =>
 	z
 		.record(
-			z.enum([
-				'twitter',
-				'mastodon',
-				'github',
-				'gitlab',
-				'bitbucket',
-				'discord',
-				'gitter',
-				'codeberg',
-				'codePen',
-				'youtube',
-				'threads',
-				'linkedin',
-				'twitch',
-				'microsoftTeams',
-				'instagram',
-				'stackOverflow',
-				'x.com',
-				'telegram',
-				'rss',
-				'facebook',
-				'email',
-				'reddit',
-				'patreon',
-			]),
+			z.enum(socialLinks),
 			// Link to the respective social profile for this site
 			z.string().url()
 		)