2019-12-21 17:03:26 +01:00
|
|
|
import React from 'react';
|
2020-01-07 16:44:50 +01:00
|
|
|
import PropTypes from 'prop-types';
|
2019-12-21 17:03:26 +01:00
|
|
|
|
|
|
|
export default class ConversationStream extends React.PureComponent {
|
2020-01-08 10:12:38 +01:00
|
|
|
|
2020-01-07 16:44:50 +01:00
|
|
|
static propTypes = {
|
|
|
|
messages: PropTypes.array,
|
|
|
|
};
|
2019-12-21 17:03:26 +01:00
|
|
|
|
|
|
|
render() {
|
2020-01-07 16:44:50 +01:00
|
|
|
let messagesLists = (
|
|
|
|
<div className='no_messages'>
|
|
|
|
no messages
|
|
|
|
</div >
|
|
|
|
);
|
2019-12-21 17:03:26 +01:00
|
|
|
|
2020-01-07 16:44:50 +01:00
|
|
|
if (this.props.messages) {
|
|
|
|
|
|
|
|
messagesLists = this.props.messages.map(message => {
|
|
|
|
return (
|
2020-01-16 17:10:18 +01:00
|
|
|
<li
|
|
|
|
className={'message ' + message.who}
|
|
|
|
key={message.id}
|
|
|
|
>
|
2020-01-07 16:44:50 +01:00
|
|
|
<p >{message.text}</p >
|
|
|
|
<div className='arrow-down' />
|
|
|
|
</li >
|
|
|
|
);
|
|
|
|
});
|
|
|
|
|
|
|
|
}
|
|
|
|
return (
|
|
|
|
<div className='conversation-stream'>
|
2020-01-08 10:12:38 +01:00
|
|
|
<div className='messages'>
|
2020-01-07 16:44:50 +01:00
|
|
|
{messagesLists}
|
2020-06-02 17:28:23 +02:00
|
|
|
<hr className='marker'/>
|
2020-01-08 10:12:38 +01:00
|
|
|
</div >
|
2019-12-21 17:03:26 +01:00
|
|
|
</div >
|
|
|
|
);
|
|
|
|
}
|
|
|
|
|
|
|
|
}
|