import React from 'react'; import moment from 'moment'; import PM from './PM'; import MessageInput from './MessageInput'; export default class Chat extends React.Component { constructor(props) { super(props); this.state = { chats: [] }; } componentWillMount() { this.loadChat(this.props.match.params.user); } loadChat = (uname) => { const { hash } = this.props.visitor; this.setState({ chats: [] }); if (hash && uname) { fetch(`https://api.juick.com/pm?uname=${uname}&hash=${hash}`) .then(response => response.json()) .then(jsonResponse => { this.setState({ chats: jsonResponse }); }); } } onSend = (template) => { const url = `https://api.juick.com/pm?hash=${this.props.visitor.hash}`; let form = new FormData(); form.append('body', template.body); form.append('uname', template.to.uname); fetch(url, { method: 'POST', body: form }).then(response => { return response.json() }).then(res => { this.loadChat(this.props.match.params.user); }) .catch(console.log) } render() { const { chats } = this.state; const uname = this.props.match.params.user; return (
{uname ? (
    { chats.map((chat) => ) }
) : (

No chat selected

) }
) } } const chatStyle = { boxSizing: 'border-box', padding: '0 20px', overflowY: 'scroll', height: '450px', display: 'flex', flexDirection: 'column-reverse', width: '100%' }