content: import React, { Component } from 'react';
  import { connect } from 'react-redux';
  import { changeSelected } from '../actions/index';
  import { Label } from 'react-bootstrap';
  
  
  class NoteElement extends Component {
  
    getDescription(note){
      if(note.description)
        return note.description;
      if(note.content.length > 100)
        return note.content.substring(0, 100) + '...';
      return note.content;
    }
  
    render(){
      const note = this.props.elementList[this.props.uid];
      if(!note)
        return null;
      return (
        <a
          onClick={() => this.props.changeSelected(note._id)}
          className={ 'list-group-item' + (this.props.selectedNote == note._id ? ' active' : '') }
          style={{ border: 'none', borderRadius: '0px', cursor: 'pointer', wordWrap: 'break-word'}}>
          <h4 className="list-group-item-heading">{ note.title }</h4>
          <p className="list-group-item-text">{ this.getDescription(note) }</p>
        </a>
      );
      // <div className="list-group-item-text clearfix">
      //   { (note.tags) ? note.tags.map((tag) => <Label key={tag} style={{marginRight: '5px'}}>{ tag }</Label>) : null }
      //   <small className="pull-right">
      //     { (new Date(note.created)).toLocaleDateString() } / { (new Date(note.modified)).toLocaleDateString() }
      //   </small>
      // </div>
    }
  }
  
  
  function mapStateToProps(state){
    return { selectedNote: state.notes.selected, elementList: state.notes.elementList };
  }
  
  export default connect(mapStateToProps, { changeSelected })(NoteElement);
  