Press n or j to go to the next uncovered block, b, p or k for the previous block.
| 1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 | import React, { useCallback, useEffect, useState } from 'react';
import { marked } from 'marked';
import './styles.scss';
export type MarkdownProps = {
value: string;
};
const Markdown = ({ value }: MarkdownProps): JSX.Element => {
const [html, setHtml] = useState<string>();
const parseValue = useCallback(async (_value: string) => {
const _html = await marked.parse(_value);
setHtml(_html);
}, []);
useEffect(() => {
void parseValue(value);
}, [value]);
return <div className='markdown' dangerouslySetInnerHTML={{ __html: html ?? '' }} />;
};
export default Markdown;
|