mirror of https://framagit.org/tykayn/mastodon.git
95 lines
2.4 KiB
JavaScript
95 lines
2.4 KiB
JavaScript
import React from 'react';
|
|
import Contact from './Contact';
|
|
import PropTypes from 'prop-types';
|
|
import ConversationStream from './conversation-stream';
|
|
|
|
/**
|
|
* a conversation between the current logged in user and one recipient
|
|
*/
|
|
export default class ConversationItem extends React.PureComponent {
|
|
|
|
static propTypes = {
|
|
messages : PropTypes.array, // our and their message sorted chronologically
|
|
recipient : PropTypes.any, // account of the person we talk to, not current logged in account
|
|
newMessages: PropTypes.number,
|
|
displayed : PropTypes.bool,
|
|
};
|
|
following = [];
|
|
|
|
static defaultProps = {
|
|
newMessages: 0,
|
|
displayed : true,
|
|
};
|
|
|
|
constructor(props) {
|
|
super(props);
|
|
this.state = {
|
|
composeMessage: '',
|
|
displayed : this.props.displayed,
|
|
};
|
|
}
|
|
|
|
submitCompose() {
|
|
console.log('submit');
|
|
}
|
|
|
|
handleChange(e) {
|
|
// e.preventDefault();
|
|
console.log('e', e);
|
|
}
|
|
|
|
render() {
|
|
const hasNewClass = this.props.newMessages ? 'has-new-message' : 'nothing-new';
|
|
const isVisible = this.props.displayed ? 'displayed' : 'hidden';
|
|
const list = (
|
|
<li className={'conversation-item ' + hasNewClass + ' ' + isVisible}>
|
|
<div className='top-title'>
|
|
<i
|
|
role='img'
|
|
className='fa fa-envelope column-header__icon fa-fw'
|
|
/>
|
|
<Contact account={this.props.recipient} />
|
|
{this.props.newMessages && (
|
|
<span className='new-message-counter'>
|
|
({this.props.newMessages})
|
|
</span >
|
|
)}
|
|
<button className='btn-small'>
|
|
<i
|
|
role='img'
|
|
className='fa fa-caret-down column-header__icon fa-fw'
|
|
/>
|
|
</button >
|
|
</div >
|
|
<ConversationStream messages={this.props.messages} />
|
|
<div className='conversation_input'>
|
|
<form
|
|
action='#'
|
|
onSubmit={this.submitCompose}
|
|
>
|
|
<textarea
|
|
name='messager'
|
|
id=''
|
|
cols='15'
|
|
rows='3'
|
|
className='messager-textarea'
|
|
placeholder='allez dis nous tout'
|
|
value={this.state.composeMessage}
|
|
onChange={this.handleChange}
|
|
|
|
/>
|
|
<input
|
|
type='submit'
|
|
name='submit'
|
|
value='Send'
|
|
/>
|
|
</form >
|
|
</div >
|
|
</li >
|
|
);
|
|
return list;
|
|
|
|
}
|
|
|
|
}
|