import ImmutablePureComponent from 'react-immutable-pure-component';

export default class Messaging extends ImmutablePureComponent {

  // static propTypes = {
  // following    : ImmutablePropTypes.list,
  // conversations: ImmutablePropTypes.list,
  // newMessage   : ImmutablePropTypes.string,
  // };

  // openConversationWith(account) {
  // let conversationFound = account;
  // if conversation exist, focus on it
  // if (conversationFound) {
  //
  // } else {
  //
  // }
  // else, create conversation and focus on it
  // };

  submitCompose() {

  };

  constructor() {
    super();

    // this.props.newMessage = 'meh';
    // this.props.conversations = [
    //   {
    //     withAccount: '@machin',
    //     messages   : [],
    //     opened     : true,
    //   },
    //   {
    //     withAccount: '@chuck',
    //     messages   : [],
    //     opened     : false,
    //   },
    // ];
    // this.props.following = [
    //   { username: 'wulfila', handle: '@wulfila' },
    //   { username: 'machin', handle: '@machin' },
    //   { username: 'chuck norris', handle: '@chuck' },
    // ];

  }

  render() {
    // const contactlist = null;
    return (
      <div>
        messagerie todo
      </div>
    );
    // const contactlist = this.props.following.foreEach(elem => (
    //   <li className='user-item'>
    //     <div
    //       className='username'
    //       onClick={this.openConversationWith(elem.username)}
    //     >
    //       Machin
    //     </div >
    //     <div className='last-active'>3 min</div >
    //   </li >
    // ));
    // return (
    //   <div className='messaging-container'>
    //     <div className='messaging-box'>
    //       <div className='title'>
    //         <i
    //           role='img'
    //           className='fa fa-envelope column-header__icon fa-fw'
    //         />
    //         Messaging box
    //       </div >
    //       <div className='user-list column-header'>
    //         <h2 className='title'>User list</h2 >
    //         <ul >
    //           {contactlist}
    //         </ul >
    //       </div >
    //
    //     </div >
    //     <div className='conversations_list'>
    //       <ul >
    //         <li className='conversations_item has-new-message'>
    //           <div className='title'>
    //             <i
    //               role='img'
    //               className='fa fa-envelope column-header__icon fa-fw'
    //             />
    //             Un Gens
    //             <span className='new-message-counter'>
    //       (3)</span >
    //             <button className='btn-small'>
    //               <i
    //                 role='img'
    //                 className='fa fa-caret-down column-header__icon fa-fw'
    //               />
    //             </button >
    //           </div >
    //           <div className='conversation_stream'>
    //             <div className='message theirs'>
    //               <p >oh hello there! 😋 </p >
    //               <div className='arrow-down' />
    //             </div >
    //             <div className='message mine'>
    //               <p >General Emoji</p >
    //               <div className='arrow-down' />
    //             </div >
    //             <div className='message theirs'>
    //               <p >we just achieved comedy</p >
    //               <div className='arrow-down' />
    //             </div >
    //           </div >
    //           <div className='conversation_input'>
    //             <form
    //               action='#'
    //               // onSubmit={this.submitCompose()}
    //             >
    //               {/*value={this.newMessage.toString()}*/}
    //               <textarea
    //                 name='messager'
    //                 id=''
    //                 cols='30'
    //                 rows='10'
    //                 className='messager-textarea'
    //                 placeholder='allez dis nous tout'
    //
    //               />
    //               <input
    //                 type='submit'
    //                 name='submit'
    //                 value='Send'
    //               />
    //             </form >
    //           </div >
    //         </li >
    //       </ul >
    //     </div >
    //   </div >
    // );
  }

};