diff --git a/apps/web/package.json b/apps/web/package.json index 46797068..965338b0 100644 --- a/apps/web/package.json +++ b/apps/web/package.json @@ -55,6 +55,7 @@ "recharts": "^2.14.1", "rehype-autolink-headings": "^7.1.0", "rehype-parse": "^9.0.1", + "rehype-sanitize": "^6.0.0", "rehype-slug": "^6.0.0", "rehype-stringify": "^10.0.1", "sonner": "^1.7.1", diff --git a/apps/web/src/app/blog/[slug]/page.tsx b/apps/web/src/app/blog/[slug]/page.tsx index 584d8e24..0de1e0a8 100644 --- a/apps/web/src/app/blog/[slug]/page.tsx +++ b/apps/web/src/app/blog/[slug]/page.tsx @@ -1,11 +1,7 @@ import { Header } from "@/components/header"; import Prose from "@/components/ui/prose"; import { Separator } from "@/components/ui/separator"; -import { - getPosts, - getSinglePost, - processHtmlContent, -} from "@/lib/blog-query"; +import { getPosts, getSinglePost, processHtmlContent } from "@/lib/blog-query"; import { Metadata } from "next"; import Image from "next/image"; import { notFound } from "next/navigation"; @@ -118,17 +114,21 @@ async function Page({ params }: PageProps) { {data.post.title}
- {data.post.authors[0].name} -

- {data.post.authors[0].name} -

+ {data.post.authors[0] && ( + <> + {data.post.authors[0].name} +

+ {data.post.authors[0].name} +

+ + )}
diff --git a/apps/web/src/lib/blog-query.ts b/apps/web/src/lib/blog-query.ts index 71ee7341..55fe25ab 100644 --- a/apps/web/src/lib/blog-query.ts +++ b/apps/web/src/lib/blog-query.ts @@ -4,62 +4,51 @@ import rehypeParse from "rehype-parse"; import rehypeStringify from "rehype-stringify"; import rehypeSlug from "rehype-slug"; import rehypeAutolinkHeadings from "rehype-autolink-headings"; +import rehypeSanitize from "rehype-sanitize"; const url = process.env.MARBLE_API_URL; const key = process.env.MARBLE_WORKSPACE_KEY; -export async function getPosts() { - try { - const raw = await fetch(`${url}/${key}/posts`); - const data: MarblePostList = await raw.json(); - return data; - } catch (error) { - console.log(error); +async function fetchFromMarble(endpoint: string): Promise { + if (!url || !key) { + throw new Error('Missing required environment variables'); + } + + try { + const response = await fetch(`${url}/${key}/${endpoint}`); + if (!response.ok) { + throw new Error(`Failed to fetch ${endpoint}: ${response.status} ${response.statusText}`); + } + return await response.json() as T; + } catch (error) { + console.error(`Error fetching ${endpoint}:`, error); + throw error; + } } -} - -export async function getTags() { - try { - const raw = await fetch(`${url}/${key}/tags`); - const data: MarbleTagList = await raw.json(); - return data; - } catch (error) { - console.log(error); + + export async function getPosts() { + return fetchFromMarble('posts'); } -} - -export async function getSinglePost(slug: string) { - try { - const raw = await fetch(`${url}/${key}/posts/${slug}`); - const data: MarblePost = await raw.json(); - return data; - } catch (error) { - console.log(error); + + export async function getTags() { + return fetchFromMarble('tags'); } -} - -export async function getCategories() { - try { - const raw = await fetch(`${url}/${key}/categories`); - const data: MarbleCategoryList = await raw.json(); - return data; - } catch (error) { - console.log(error); + + export async function getSinglePost(slug: string) { + return fetchFromMarble(`posts/${slug}`); } -} - -export async function getAuthors() { - try { - const raw = await fetch(`${url}/${key}/authors`); - const data: MarbleAuthorList = await raw.json(); - return data; - } catch (error) { - console.log(error); + + export async function getCategories() { + return fetchFromMarble('categories'); + } + + export async function getAuthors() { + return fetchFromMarble('authors'); } -} export async function processHtmlContent(html: string): Promise { const processor = unified() + .use(rehypeSanitize) .use(rehypeParse, { fragment: true }) .use(rehypeSlug) .use(rehypeAutolinkHeadings, { behavior: "append" }) diff --git a/bun.lock b/bun.lock index 8adc73b3..5dc87c71 100644 --- a/bun.lock +++ b/bun.lock @@ -57,6 +57,7 @@ "recharts": "^2.14.1", "rehype-autolink-headings": "^7.1.0", "rehype-parse": "^9.0.1", + "rehype-sanitize": "^6.0.0", "rehype-slug": "^6.0.0", "rehype-stringify": "^10.0.1", "sonner": "^1.7.1", @@ -688,6 +689,8 @@ "hast-util-parse-selector": ["hast-util-parse-selector@4.0.0", "", { "dependencies": { "@types/hast": "^3.0.0" } }, "sha512-wkQCkSYoOGCRKERFWcxMVMOcYE2K1AaNLU8DXS9arxnLOUEWbOXKXiJUNzEpqZ3JOKpnha3jkFrumEjVliDe7A=="], + "hast-util-sanitize": ["hast-util-sanitize@5.0.2", "", { "dependencies": { "@types/hast": "^3.0.0", "@ungap/structured-clone": "^1.0.0", "unist-util-position": "^5.0.0" } }, "sha512-3yTWghByc50aGS7JlGhk61SPenfE/p1oaFeNwkOOyrscaOkMGrcW9+Cy/QAIOBpZxP1yqDIzFMR0+Np0i0+usg=="], + "hast-util-to-html": ["hast-util-to-html@9.0.5", "", { "dependencies": { "@types/hast": "^3.0.0", "@types/unist": "^3.0.0", "ccount": "^2.0.0", "comma-separated-tokens": "^2.0.0", "hast-util-whitespace": "^3.0.0", "html-void-elements": "^3.0.0", "mdast-util-to-hast": "^13.0.0", "property-information": "^7.0.0", "space-separated-tokens": "^2.0.0", "stringify-entities": "^4.0.0", "zwitch": "^2.0.4" } }, "sha512-OguPdidb+fbHQSU4Q4ZiLKnzWo8Wwsf5bZfbvu7//a9oTYoqD/fWpe96NuHkoS9h0ccGOTe0C4NGXdtS0iObOw=="], "hast-util-to-jsx-runtime": ["hast-util-to-jsx-runtime@2.3.6", "", { "dependencies": { "@types/estree": "^1.0.0", "@types/hast": "^3.0.0", "@types/unist": "^3.0.0", "comma-separated-tokens": "^2.0.0", "devlop": "^1.0.0", "estree-util-is-identifier-name": "^3.0.0", "hast-util-whitespace": "^3.0.0", "mdast-util-mdx-expression": "^2.0.0", "mdast-util-mdx-jsx": "^3.0.0", "mdast-util-mdxjs-esm": "^2.0.0", "property-information": "^7.0.0", "space-separated-tokens": "^2.0.0", "style-to-js": "^1.0.0", "unist-util-position": "^5.0.0", "vfile-message": "^4.0.0" } }, "sha512-zl6s8LwNyo1P9uw+XJGvZtdFF1GdAkOg8ujOw+4Pyb76874fLps4ueHXDhXWdk6YHQ6OgUtinliG7RsYvCbbBg=="], @@ -980,6 +983,8 @@ "rehype-parse": ["rehype-parse@9.0.1", "", { "dependencies": { "@types/hast": "^3.0.0", "hast-util-from-html": "^2.0.0", "unified": "^11.0.0" } }, "sha512-ksCzCD0Fgfh7trPDxr2rSylbwq9iYDkSn8TCDmEJ49ljEUBxDVCzCHv7QNzZOfODanX4+bWQ4WZqLCRWYLfhag=="], + "rehype-sanitize": ["rehype-sanitize@6.0.0", "", { "dependencies": { "@types/hast": "^3.0.0", "hast-util-sanitize": "^5.0.0" } }, "sha512-CsnhKNsyI8Tub6L4sm5ZFsme4puGfc6pYylvXo1AeqaGbjOYyzNv3qZPwvs0oMJ39eryyeOdmxwUIo94IpEhqg=="], + "rehype-slug": ["rehype-slug@6.0.0", "", { "dependencies": { "@types/hast": "^3.0.0", "github-slugger": "^2.0.0", "hast-util-heading-rank": "^3.0.0", "hast-util-to-string": "^3.0.0", "unist-util-visit": "^5.0.0" } }, "sha512-lWyvf/jwu+oS5+hL5eClVd3hNdmwM1kAC0BUvEGD19pajQMIzcNUd/k9GsfQ+FfECvX+JE+e9/btsKH0EjJT6A=="], "rehype-stringify": ["rehype-stringify@10.0.1", "", { "dependencies": { "@types/hast": "^3.0.0", "hast-util-to-html": "^9.0.0", "unified": "^11.0.0" } }, "sha512-k9ecfXHmIPuFVI61B9DeLPN0qFHfawM6RsuX48hoqlaKSF61RskNjSm1lI8PhBEM0MRdLxVVm4WmTqJQccH9mA=="],