forked from ppfun/pixelplanet
93 lines
1.9 KiB
JavaScript
93 lines
1.9 KiB
JavaScript
/*
|
|
* Renders Markdown that got parsed by core/MarkdownParser
|
|
*/
|
|
import React from 'react';
|
|
|
|
const Markdown = ({ mdArray }) => {
|
|
return mdArray.map((part) => {
|
|
const type = part[0];
|
|
switch (type) {
|
|
/* Heading */
|
|
case 'a': {
|
|
const level = Number(part[1]);
|
|
const heading = part[2];
|
|
const children = part[3];
|
|
let headingElem = [];
|
|
switch (level) {
|
|
case 1:
|
|
headingElem = <h1>{heading}</h1>;
|
|
break;
|
|
case 2:
|
|
headingElem = <h2>{heading}</h2>;
|
|
break;
|
|
case 3:
|
|
headingElem = <h3>{heading}</h3>;
|
|
break;
|
|
default:
|
|
headingElem = <h4>{heading}</h4>;
|
|
}
|
|
return [
|
|
headingElem,
|
|
<section>
|
|
<Markdown mdArray={children} />
|
|
</section>
|
|
];
|
|
}
|
|
/* Paragraph */
|
|
case 'p': {
|
|
const text = part[1];
|
|
return (
|
|
<p className="post-para">
|
|
{text}
|
|
</p>
|
|
);
|
|
}
|
|
/* Code Block */
|
|
case 'cb': {
|
|
/*
|
|
* using pe instead of code because pre
|
|
* keeps linebreaks
|
|
*/
|
|
const content = part[1];
|
|
return <pre>{content}</pre>;
|
|
}
|
|
case '>':
|
|
case '<': {
|
|
const children = part[1];
|
|
return (
|
|
<blockquote
|
|
className={(type === '>') ? 'gt' : 'rt'}
|
|
>
|
|
<Markdown mdArray={children} />
|
|
</blockquote>
|
|
);
|
|
}
|
|
case 'ul': {
|
|
const children = part[1];
|
|
return (
|
|
<ul>
|
|
<Markdown mdArray={children} />
|
|
</ul>
|
|
);
|
|
}
|
|
case '-': {
|
|
const children = part[1];
|
|
return (
|
|
<li>
|
|
<Markdown mdArray={children} />
|
|
</li>
|
|
);
|
|
}
|
|
default:
|
|
return <p>{part[1]}</p>;
|
|
}
|
|
})};
|
|
|
|
const MarkdownArticle = ({ mdArray }) => (
|
|
<article>
|
|
<Markdown mdArray={mdArray} />
|
|
</article>
|
|
);
|
|
|
|
export default React.memo(MarkdownArticle);
|