verdnatura-chat/app/containers/markdown/MessageBody/index.js

57 lines
1.6 KiB
JavaScript

/* eslint-disable react/no-array-index-key */
import React from 'react';
import PropTypes from 'prop-types';
import List from './List';
import Quote from './Quote';
import Paragraph from './Paragraph';
import Heading from './Heading';
import Code from './Code';
import Link from './Link';
import BigEmoji from './BigEmoji';
import { useTheme } from '../../../theme';
const isBigEmoji = tokens => tokens.length === 1 && tokens[0].type === 'BIG_EMOJI';
const Body = ({ tokens, mentions }) => {
const { theme } = useTheme();
if (isBigEmoji(tokens)) {
return <BigEmoji value={tokens[0].value} theme={theme} />;
}
return (
<>
{tokens.map((block, index) => {
switch (block.type) {
case 'UNORDERED_LIST':
return <List type={block.type} value={block.value} key={index} />;
case 'ORDERED_LIST':
return <List type={block.type} value={block.value} key={index} />;
case 'TASK':
return <List type={block.type} value={block.value} key={index} />;
case 'QUOTE':
return <Quote key={index} value={block.value} />;
case 'PARAGRAPH':
return <Paragraph key={index} value={block.value} mentions={mentions} />;
case 'CODE':
return <Code key={index} value={block.value} />;
case 'LINK':
// eslint-disable-next-line jsx-a11y/anchor-is-valid
return <Link key={index} value={block.value} />;
case 'HEADING':
return <Heading key={index} value={block.value} level={block.level} />;
default:
return null;
}
})}
</>
);
};
Body.propTypes = {
tokens: PropTypes.array,
mentions: PropTypes.array
};
export default Body;