From 8f9d96b60fe18e0b126022096505c1c693b51108 Mon Sep 17 00:00:00 2001 From: Pinapelz Date: Sat, 21 Dec 2024 19:18:40 -0800 Subject: feat: add ability to dynamically render markdown files in public dir --- src/components/MarkdownRenderer.jsx | 46 +++++++++++++++++++++++++++++++++++++ 1 file changed, 46 insertions(+) create mode 100644 src/components/MarkdownRenderer.jsx (limited to 'src/components') diff --git a/src/components/MarkdownRenderer.jsx b/src/components/MarkdownRenderer.jsx new file mode 100644 index 0000000..ca1da75 --- /dev/null +++ b/src/components/MarkdownRenderer.jsx @@ -0,0 +1,46 @@ +import React, { useEffect, useState } from "react"; +import { marked } from "marked"; + +const MarkdownRenderer = () => { + const [content, setContent] = useState(""); + const [error, setError] = useState(null); + const [file, setFile] = useState(null); + + useEffect(() => { + const params = new URLSearchParams(window.location.search); + const fileParam = params.get("q"); + + if (!fileParam) { + setError("No file specified"); + return; + } + + setFile(fileParam); + + const fetchMarkdown = async () => { + try { + const response = await fetch(`/md/${fileParam}.md`); + if (!response.ok) { + throw new Error(`Could not fetch ${fileParam}.md`); + } + const text = await response.text(); + setContent(marked(text)); + } catch (err) { + setError(err.message); + } + }; + + fetchMarkdown(); + }, []); + + if (error) { + return
{error}
; + } + + if (!file) { + return
Loading...
; + } + return
; +}; + +export default MarkdownRenderer; -- cgit v1.2.3