<commit_before>import React, { Component, Fragment } from 'react'
import { Article } from '@artsy/reaction/dist/Components/Publishing'
import Waypoint from 'react-waypoint'

interface Props {
  article: any
  isActive: boolean
  isFirstArticle: boolean
  isMobile: boolean
  isTruncated: boolean
  nextArticle: any
  onActiveArticleChange: (id: string) => void
  onDateChange: (date: string) => void
}

interface State {
  isTruncated: boolean
}

export class NewsArticle extends Component<Props, State> {
  constructor(props) {
    super(props)

    this.state = {
      isTruncated: props.isTruncated || false
    }
  }

  onExpand = () => {
    const { article } = this.props
    this.setMetadata(article)
    this.setState({
      isTruncated: false
    })
  }

  setMetadata = (article: any = null) => {
    const id = article ? article.id : 'news'
    const path = article ? `/news/${article.slug}` : '/news'
    document.title = article ? article.thumbnail_title : 'News'
    window.history.replaceState({}, id, path)
  }

  onEnter = ({ previousPosition, currentPosition }) => {
    const {
      article,
      onActiveArticleChange,
      onDateChange,
      isMobile
    } = this.props
    const { isTruncated } = this.state

    if (currentPosition === 'inside') {
      if (previousPosition === 'above') {
        onDateChange(article.published_at)
      }

      if (!isTruncated) {
        this.setMetadata(article)
      } else {
        this.setMetadata()
      }

      if (isMobile) {
        onActiveArticleChange(article.id)
      }
    }
  }

  onLeave = ({ previousPosition, currentPosition }) => {
    const {
      nextArticle,
      onDateChange,
      isMobile,
      onActiveArticleChange
    } = this.props

    if (currentPosition === 'above' && previousPosition === 'inside') {
      if (nextArticle) {
        onDateChange(nextArticle.published_at)
        if (isMobile) {
          onActiveArticleChange(nextArticle.id)
        }
      }
    }
  }

  render() {
    const {
      article,
      isActive,
      isMobile,
      isTruncated,
      isFirstArticle
    } = this.props
    const marginTop = isMobile ? '100px' : '200px'
    const bottomOffset = window ? `${window.innerHeight / 2}px` : '200px'

    return (
      <Fragment>
        <Waypoint
          onEnter={(waypointData) => this.onEnter(waypointData)}
          onLeave={(waypointData) => this.onLeave(waypointData)}
          topOffset="-10px"
          bottomOffset={bottomOffset}
        >
          <div>
            <Article
              article={article}
              isTruncated={isTruncated}<commit_msg>Set bottomOffset on post mount<commit_after>import React, { Component, Fragment } from 'react'
import { Article } from '@artsy/reaction/dist/Components/Publishing'
import Waypoint from 'react-waypoint'

interface Props {
  article: any
  isActive: boolean
  isFirstArticle: boolean
  isMobile: boolean
  isTruncated: boolean
  nextArticle: any
  onActiveArticleChange: (id: string) => void
  onDateChange: (date: string) => void
}

interface State {
  isTruncated: boolean
  bottomOffset: string
}

export class NewsArticle extends Component<Props, State> {
  constructor(props) {
    super(props)

    this.state = {
      isTruncated: props.isTruncated || false,
      bottomOffset: "200px"
    }
  }

  componentDidMount() {
    this.setState({
      bottomOffset: `${window.innerHeight / 2}px`
    })
  }

  onExpand = () => {
    const { article } = this.props
    this.setMetadata(article)
    this.setState({
      isTruncated: false
    })
  }

  setMetadata = (article: any = null) => {
    const id = article ? article.id : 'news'
    const path = article ? `/news/${article.slug}` : '/news'
    document.title = article ? article.thumbnail_title : 'News'
    window.history.replaceState({}, id, path)
  }

  onEnter = ({ previousPosition, currentPosition }) => {
    const {
      article,
      onActiveArticleChange,
      onDateChange,
      isMobile
    } = this.props
    const { isTruncated } = this.state

    if (currentPosition === 'inside') {
      if (previousPosition === 'above') {
        onDateChange(article.published_at)
      }

      if (!isTruncated) {
        this.setMetadata(article)
      } else {
        this.setMetadata()
      }

      if (isMobile) {
        onActiveArticleChange(article.id)
      }
    }
  }

  onLeave = ({ previousPosition, currentPosition }) => {
    const {
      nextArticle,
      onDateChange,
      isMobile,
      onActiveArticleChange
    } = this.props

    if (currentPosition === 'above' && previousPosition === 'inside') {
      if (nextArticle) {
        onDateChange(nextArticle.published_at)
        if (isMobile) {
          onActiveArticleChange(nextArticle.id)
        }
      }
    }
  }

  render() {
    const {
      article,
      isActive,
      isMobile,
      isTruncated,
      isFirstArticle
    } = this.props
    const { bottomOffset } = this.state
    const marginTop = isMobile ? '100px' : '200px'

    return (
      <Fragment>
        <Waypoint
          onEnter={(waypointData) => this.onEnter(waypointData)}
          onLeave={(waypointData) => this.onLeave(waypointData)}
          topOffset="-10px"
          bottomOffset={bottomOffset}
        >
          <div>
            <Article
              article={article}
              isTruncated={isTruncated}
{'fraction_non_alphanumeric': 0.11663871809204397, 'fraction_numerical': 0.004471771939631079, 'mean_word_length': 2.4082539682539683, 'pattern_counts': {'":': 0, '<': 13, '<?xml version=': 0, '>': 27, 'https://': 0, 'lorem ipsum': 0, 'www.': 0, 'xml': 0}, 'pii_count': 0, 'substrings_counts': 0, 'word_list_counts': {'cursed_substrings.json': 0, 'profanity_word_list.json': 0, 'sexual_word_list.json': 0, 'zh_pornsignals.json': 0}}
{'dir': 'git-commits-cleaned', 'id': '2136095', 'n_tokens_mistral': 1691, 'n_tokens_neox': 1615, 'n_words': 329}