fix: add i18n to remark plugins

config/mdx.config.js

@@ -1,4 +1,9 @@
+/** @typedef {import('@mdx-js/mdx').CompileOptions} CompileOptions */
+/** @typedef {import('retext-smartypants').Options} TypographicOptions */
+/** @typedef {import('./i18n.config.js').Locale} Locale */
+
 import withSyntaxHighlighter from "@shikijs/rehype";
+import { getLocale, getTranslations } from "next-intl/server";
 import withHeadingIds from "rehype-slug";
 import withFrontmatter from "remark-frontmatter";
 import withGfm from "remark-gfm";
@@ -8,14 +13,51 @@ import withTypographicQuotes from "remark-smartypants";
 import { withMdxFootnotes } from "../lib/content/footnotes.js";
 import { config as syntaxHighlighterConfig } from "./syntax-highlighter.config.js";
 
-/** @type {import('@mdx-js/mdx').CompileOptions} */
-export const config = {
-	remarkPlugins: [
-		withFrontmatter,
-		withMdxFrontmatter,
-		withGfm,
-		withMdxFootnotes,
-		withTypographicQuotes,
-	],
-	rehypePlugins: [withHeadingIds, [withSyntaxHighlighter, syntaxHighlighterConfig]],
+/** @type {Map<Locale, CompileOptions>} */
+const cache = new Map();
+
+/** @type {Record<Locale, TypographicOptions>} */
+const typography = {
+	de: {
+		openingQuotes: { double: "„", single: "‚" },
+		closingQuotes: { double: "“", single: "‘" },
+	},
+	en: {
+		openingQuotes: { double: "“", single: "‘" },
+		closingQuotes: { double: "”", single: "’" },
+	},
 };
+
+/** @type {() => Promise<CompileOptions>} */
+export async function createConfig() {
+	const locale = /** @type {Locale} */ (await getLocale());
+	const t = await getTranslations();
+
+	if (cache.has(locale)) return /** @type {CompileOptions} */ (cache.get(locale));
+
+	/** @type {CompileOptions} */
+	const config = {
+		remarkPlugins: [
+			withFrontmatter,
+			withMdxFrontmatter,
+			withGfm,
+			withMdxFootnotes,
+			[withTypographicQuotes, typography[locale]],
+		],
+		remarkRehypeOptions: {
+			footnoteBackLabel(referenceIndex, rereferenceIndex) {
+				return t("Mdx.FootnoteBackLabel", {
+					reference:
+						String(referenceIndex + 1) +
+						(rereferenceIndex > 1 ? "-" + String(rereferenceIndex) : ""),
+				});
+			},
+			footnoteLabel: t("Mdx.Footnotes"),
+		},
+		rehypePlugins: [withHeadingIds, [withSyntaxHighlighter, syntaxHighlighterConfig]],
+	};
+
+	cache.set(locale, config);
+
+	return config;
+}

keystatic.config.tsx

@@ -86,6 +86,7 @@ function createComponents(
 		Download: mark({
 			label: "Download",
 			icon: <DownloadIcon />,
+			tag: "a",
 			className: "underline decoration-dotted",
 			schema: {
 				href: fields.file({

lib/content/mdx.ts

@@ -7,7 +7,7 @@ import { notFound } from "next/navigation";
 import { cache } from "react";
 import * as runtime from "react/jsx-runtime";
 
-import { config as mdxConfig } from "@/config/mdx.config";
+import { createConfig as createMdxConfig } from "@/config/mdx.config";
 import { reader } from "@/lib/content/reader";
 import type { Curriculum, DocumentationPage, Resource } from "@/lib/content/types";
 import { useMDXComponents } from "@/mdx-components";
@@ -17,11 +17,13 @@ interface MdxContent<T extends Record<string, unknown>> extends MDXModule {
 	frontmatter: T;
 }
 
-export const processMdx = cache(function processMdx<T extends Record<string, unknown>>(
+export const processMdx = cache(async function processMdx<T extends Record<string, unknown>>(
 	code: string,
 ): Promise<MdxContent<T>> {
+	const config = await createMdxConfig();
+
 	// @ts-expect-error Upstream type error.
-	return evaluate(code, { ...runtime, ...mdxConfig, useMDXComponents });
+	return evaluate(code, { ...runtime, ...config, useMDXComponents });
 });
 
 interface CurriculumMetadata extends Omit<Curriculum, "content"> {}

messages/de.json

@@ -89,6 +89,10 @@
 		"name": "ACDH-CH Howto",
 		"short-name": "ACDH-CH Howto"
 	},
+	"Mdx": {
+		"FootnoteBackLabel": "Zurück zu Referenz {reference}",
+		"Footnotes": "Fußnoten"
+	},
 	"NotFoundPage": {
 		"meta": {
 			"title": "Seite nicht gefunden"

messages/en.json

@@ -89,6 +89,10 @@
 		"name": "ACDH-CH Howto",
 		"short-name": "ACDH-CH Howto"
 	},
+	"Mdx": {
+		"FootnoteBackLabel": "Back to reference {reference}",
+		"Footnotes": "Footnotes"
+	},
 	"NotFoundPage": {
 		"meta": {
 			"title": "Page not found"

next.config.js

@@ -6,7 +6,7 @@ import localesPlugin from "@react-aria/optimize-locales-plugin";
 import createI18nPlugin from "next-intl/plugin";
 
 import { env } from "./config/env.config.js";
-import { config as mdxConfig } from "./config/mdx.config.js";
+import { createConfig as createMdxConfig } from "./config/mdx.config.js";
 
 /** @type {NextConfig} */
 const config = {
@@ -92,7 +92,7 @@ const plugins = [
 	createI18nPlugin("./lib/i18n.ts"),
 	createMdxPlugin({
 		extension: /\.(md|mdx)$/,
-		options: mdxConfig,
+		options: await createMdxConfig(),
 	}),
 ];
 

package.json

@@ -7,7 +7,7 @@
 		"node": "20.x",
 		"pnpm": "9.x"
 	},
-	"packageManager": "pnpm@9.0.6",
+	"packageManager": "pnpm@9.1.0",
 	"scripts": {
 		"analyze": "BUNDLE_ANALYZER=\"enabled\" next build --no-lint",
 		"build": "next build",
@@ -26,7 +26,7 @@
 		"preinstall": "npx only-allow pnpm",
 		"prepare": "run-s setup",
 		"setup": "is-ci || simple-git-hooks",
-		"start": "next start",
+		"start": "node .next/standalone/server.js",
 		"test": "exit 0",
 		"test:e2e": "playwright test",
 		"test:e2e:codegen": "playwright codegen",
@@ -39,7 +39,7 @@
 	"dependencies": {
 		"@acdh-oeaw/lib": "^0.1.11",
 		"@acdh-oeaw/validate-env": "^0.0.3",
-		"@keystatic/core": "^0.5.13",
+		"@keystatic/core": "^0.5.14",
 		"@keystatic/next": "^5.0.0",
 		"@mdx-js/mdx": "^3.0.1",
 		"@react-aria/utils": "^3.24.0",
@@ -52,7 +52,7 @@
 		"lucide-react": "^0.378.0",
 		"mdast-util-mdx": "^3.0.0",
 		"next": "^14.2.3",
-		"next-intl": "^3.12.1",
+		"next-intl": "^3.12.2",
 		"react": "^18.3.1",
 		"react-aria-components": "^1.2.0",
 		"react-dom": "^18.3.1",
@@ -62,6 +62,7 @@
 		"remark-gfm": "^4.0.0",
 		"remark-mdx-frontmatter": "^4.0.0",
 		"remark-smartypants": "^3.0.1",
+		"retext-smartypants": "^6.1.0",
 		"server-only": "^0.0.1",
 		"sharp": "^0.33.3",
 		"shiki": "^1.4.0",
@@ -86,16 +87,16 @@
 		"@next/bundle-analyzer": "^14.2.3",
 		"@next/eslint-plugin-next": "^14.2.3",
 		"@next/mdx": "^14.2.3",
-		"@playwright/test": "^1.43.1",
+		"@playwright/test": "^1.44.0",
 		"@react-aria/optimize-locales-plugin": "^1.1.0",
 		"@react-types/shared": "^3.23.0",
 		"@shikijs/rehype": "^1.4.0",
 		"@types/mdast": "^4.0.3",
 		"@types/mdx": "^2.0.13",
-		"@types/node": "^20.12.8",
+		"@types/node": "^20.12.10",
 		"@types/react": "^18.3.1",
 		"@types/react-dom": "^18.3.0",
-		"axe-core": "^4.9.0",
+		"axe-core": "^4.9.1",
 		"axe-playwright": "^2.0.1",
 		"ci-info": "^4.0.0",
 		"dotenv": "^16.4.5",
@@ -113,7 +114,7 @@
 		"stylelint": "^16.5.0",
 		"tailwindcss": "^3.4.3",
 		"tailwindcss-react-aria-components": "^1.1.2",
-		"tsx": "^4.9.0",
+		"tsx": "^4.9.3",
 		"typescript": "^5.4.5"
 	},
 	"pnpm": {