diff --git a/app/containers/message/Markdown.js b/app/containers/message/Markdown.js
index 805c915f8..3303f29ce 100644
--- a/app/containers/message/Markdown.js
+++ b/app/containers/message/Markdown.js
@@ -1,5 +1,5 @@
import React from 'react';
-import { Text, StyleSheet } from 'react-native';
+import { Text, StyleSheet, ViewPropTypes } from 'react-native';
import PropTypes from 'prop-types';
import EasyMarkdown from 'react-native-easy-markdown'; // eslint-disable-line
import SimpleMarkdown from 'simple-markdown';
@@ -17,13 +17,15 @@ const BlockCode = ({ node, state }) => (
);
const mentionStyle = { color: '#13679a' };
-const Markdown = ({ msg, customEmojis }) => {
+const Markdown = ({
+ msg, customEmojis, style, markdownStyle, customRules, renderInline
+}) => {
if (!msg) {
return null;
}
msg = emojify(msg, { output: 'unicode' });
- const rules = {
+ const defaultRules = {
username: {
order: -1,
match: SimpleMarkdown.inlineRegex(/^@[0-9a-zA-Z-_.]+/),
@@ -121,11 +123,13 @@ const Markdown = ({ msg, customEmojis }) => {
};
const codeStyle = StyleSheet.flatten(styles.codeStyle);
+ style = StyleSheet.flatten(style);
return (
{msg}
);
@@ -133,7 +137,11 @@ const Markdown = ({ msg, customEmojis }) => {
Markdown.propTypes = {
msg: PropTypes.string.isRequired,
- customEmojis: PropTypes.object
+ customEmojis: PropTypes.object,
+ style: ViewPropTypes.style,
+ markdownStyle: PropTypes.object,
+ customRules: PropTypes.object,
+ renderInline: PropTypes.bool
};
BlockCode.propTypes = {
diff --git a/app/presentation/RoomItem.js b/app/presentation/RoomItem.js
index 17eb42572..cd590939b 100644
--- a/app/presentation/RoomItem.js
+++ b/app/presentation/RoomItem.js
@@ -4,9 +4,12 @@ import PropTypes from 'prop-types';
import { View, Text, StyleSheet } from 'react-native';
import { emojify } from 'react-emojione';
import { connect } from 'react-redux';
+import SimpleMarkdown from 'simple-markdown';
import Avatar from '../containers/Avatar';
import Touch from '../utils/touch/index'; //eslint-disable-line
+import CustomEmoji from '../containers/EmojiPicker/CustomEmoji';
+import Markdown from '../containers/message/Markdown';
const styles = StyleSheet.create({
container: {
@@ -47,10 +50,7 @@ const styles = StyleSheet.create({
lastMessage: {
flex: 1,
flexShrink: 1,
- fontSize: 16,
- color: '#444',
marginRight: 8
- // margin: 0
},
alert: {
fontWeight: 'bold'
@@ -72,6 +72,36 @@ const styles = StyleSheet.create({
justifyContent: 'center'
}
});
+const markdownStyle = { block: { marginBottom: 0, flexWrap: 'wrap', flexDirection: 'row' } };
+
+const parseInline = (parse, content, state) => {
+ const isCurrentlyInline = state.inline || false;
+ state.inline = true;
+ const result = parse(content, state);
+ state.inline = isCurrentlyInline;
+ return result;
+};
+const parseCaptureInline = (capture, parse, state) => ({ content: parseInline(parse, capture[1], state) });
+const customRules = {
+ strong: {
+ order: -4,
+ match: SimpleMarkdown.inlineRegex(/^\*\*([\s\S]+?)\*\*(?!\*)/),
+ parse: parseCaptureInline,
+ react: (node, output, state) => ({
+ type: 'strong',
+ key: state.key,
+ props: {
+ children: output(node.content, state)
+ }
+ })
+ },
+ text: {
+ order: -3,
+ match: SimpleMarkdown.inlineRegex(/^[\s\S]+?(?=[^0-9A-Za-z\s\u00c0-\uffff]|\n\n| {2,}\n|\w+:\S|$)/),
+ parse: capture => ({ content: capture[0] }),
+ react: node => node.content
+ }
+}
const renderNumber = (unread, userMentions) => {
if (!unread || unread <= 0) {
@@ -94,7 +124,8 @@ const renderNumber = (unread, userMentions) => {
};
@connect(state => ({
- StoreLastMessage: state.settings.Store_Last_Message
+ StoreLastMessage: state.settings.Store_Last_Message,
+ customEmojis: state.customEmojis
}))
export default class RoomItem extends React.PureComponent {
static propTypes = {
@@ -108,7 +139,8 @@ export default class RoomItem extends React.PureComponent {
unread: PropTypes.number,
userMentions: PropTypes.number,
baseUrl: PropTypes.string,
- onPress: PropTypes.func
+ onPress: PropTypes.func,
+ customEmojis: PropTypes.object
}
get icon() {
@@ -118,14 +150,18 @@ export default class RoomItem extends React.PureComponent {
get lastMessage() {
const {
- lastMessage
+ lastMessage, alert
} = this.props;
if (!this.props.StoreLastMessage) {
return '';
}
- return lastMessage ? `${ lastMessage.u.username }: ${ emojify(lastMessage.msg, { output: 'unicode' }) }` : 'No Message';
+ let msg = lastMessage ? `${ lastMessage.u.username }: ${ emojify(lastMessage.msg, { output: 'unicode' }) }` : 'No Message';
+ if (alert) {
+ msg = `**${ msg }**`;
+ }
+ return msg;
}
formatDate = date => moment(date).calendar(null, {
@@ -137,7 +173,7 @@ export default class RoomItem extends React.PureComponent {
render() {
const {
- favorite, alert, unread, userMentions, name, _updatedAt
+ favorite, unread, userMentions, name, _updatedAt, customEmojis, baseUrl
} = this.props;
const date = this.formatDate(_updatedAt);
@@ -165,7 +201,15 @@ export default class RoomItem extends React.PureComponent {
{_updatedAt ? { date } : null}
- {this.lastMessage}
+
{renderNumber(unread, userMentions)}
diff --git a/package-lock.json b/package-lock.json
index 7db7cef1a..b0fe2cf91 100644
--- a/package-lock.json
+++ b/package-lock.json
@@ -12505,7 +12505,7 @@
}
},
"react-native-easy-markdown": {
- "version": "git+https://github.com/diegolmello/react-native-easy-markdown.git#ed1afe45f870524f6c23a4ca1df97770f0979c74",
+ "version": "git+https://github.com/diegolmello/react-native-easy-markdown.git#600a79faf4fdac2c21cfebeb01f96b997674dabe",
"requires": {
"simple-markdown": "0.1.2"
},