import React from 'react'
import PropTypes from 'prop-types'

export default class Message extends React.Component {
  render() { return (
    <article>
      <aside>
        <a href={this.props.user.uname + "/"}>
          <img src={"//i.juick.com/a/" + this.props.user.uid + ".png"} alt=""/></a>
      </aside>
      <header className="u">@<a href={this.props.user.uname + "/"}>{this.props.user.uname}</a>: </header>
      <header className="t"><a href={this.props.user.uname + "/" + this.props.mid}>
        <time dateTime={this.props.timestamp} title={this.props.timestamp}>{this.props.timestamp}</time></a></header>
      <p>{this.props.body}</p>
    </article>) }
};

Message.propTypes = {
    mid: PropTypes.number.isRequired,
    user: PropTypes.shape({
      uid: PropTypes.number.isRequired,
      uname: PropTypes.string.isRequired
    }),
    timestamp: PropTypes.string.isRequired,
    body: PropTypes.string.isRequired
}