chore: wire up nav (#36)

- deduplicate blog posts logic, add to nav, use correct render function for blog posts
- wire up docs to nav
- wire up tutorial, remove examples reference

apps/svelte.dev/content/docs/index.md

@@ -0,0 +1,3 @@
+---
+title: Docs
+---

apps/svelte.dev/src/lib/server/content.ts

@@ -15,3 +15,15 @@ const assets = import.meta.glob<string>('../../../content/**/+assets/**', {
 
 // https://github.com/vitejs/vite/issues/17453
 export const index = await create_index(documents, assets, '../../../content', read);
+
+export const blog_posts = index.blog.children
+	.map((document) => {
+		return {
+			slug: document.slug,
+			title: document.metadata.title,
+			date: document.metadata.date,
+			description: document.metadata.description,
+			draft: document.metadata.draft
+		};
+	})
+	.sort((a, b) => (a.date < b.date ? 1 : -1));

apps/svelte.dev/src/lib/server/renderer.ts

@@ -0,0 +1,92 @@
+import { renderContentMarkdown } from '@sveltejs/site-kit/markdown';
+
+export const render_content = (filename: string, body: string) =>
+	renderContentMarkdown(filename, body, {
+		cacheCodeSnippets: true,
+
+		// TODO these didn't work for a while in the old sites, too, investigate bringing back this functionality at some point
+		// resolveTypeLinks: (module_name, type_name) => {
+		// 	return {
+		// 		page: `/docs/${slugify(module_name)}`,
+		// 		slug: `types-${slugify(type_name)}`
+		// 	};
+		// },
+
+		twoslashBanner: (filename, source) => {
+			// TODO these are copied from Svelte and SvelteKit - adjust for new filenames
+			const injected = [];
+
+			if (/(svelte)/.test(source) || filename.includes('typescript')) {
+				injected.push(`// @filename: ambient.d.ts`, `/// <reference types="svelte" />`);
+			}
+
+			if (filename.includes('svelte-compiler')) {
+				injected.push('// @esModuleInterop');
+			}
+
+			if (filename.includes('svelte.md')) {
+				injected.push('// @errors: 2304');
+			}
+
+			// Actions JSDoc examples are invalid. Too many errors, edge cases
+			// d.ts files are not properly supported right now, fix this later
+			if (filename.includes('svelte-action') || source.includes(' declare const ')) {
+				injected.push('// @noErrors');
+			}
+
+			if (filename.includes('typescript')) {
+				injected.push('// @errors: 2304');
+			}
+
+			if (
+				source.includes('$app/') ||
+				source.includes('$service-worker') ||
+				source.includes('@sveltejs/kit/')
+			) {
+				injected.push(`// @filename: ambient-kit.d.ts`, `/// <reference types="@sveltejs/kit" />`);
+			}
+
+			if (source.includes('$env/')) {
+				// TODO we're hardcoding static env vars that are used in code examples
+				// in the types, which isn't... totally ideal, but will do for now
+				injected.push(
+					`declare module '$env/dynamic/private' { export const env: Record<string, string> }`,
+					`declare module '$env/dynamic/public' { export const env: Record<string, string> }`,
+					`declare module '$env/static/private' { export const API_KEY: string }`,
+					`declare module '$env/static/public' { export const PUBLIC_BASE_URL: string }`
+				);
+			}
+
+			if (source.includes('./$types') && !source.includes('@filename: $types.d.ts')) {
+				injected.push(
+					`// @filename: $types.d.ts`,
+					`import type * as Kit from '@sveltejs/kit';`,
+					`export type PageLoad = Kit.Load<Record<string, any>>;`,
+					`export type PageServerLoad = Kit.ServerLoad<Record<string, any>>;`,
+					`export type LayoutLoad = Kit.Load<Record<string, any>>;`,
+					`export type LayoutServerLoad = Kit.ServerLoad<Record<string, any>>;`,
+					`export type RequestHandler = Kit.RequestHandler<Record<string, any>>;`,
+					`export type Action = Kit.Action<Record<string, any>>;`,
+					`export type Actions = Kit.Actions<Record<string, any>>;`,
+					`export type EntryGenerator = () => Promise<Array<Record<string, any>>> | Array<Record<string, any>>;`
+				);
+			}
+
+			// special case — we need to make allowances for code snippets coming
+			// from e.g. ambient.d.ts
+			if (filename.endsWith('$env-all.md') || filename.endsWith('$app-forms.md')) {
+				injected.push('// @errors: 7006 7031');
+			}
+
+			if (filename.endsWith('10-configuration.md')) {
+				injected.push('// @errors: 2307');
+			}
+
+			// another special case
+			if (source.includes('$lib/types')) {
+				injected.push(`declare module '$lib/types' { export interface User {} }`);
+			}
+
+			return injected.join('\n');
+		}
+	});

apps/svelte.dev/src/routes/blog/+page.server.js

@@ -1,21 +1,9 @@
-import { index } from '$lib/server/content';
+import { blog_posts } from '$lib/server/content';
 
 export const prerender = true;
 
 export async function load() {
-	const posts = index.blog.children
-		.map((document) => {
-			return {
-				slug: document.slug,
-				title: document.metadata.title,
-				date: document.metadata.date,
-				description: document.metadata.description,
-				draft: document.metadata.draft
-			};
-		})
-		.sort((a, b) => (a.date < b.date ? 1 : -1));
-
 	return {
-		posts
+		posts: blog_posts
 	};
 }

apps/svelte.dev/src/routes/blog/[slug]/+page.server.js

@@ -1,6 +1,6 @@
 import { error } from '@sveltejs/kit';
-import { markedTransform } from '@sveltejs/site-kit/markdown';
 import { index } from '$lib/server/content';
+import { render_content } from '$lib/server/renderer';
 
 export const prerender = true;
 
@@ -36,7 +36,7 @@ export async function load({ params }) {
 		path: `/${post.slug}`,
 		date,
 		date_formatted: format_date(date),
-		body: await markedTransform(post.body),
+		body: await render_content(post.file, post.body),
 		authors,
 		sections: post.sections
 	};