Mocked correct article body

src/article/data/articleAPIService.ts

@@ -9,13 +9,11 @@ const articleEndpoint = "/papers/"
 
 async function getArticle(id: string): Promise<Article> {
   try {
-    // await new Promise((res, _) => {
-    //   setTimeout(() => res(null), 2000);
-    // });
     const response = await integratorApiClient.get<FetchArticleByIdDTO>(
       // `https://run.mocky.io/v3/62cd4581-d864-4d46-b1d6-02b45b5d1994/${id}`
       // `https://jsonplaceholder.typicode.com/posts/${id}`
-      articleEndpoint + id
+      `https://run.mocky.io/v3/066be3d8-0568-439a-8b20-062deed49a97`
+      // articleEndpoint + id
     );
     const dto = response.data;
     return create({

src/components/Markdown.tsx

@@ -1,5 +1,3 @@
-import React from "react";
-
 /* -------------------------------------------------------------------------- */
 /*                                  MarkDown                                  */
 /* -------------------------------------------------------------------------- */
@@ -18,19 +16,16 @@ import Heading from "./typography/Heading";
 import { Prism as SyntaxHighlighter } from "react-syntax-highlighter";
 import { dark } from "react-syntax-highlighter/dist/esm/styles/prism";
 import Link from "./typography/Link";
-import { indexOf } from "lodash";
 
 export type Props = {
   markdown: string;
 };
 
 const Markdown = ({ markdown }: Props) => {
-  let newMarkdown = markdown.replace(/\n/g, "  \n");
-
   return (
     <ReactMarkdown
       remarkPlugins={[remarkGfm]}
-      children={newMarkdown}
+      children={markdown}
       components={{
         h1: Heading,
         h2: Typography,
@@ -45,7 +40,6 @@ const Markdown = ({ markdown }: Props) => {
             </Link>
           );
         },
-
         code({ node, inline, className, children, ...props }) {
           const match = /language-(\w+)/.exec(className || "");
           return !inline && match ? (

src/components/fetchAnArticle/AnArticleBody.tsx

@@ -12,6 +12,7 @@ import * as ArticlePart from "../../components/Article/Article";
 import BaseLayout from "components/BaseLayout";
 import Container from "components/Container";
 import NotFound from "./NotFound";
+import Markdown from "components/Markdown";
 
 const AnArticleBody = () => {
   const store = useArticleStore();
@@ -46,7 +47,12 @@ const AnArticleBody = () => {
               <ArticlePart.Article.Title className="text-3xl">
                 {article?.title}
               </ArticlePart.Article.Title>
-              <div className="py-6">{article?.content}</div>
+
+              <div className="py-6">
+                <Markdown
+                  markdown={article?.content ?? ''}
+                />
+              </div>
             </div>
           </>
         )}