From 5c899b4a5c2c07398151960b2b86d238b49d5bf4 Mon Sep 17 00:00:00 2001
From: Volpeon <git@volpeon.ink>
Date: Sun, 26 Jul 2026 11:57:13 +0200
Subject: Better Strapi integration

---
 src/deps/strapi/blocks.tsx | 125 +++++++++++++++++++++++++++++++++++++++++++++
 1 file changed, 125 insertions(+)
 create mode 100644 src/deps/strapi/blocks.tsx

(limited to 'src/deps/strapi/blocks.tsx')

diff --git a/src/deps/strapi/blocks.tsx b/src/deps/strapi/blocks.tsx
new file mode 100644
index 0000000..bb60f71
--- /dev/null
+++ b/src/deps/strapi/blocks.tsx
@@ -0,0 +1,125 @@
+import { ContentImage } from "$/ui/objects/ContentImage.tsx";
+
+import { type Node, type DefaultInlineNode } from "./schema.ts";
+
+export function walkBlocks(
+	content: (Node | DefaultInlineNode)[],
+	fn: (_: Node | DefaultInlineNode) => unknown,
+): void {
+	for (const node of content) {
+		fn(node);
+
+		switch (node.type) {
+			case "heading":
+			case "code":
+			case "quote":
+			case "paragraph":
+			case "list":
+			case "list-item":
+			case "link": {
+				return walkBlocks(node.children, fn);
+			}
+		}
+	}
+}
+
+function blocksNodeToTSX(node: Node | DefaultInlineNode) {
+	switch (true) {
+		case node.type === "heading": {
+			switch (node.level) {
+				case 1:
+					return <h1>{blocksToTSX(node.children)}</h1>;
+				case 2:
+					return <h2>{blocksToTSX(node.children)}</h2>;
+				case 3:
+					return <h3>{blocksToTSX(node.children)}</h3>;
+				case 4:
+					return <h4>{blocksToTSX(node.children)}</h4>;
+				case 5:
+					return <h5>{blocksToTSX(node.children)}</h5>;
+				default:
+					return <h6>{blocksToTSX(node.children)}</h6>;
+			}
+		}
+
+		case node.type === "image" && !!node.image.caption: {
+			return (
+				<figure>
+					<ContentImage src={node.image.url} alt={node.image.alternativeText ?? undefined} />
+					<figcaption>{node.image.caption}</figcaption>
+				</figure>
+			);
+		}
+
+		case node.type === "image": {
+			return <ContentImage src={node.image.url} alt={node.image.alternativeText ?? undefined} />;
+		}
+
+		case node.type === "code": {
+			return (
+				<pre>
+					<code>{blocksToTSX(node.children)}</code>
+				</pre>
+			);
+		}
+
+		case node.type === "quote": {
+			return <blockquote>{blocksToTSX(node.children)}</blockquote>;
+		}
+
+		case node.type === "paragraph" &&
+			node.children.length === 1 &&
+			node.children[0]?.type === "text" &&
+			node.children[0].text === "---": {
+			return <hr />;
+		}
+
+		case node.type === "paragraph": {
+			return <p>{blocksToTSX(node.children)}</p>;
+		}
+
+		case node.type === "list" && node.format === "ordered": {
+			return <ol>${blocksToTSX(node.children)}</ol>;
+		}
+
+		case node.type === "list": {
+			return <ul>${blocksToTSX(node.children)}</ul>;
+		}
+
+		case node.type === "list-item": {
+			return <li>${blocksToTSX(node.children)}</li>;
+		}
+
+		case node.type === "link": {
+			return <a href={node.url}>{blocksToTSX(node.children)}</a>;
+		}
+
+		case node.type === "text": {
+			return [
+				node.bold ? "strong" : undefined,
+				node.code ? "code" : undefined,
+				node.italic ? "em" : undefined,
+				node.strikethrough ? "del" : undefined,
+				node.underline ? "u" : undefined,
+			].reduce((res: JSX.Element, Tag) => (Tag ? <Tag>{res}</Tag> : res), node.text);
+		}
+	}
+}
+
+export function blocksToTSX(
+	content: (Node | DefaultInlineNode)[],
+	filter: (node: Node | DefaultInlineNode) => boolean = () => true,
+): JSX.Element {
+	return content
+		.filter(filter)
+		.map(blocksNodeToTSX)
+		.filter((s) => s !== undefined);
+}
+
+export const Blocks = ({
+	content,
+	filter = () => true,
+}: {
+	content: (Node | DefaultInlineNode)[];
+	filter?: (node: Node | DefaultInlineNode) => boolean;
+}) => blocksToTSX(content, filter);
-- 
cgit v1.3.1