Remove NewMarkdown component and add specific components for new message parser
This commit is contained in:
parent
332a4ebf71
commit
559f804073
|
@ -0,0 +1,16 @@
|
|||
import React from 'react';
|
||||
import { PropTypes } from 'react-native';
|
||||
|
||||
import MarkdownEmoji from '../Emoji';
|
||||
|
||||
const BigEmoji = ({ value }) => (
|
||||
<>
|
||||
<MarkdownEmoji literal={value} />
|
||||
</>
|
||||
);
|
||||
|
||||
BigEmoji.propTypes = {
|
||||
value: PropTypes.string
|
||||
};
|
||||
|
||||
export default BigEmoji;
|
|
@ -2,29 +2,38 @@ import React from 'react';
|
|||
import { Text, PropTypes } from 'react-native';
|
||||
import MarkdownLink from '../Link';
|
||||
import MarkdownList from '../List';
|
||||
import MarkdownListItem from '../ListItem';
|
||||
import MarkdownAtMention from '../AtMention';
|
||||
import MarkdownHashtag from '../Hashtag';
|
||||
// import MarkdownListItem from '../ListItem';
|
||||
// import MarkdownAtMention from '../AtMention';
|
||||
// import MarkdownHashtag from '../Hashtag';
|
||||
import MarkdownBlockQuote from '../BlockQuote';
|
||||
import MarkdownEmoji from '../Emoji';
|
||||
import MarkdownTable from '../Table';
|
||||
import MarkdownTableRow from '../TableRow';
|
||||
import MarkdownTableCell from '../TableCell';
|
||||
// import MarkdownTable from '../Table';
|
||||
// import MarkdownTableRow from '../TableRow';
|
||||
// import MarkdownTableCell from '../TableCell';
|
||||
import styles from '../styles';
|
||||
import { withTheme } from '../../../theme';
|
||||
import { themes } from '../../../constants/colors';
|
||||
|
||||
|
||||
const NewMarkdown = ({ md, theme }) => (
|
||||
const Body = ({
|
||||
md, style, numberOfLines, theme
|
||||
}) => (
|
||||
<>
|
||||
{md.map((block, index) => {
|
||||
switch (block.type) {
|
||||
case 'UNORDERED_LIST':
|
||||
return <MarkdownList ordered={false} />;
|
||||
case 'ORDERED_LIST':
|
||||
return <MarkdownList ordered />;
|
||||
case 'QUOTE':
|
||||
return <MarkdownBlockQuote />;
|
||||
case 'PARAGRAPH':
|
||||
return (
|
||||
<Text style={[styles.text, style, { color: themes[theme].bodyText }]} numberOfLines={numberOfLines} index={index}>
|
||||
{block.value?.value}
|
||||
</Text>
|
||||
);
|
||||
case 'CODE':
|
||||
return <MarkdownLink />;
|
||||
case 'LINK':
|
||||
return <MarkdownLink />;
|
||||
default:
|
||||
|
@ -34,9 +43,11 @@ const NewMarkdown = ({ md, theme }) => (
|
|||
</>
|
||||
);
|
||||
|
||||
NewMarkdown.propTypes = {
|
||||
Body.propTypes = {
|
||||
md: PropTypes.array,
|
||||
theme: PropTypes.string
|
||||
theme: PropTypes.string,
|
||||
style: PropTypes.object,
|
||||
numberOfLines: PropTypes.number
|
||||
};
|
||||
|
||||
export default withTheme(NewMarkdown);
|
||||
export default withTheme(Body);
|
|
@ -0,0 +1,34 @@
|
|||
import React from 'react';
|
||||
import { PropTypes, Text } from 'react-native';
|
||||
import { themes } from '../../../constants/colors';
|
||||
import { useTheme } from '../../../theme';
|
||||
|
||||
const Code = ({
|
||||
type, styles, style, literal
|
||||
}) => {
|
||||
const theme = useTheme();
|
||||
return (
|
||||
<Text
|
||||
style={[
|
||||
{
|
||||
...(type === 'CODE_INLINE' ? styles.codeInline : styles.codeBlock),
|
||||
color: themes[theme].bodyText,
|
||||
backgroundColor: themes[theme].bannerBackground,
|
||||
borderColor: themes[theme].bannerBackground
|
||||
},
|
||||
...style
|
||||
]}
|
||||
>
|
||||
{literal}
|
||||
</Text>
|
||||
);
|
||||
};
|
||||
|
||||
Code.propTypes = {
|
||||
type: PropTypes.string,
|
||||
literal: PropTypes.string,
|
||||
styles: PropTypes.object,
|
||||
style: PropTypes.object
|
||||
};
|
||||
|
||||
export default Code;
|
Loading…
Reference in New Issue