//src/components/MarkdownContent.js


import React, { useEffect, useState } from "react";
import { useParams } from "react-router-dom";
import {fetch_} from "../utils/requestUtils";

const MarkdownContent = () => {
    const { id } = useParams();
    const [content, setContent] = useState(null);
    const [error, setError] = useState(null);

    useEffect(() => {
        fetch_(`/api/markdown/${id}`, {}, {
            use_cache: true,
            use_token: false
        })
            .then((data) => setContent(data))
            .catch((error) => setError(error));
    }, [id]);

    if (error) {
        return <div>Error: {error}</div>;
    }

    if (!content) {
        return <div>Loading...</div>;
    }

    return (
        <div className="markdown-content">
            <pre>{content}</pre>
        </div>
    );
};

export default MarkdownContent;