diff options
Diffstat (limited to 'src/components/MarkdownRenderer.jsx')
| -rw-r--r-- | src/components/MarkdownRenderer.jsx | 46 |
1 files changed, 46 insertions, 0 deletions
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 <div style={{ color: "red" }}>{error}</div>; + } + + if (!file) { + return <div>Loading...</div>; + } + return <div dangerouslySetInnerHTML={{ __html: content }} />; +}; + +export default MarkdownRenderer; |
