+ Read docs for other{" "} + versions of Metabase. +
+ ) + } +`.
+// CommonMark/Sätteri has no such hook for inline code (only fenced blocks
+// carry a language), so plain `` comes out bare. Two site scripts rely
+// on kramdown's classes being there: js/syntax-highlight.js only
+// syntax-highlights `.highlighter-rouge` elements, and
+// js/new-docs-code-snippet-copy.js attaches a copy-button overlay to every
+// `` *except* ones classed `language-plaintext` — without this plugin,
+// every inline code span across the site would get a copy button.
+export const inlineCodeHastPlugin = defineHastPlugin({
+ name: "inline-code",
+ element: {
+ filter: ["code"],
+ visit(node, ctx) {
+ const parent = ctx.parent(node);
+ if (parent && "tagName" in parent && parent.tagName === "pre") return;
+ const existing = Array.isArray(node.properties?.className)
+ ? (node.properties.className as unknown[])
+ : [];
+ ctx.setProperty(node, "className", [
+ ...existing,
+ "language-plaintext",
+ "highlighter-rouge",
+ ]);
+ },
+ },
+});
diff --git a/src/lib/markdown/plugins/responsiveTableLabelsHastPlugin.ts b/src/lib/markdown/plugins/responsiveTableLabelsHastPlugin.ts
new file mode 100644
index 0000000000..c4795921b2
--- /dev/null
+++ b/src/lib/markdown/plugins/responsiveTableLabelsHastPlugin.ts
@@ -0,0 +1,69 @@
+import type { Element, ElementContent } from "hast";
+import { defineHastPlugin } from "satteri";
+
+// Ported from _plugins/jekyll_responsive_table_labels_plugin.rb: the site's
+// responsive CSS shows a `data-label` before each ``'s content when a
+// table collapses to a stacked layout on narrow screens. Kramdown/Jekyll
+// stamped that attribute on with a post-render Nokogiri pass; Sätteri has no
+// such pass, so this plugin stamps it on during the hast phase instead.
+function isElement(node: ElementContent): node is Element {
+ return node.type === "element";
+}
+
+function findFirstDescendant(
+ node: Element,
+ tagName: string,
+): Element | undefined {
+ for (const child of node.children) {
+ if (!isElement(child)) continue;
+ if (child.tagName === tagName) return child;
+ const found = findFirstDescendant(child, tagName);
+ if (found) return found;
+ }
+ return undefined;
+}
+
+function findAllDescendants(node: Element, tagName: string): Element[] {
+ const results: Element[] = [];
+ for (const child of node.children) {
+ if (!isElement(child)) continue;
+ if (child.tagName === tagName) results.push(child);
+ results.push(...findAllDescendants(child, tagName));
+ }
+ return results;
+}
+
+export const responsiveTableLabelsHastPlugin = defineHastPlugin({
+ name: "responsive-table-labels",
+ element: {
+ filter: ["table"],
+ visit(node, ctx) {
+ const thead = findFirstDescendant(node, "thead");
+ const headerRow = thead
+ ? findFirstDescendant(thead, "tr")
+ : findFirstDescendant(node, "tr");
+ if (!headerRow) return;
+
+ const headerTags = thead ? ["th"] : ["th", "td"];
+ const headerCells = headerRow.children.filter(
+ (child): child is Element =>
+ isElement(child) && headerTags.includes(child.tagName),
+ );
+ if (headerCells.length === 0) return;
+
+ const headers = headerCells.map((cell) => ctx.textContent(cell).trim());
+
+ for (const tr of findAllDescendants(node, "tr")) {
+ const dataCells = tr.children.filter(
+ (child): child is Element =>
+ isElement(child) && child.tagName === "td",
+ );
+ dataCells.forEach((td, idx) => {
+ const label = headers[idx];
+ if (!label) return;
+ ctx.setProperty(td, "dataLabel", label);
+ });
+ }
+ },
+ },
+});
diff --git a/src/middleware.ts b/src/middleware.ts
new file mode 100644
index 0000000000..a45e86b5c7
--- /dev/null
+++ b/src/middleware.ts
@@ -0,0 +1,27 @@
+import { defineMiddleware } from "astro:middleware";
+
+/**
+ * Dev-only Jekyll proxy: if Astro can't handle a request (404), proxy it to
+ * Jekyll so both run on the "same" port during migration. Removable once
+ * everything is migrated.
+ */
+
+const JEKYLL_PORT = 4002;
+
+export const onRequest = defineMiddleware(async (context, next) => {
+ const response = await next();
+
+ // Astro handled it.
+ if (response.status !== 404) return response;
+
+ // In prod, return Astro's own 404 response. In dev, fall through to the
+ // Jekyll proxy so unmigrated routes still resolve.
+ if (!import.meta.env.DEV) return response;
+
+ try {
+ const { pathname, search } = context.url;
+ return await fetch(`http://localhost:${JEKYLL_PORT}${pathname}${search}`);
+ } catch {
+ return response;
+ }
+});
diff --git a/src/pages/docs/astro-test/[...slug].astro b/src/pages/docs/astro-test/[...slug].astro
new file mode 100644
index 0000000000..88eb3d98eb
--- /dev/null
+++ b/src/pages/docs/astro-test/[...slug].astro
@@ -0,0 +1,41 @@
+---
+import NewDocsLayout from "@/layouts/NewDocsLayout.astro";
+import { getLiquidRenderer } from "@/lib/liquid/liquidRenderer";
+import { getMarkdownRenderer } from "@/lib/markdown/markdownRenderer";
+import { getCollection, type DataEntryMap } from "astro:content";
+
+type Props = {
+ example: DataEntryMap["examples"][number];
+};
+
+export const getStaticPaths = async () => {
+ const examples = await getCollection("examples");
+ return [
+ ...examples.map((example) => ({
+ props: { example },
+ params: { slug: example.id.replace(/^src\//, "") },
+ })),
+ ];
+};
+
+const { example } = Astro.props;
+
+// This is for debug purposes only. When rendering _docs, the dirname will be the source md file's path.
+const dirname = "_docs/latest/embedding";
+
+// Process liquid first (e.g. control flow, includes, variables, etc)
+const lq = getLiquidRenderer({ page: example.data, dirname });
+const lqOutput = await lq.render(example.body!);
+
+// Remove whitespace between elements so satteri doesn't turn them into code snippets.
+// Mimics previous behavior (which used jekyll + kramdown).
+const lqProcessed = lqOutput.replace(/>\s+<");
+
+// Convert processed markdown to html
+const md = await getMarkdownRenderer();
+const renderResult = await md.render(lqProcessed);
+---
+
+
+
diff --git a/tsconfig.json b/tsconfig.json
new file mode 100644
index 0000000000..85eaf84be9
--- /dev/null
+++ b/tsconfig.json
@@ -0,0 +1,10 @@
+{
+ "extends": "astro/tsconfigs/strict",
+ "include": [".astro/types.d.ts", "**/*"],
+ "exclude": ["dist", "_docs", "_site", "gdpr-cookie-notice", "lib", "js", "script"],
+ "compilerOptions": {
+ "paths": {
+ "@/*": ["./src/*"]
+ }
+ }
+}