import React from 'react'; import { Link } from 'react-router-dom'; import * as qs from 'query-string'; import moment from 'moment'; import Message from './Message'; import MessageInput from './MessageInput'; import Spinner from './Spinner'; import Avatar from './Avatar'; import Icon from './Icon'; import { format } from '../utils/embed'; export default class Thread extends React.Component { constructor(props) { super(props); const { msg } = (this.props.location.state || {}); this.state = { msg: msg || {}, replies: [], active: 0 }; this.loaded = this.loaded.bind(this); this.postComment = this.postComment.bind(this); } componentDidMount() { document.body.scrollTop = 0; document.documentElement.scrollTop = 0; this.loadReplies(); } loadReplies() { this.setState({ replies: [] }) const { mid } = this.props.match.params; let params = { mid: mid } if (this.props.visitor && this.props.visitor.hash) { params.hash = this.props.visitor.hash }; const url = `https://api.juick.com/thread?${qs.stringify(params)}`; fetch(url) .then(response => { return response.json() }) .then(data => { let msg = data.shift(); this.setState({ msg: msg, replies: data, active: 0 }) } ).catch(ex => { console.log(ex); }); } loaded() { return (this.state.replies && this.state.replies.length > 0) || ('mid' in this.state.msg && !('replies' in this.state.msg)); } setActive(msg, event) { this.setState({ active: msg.rid || 0 }) } postComment(template) { const url = `https://api.juick.com/comment?hash=${this.props.visitor.hash}`; let form = new FormData(); form.append('mid', template.mid); form.append('rid', template.rid); form.append('body', template.body); form.append('attach', template.attach); fetch(url, { method: 'POST', body: form }).then(response => { return response.json() }).then(res => { this.loadReplies() }) .catch(console.log) } render() { const msg = this.state.msg; return ( { { this.props.visitor.uid > 0 && msg.mid &&

{msg.replies && `Replies (${msg.replies})`}

} {this.loaded() ? ( ) : ( )}
}
) } } function Recommendations(props) { const recomms = props.src; return recomms && (
{`Recommended by (${recomms.length}): `} { recomms.map(it => ( {it} )).reduce((prev, curr) => [prev, ', ', curr]) }
) || null; }