Pre-linkify messages and store breakpoints

This commit is contained in:
Ken-Håvard Lieng 2017-04-17 04:11:45 +02:00
parent 12fbca8110
commit c4609574c7
6 changed files with 85 additions and 82 deletions

View file

@ -1,5 +1,4 @@
import React, { PureComponent } from 'react';
import { timestamp, linkify } from '../util';
export default class Message extends PureComponent {
handleSenderClick = () => {
@ -11,24 +10,7 @@ export default class Message extends PureComponent {
render() {
const { message } = this.props;
const classes = ['message'];
let sender = null;
if (message.type) {
classes.push(`message-${message.type}`);
}
if (message.from) {
sender = (
<span>
{' '}
<span className="message-sender" onClick={this.handleSenderClick}>
{message.from}
</span>
</span>
);
}
const className = message.type ? `message message-${message.type}` : 'message';
const style = {
paddingLeft: `${window.messageIndent + 15}px`,
textIndent: `-${window.messageIndent}px`,
@ -36,10 +18,13 @@ export default class Message extends PureComponent {
};
return (
<p className={classes.join(' ')} style={style}>
<span className="message-time">{timestamp(message.time)}</span>
{sender}
<span>{' '}{linkify(message.message)}</span>
<p className={className} style={style}>
<span className="message-time">{message.time}</span>
{message.from &&
<span className="message-sender" onClick={this.handleSenderClick}>
{' '}{message.from}
</span>
}{' '}{message.message}
</p>
);
}