import React from 'react'
import FormInput from './FormInput'
import Comment from "./Comment"

export default React.createClass({
  getDefaultProps(){
     return {
       comments: [
         {
           author_name: "Paul",
           author_img: "",
           text: "Lorem ipsum dolor sit amet"
         },{
           author_name: "Robin",
           author_img: "",
           text: "Lorem ipsum dolor sit amet"
         },{
           author_name: "Hanh",
           author_img: "",
           text: "Lorem ipsum dolor sit amet"
         }
       ]
     }
   },
  componentWillMount(){
    this.setState({errors: ""});
  },
  handleOnSubmit(e){
    // get data
    var data = {
      username: this.refs.username.state.value,
      password: this.refs.password.state.value
    }

    if(data.username.length < 4){
      this.setState({errors: "Username must be at least 4 characters!"});
    }

    //build ajax with data
    e.preventDefault();
  },
  render() {
    return (
      <div>
        {this.props.comments.map(function(comment, i){
          return <Comment key={i} author_name={comment.author_name} text={comment.text}/>
          })}
      </div>
    )
  }
})