render()

in tweeter/src/components/Tweets.js [60:103]


  render() {
      return (
      <div className="container">
        <div className="tweettext-container">
            <input 
              onChange={event => this.setState({addTweetText: event.target.value})} 
              value={this.state.addTweetText} 
              onKeyUp={event => {
                if (event.key == "Enter") {
                  this.addTweet()
                }
              }}
              placeholder="Say something . . ." 
              type="text" className="tweet"/>
            <button type="button" onClick={this.addTweet.bind(this)}>Tweet</button>
        </div>

        <div className="Feed">
          {this.state.tweets.length == 0 && <p>Nothing to show</p>}
          {this.state.tweets.map(tweet => (
            <div key={tweet.id} className="tweet">
              <div className="avatar">
                <i className="fa fa-user fa-4x"></i>
              </div>
              <div className="bubble-container">
                <div className="bubble">
                  <p className='username'>@{tweet.user}</p>
                  <p className='tweettext'>{tweet.text}</p>
                  <Sentiment message={tweet.text}></Sentiment>
                  <div className="over-bubble">
                    <div className='action-buttons'>
                      <i className='fa fa-reply'></i>
                      <i className='fa fa-retweet'></i>
                      <i className='fa fa-star'></i>
                    </div>
                  </div>
                </div>
                <div className="arrow"></div>
              </div>
            </div>
          ))}
        </div>
    </div>)
  }