import useSWR from "swr";
import ReactMarkdown from "react-markdown";

const fetcher = (...args) => fetch(...args).then((res) => res.json());

const LessonContainer = ({ name }) => {
  const { data, error, isLoading } = useSWR(
    `/api/lesson?name=${name}`,
    fetcher
  );

  return (
    <>
      <h1>Lesson about {name}</h1>

      {!isLoading && !error && <ReactMarkdown>{data.contents}</ReactMarkdown>}
    </>
  );
};

export default LessonContainer;