meses-feed/src/ui/components/FeedPopup/index.jsx

Meses feed SDK in JavaScript

import React from 'react'
import styles from './styles.css'
import FeedActivity from './FeedActivity'

class FeedPopup extends React.Component {
  componentDidMount() { 
    let { handleLoadMore } = this.props

    this.popup = this.refs.popup
    this.popup.addEventListener('scroll', function() {
      if (this.popup.scrollTop == this.popup.scrollHeight - this.popup.offsetHeight) 
        handleLoadMore()
    }.bind(this))
  }

  render() {
    let { className, feedActivities } = this.props
    let { activityParser, handleMarkRead } = this.props

    let parser = activityParser ? activityParser : null

    let content = feedActivities.map(x => {
      return (
        <FeedActivity key={ x.activityId }
          time={ x.time } readTime={ x.readTime }
          actor={ x.actor } verb={ x.verb } object={ x.object }
          parser={ parser } handleMarkRead={ handleMarkRead } />
      )
    })

    return (
      <div ref='popup' className={ styles.feedPopup + ' ' + className }>
        { content }
      </div>
    )
  }
}

export default FeedPopup