diff --git a/app/containers/message/Markdown.js b/app/containers/message/Markdown.js
index 58739eec..bb6ab1e6 100644
--- a/app/containers/message/Markdown.js
+++ b/app/containers/message/Markdown.js
@@ -1,18 +1,127 @@
import React from 'react';
+import { Text, Platform } from 'react-native';
import PropTypes from 'prop-types';
import EasyMarkdown from 'react-native-easy-markdown'; // eslint-disable-line
+import SimpleMarkdown from 'simple-markdown';
import { emojify } from 'react-emojione';
+const codeStyle = {
+ ...Platform.select({
+ ios: { fontFamily: 'Courier New' },
+ android: { fontFamily: 'monospace' }
+ }),
+ backgroundColor: '#f8f8f8',
+ borderColor: '#cccccc',
+ borderWidth: 1,
+ borderRadius: 5,
+ padding: 5
+};
+
+const BlockCode = ({ node, state }) => (
+
+ {node.content}
+
+);
+
+const rules = {
+ username: {
+ order: -1,
+ match: SimpleMarkdown.inlineRegex(/@[0-9a-zA-Z-_.]+/),
+ parse: capture => ({ content: capture[0] }),
+ react: (node, output, state) => ({
+ type: 'custom',
+ key: state.key,
+ props: {
+ children: (
+ alert('Username')}
+ >
+ {node.content}
+
+ )
+ }
+ })
+ },
+ heading: {
+ order: -2,
+ match: SimpleMarkdown.inlineRegex(/#[0-9a-zA-Z-_.]+/),
+ parse: capture => ({ content: capture[0] }),
+ react: (node, output, state) => ({
+ type: 'custom',
+ key: state.key,
+ props: {
+ children: (
+ alert('Room')}
+ >
+ {node.content}
+
+ )
+ }
+ })
+ },
+ fence: {
+ order: -5,
+ match: SimpleMarkdown.blockRegex(/^ *(`{3,}|~{3,}) *(\S+)? *\n([\s\S]+?)\s*\1 *(?:\n *)+\n/),
+ parse: capture => ({
+ lang: capture[2] || undefined,
+ content: capture[3]
+ }),
+ react: (node, output, state) => ({
+ type: 'custom',
+ key: state.key,
+ props: {
+ children: (
+
+ )
+ }
+ })
+ },
+ blockCode: {
+ order: -6,
+ match: SimpleMarkdown.blockRegex(/^(```)\s*([\s\S]*?[^`])\s*\1(?!```)/),
+ parse: capture => ({ content: capture[2] }),
+ react: (node, output, state) => ({
+ type: 'custom',
+ key: state.key,
+ props: {
+ children: (
+
+ )
+ }
+ })
+ }
+};
+
const Markdown = ({ msg }) => {
if (!msg) {
return null;
}
msg = emojify(msg, { output: 'unicode' });
- return {msg};
+ return (
+ {msg}
+
+ );
};
Markdown.propTypes = {
msg: PropTypes.string.isRequired
};
+BlockCode.propTypes = {
+ node: PropTypes.object,
+ state: PropTypes.object
+};
+
export default Markdown;
diff --git a/package-lock.json b/package-lock.json
index 0b0350b4..0f03eaf0 100644
--- a/package-lock.json
+++ b/package-lock.json
@@ -12302,9 +12302,16 @@
}
},
"react-native-easy-markdown": {
- "version": "git+https://github.com/lappalj4/react-native-easy-markdown.git#4d0db3e62ec8994cf5ab8afa4de7da7e24d16f4a",
+ "version": "git+https://github.com/diegolmello/react-native-easy-markdown.git#ed1afe45f870524f6c23a4ca1df97770f0979c74",
"requires": {
"simple-markdown": "0.1.2"
+ },
+ "dependencies": {
+ "simple-markdown": {
+ "version": "0.1.2",
+ "resolved": "https://registry.npmjs.org/simple-markdown/-/simple-markdown-0.1.2.tgz",
+ "integrity": "sha1-PBUQ/kC9nqBncXuKUzyc82MltBM="
+ }
}
},
"react-native-fetch-blob": {
@@ -13501,9 +13508,9 @@
"integrity": "sha1-tf3AjxKH6hF4Yo5BXiUTK3NkbG0="
},
"simple-markdown": {
- "version": "0.1.2",
- "resolved": "https://registry.npmjs.org/simple-markdown/-/simple-markdown-0.1.2.tgz",
- "integrity": "sha1-PBUQ/kC9nqBncXuKUzyc82MltBM="
+ "version": "0.3.1",
+ "resolved": "https://registry.npmjs.org/simple-markdown/-/simple-markdown-0.3.1.tgz",
+ "integrity": "sha512-deShqkf7SMufWVbVRrUmUt0vdJ1dVWV4XC1NPzCdymKpVvQyLVz+TjmXXqu6fhmJP9iyw14pksz40jGSLDP5fQ=="
},
"simple-plist": {
"version": "0.2.1",
diff --git a/package.json b/package.json
index 5c3429de..e4b9eb2d 100644
--- a/package.json
+++ b/package.json
@@ -21,6 +21,7 @@
]
},
"dependencies": {
+ "@storybook/react-native": "^3.2.15",
"babel-plugin-transform-decorators-legacy": "^1.3.4",
"babel-plugin-transform-remove-console": "^6.8.5",
"babel-polyfill": "^6.26.0",
@@ -33,7 +34,7 @@
"react-native-action-button": "^2.8.3",
"react-native-actionsheet": "^2.3.0",
"react-native-animatable": "^1.2.4",
- "react-native-easy-markdown": "git+https://github.com/lappalj4/react-native-easy-markdown.git",
+ "react-native-easy-markdown": "git+https://github.com/diegolmello/react-native-easy-markdown.git",
"react-native-fetch-blob": "^0.10.8",
"react-native-image-picker": "^0.26.7",
"react-native-img-cache": "^1.5.2",
@@ -60,7 +61,7 @@
"redux-saga": "^0.16.0",
"regenerator-runtime": "^0.11.0",
"remote-redux-devtools": "^0.5.12",
- "@storybook/react-native": "^3.2.15",
+ "simple-markdown": "^0.3.1",
"snyk": "^1.41.1",
"strip-ansi": "^4.0.0"
},