diff --git a/app/components/Message.js b/app/components/Message.js
index 53c744e4..63bbc57d 100644
--- a/app/components/Message.js
+++ b/app/components/Message.js
@@ -4,6 +4,8 @@ import { View, Text, StyleSheet } from 'react-native';
import { CachedImage } from 'react-native-img-cache';
import { emojify } from 'react-emojione';
import Markdown from 'react-native-easy-markdown';
+import moment from 'moment';
+
import avatarInitialsAndColor from '../utils/avatarInitialsAndColor';
const styles = StyleSheet.create({
@@ -41,35 +43,59 @@ const styles = StyleSheet.create({
flex: 1
},
username: {
- fontWeight: 'bold',
- marginBottom: 5
+ fontWeight: 'bold'
+ },
+ usernameView: {
+ flexDirection: 'row',
+ alignItems: 'center',
+ marginBottom: 2
+ },
+ alias: {
+ fontSize: 10,
+ color: '#888',
+ paddingLeft: 5
+ },
+ time: {
+ fontSize: 10,
+ color: '#888',
+ paddingLeft: 5
}
});
export default class Message extends React.PureComponent {
static propTypes = {
item: PropTypes.object.isRequired,
- baseUrl: PropTypes.string.isRequired
+ baseUrl: PropTypes.string.isRequired,
+ Message_TimeFormat: PropTypes.string.isRequired
}
render() {
+ const { item } = this.props;
+
const extraStyle = {};
- if (this.props.item.temp) {
+ if (item.temp) {
extraStyle.opacity = 0.3;
}
- const msg = emojify(this.props.item.msg, { output: 'unicode' });
+ const msg = emojify(item.msg, { output: 'unicode' });
- const username = this.props.item.alias || this.props.item.u.username;
+ const username = item.alias || item.u.username;
let { initials, color } = avatarInitialsAndColor(username);
- const avatar = this.props.item.avatar || `${ this.props.baseUrl }/avatar/${ this.props.item.u.username }`;
- if (this.props.item.avatar) {
+ const avatar = item.avatar || `${ this.props.baseUrl }/avatar/${ item.u.username }`;
+ if (item.avatar) {
initials = '';
color = 'transparent';
}
+ let aliasUsername;
+ if (item.alias) {
+ aliasUsername = @{item.u.username};
+ }
+
+ const time = moment(item.ts).format(this.props.Message_TimeFormat);
+
return (
@@ -77,9 +103,12 @@ export default class Message extends React.PureComponent {
-
- {username}
-
+
+
+ {username}
+
+ {aliasUsername}{time}
+
{msg}
diff --git a/app/views/room.js b/app/views/room.js
index 54d0e886..60d5b349 100644
--- a/app/views/room.js
+++ b/app/views/room.js
@@ -45,7 +45,8 @@ const styles = StyleSheet.create({
@connect(state => ({
server: state.server,
- Site_Url: state.settings.Site_Url
+ Site_Url: state.settings.Site_Url,
+ Message_TimeFormat: state.settings.Message_TimeFormat
}), dispatch => ({
actions: bindActionCreators(actions, dispatch)
}))
@@ -56,7 +57,8 @@ export default class RoomView extends React.Component {
sid: PropTypes.string,
name: PropTypes.string,
server: PropTypes.string,
- Site_Url: PropTypes.string
+ Site_Url: PropTypes.string,
+ Message_TimeFormat: PropTypes.string
}
constructor(props) {
@@ -153,6 +155,7 @@ export default class RoomView extends React.Component {
id={item._id}
item={item}
baseUrl={this.props.Site_Url}
+ Message_TimeFormat={this.props.Message_TimeFormat}
/>
);