<commit_before>import React from 'react'
import Slider from 'react-slick'
import { Image } from 'react-bootstrap'
import UserProfile from './UserProfile'
import OneMatch from './OneMatch'
import { connect } from 'react-redux'
import { withRouter } from 'react-router'
import { getMatches } from 'APP/fire/refs'
import firebase from 'APP/fire'

import store, { constantlyUpdateUser } from '../store'

class SimpleSlider extends React.Component {

  constructor(props) {
    super()
    this.state = {
      matches: []
    }
  }

  //not sure i understand this function --eks
  componentWillReceiveProps(nextProps) {
    if (this.props.user.uid !== nextProps.user.uid) {
      getMatches(nextProps.user.uid).then(matches =>
      this.setState({matches}))
    }
  }


componentDidMount() {
      store.dispatch(constantlyUpdateUser())
      const uid = this.props.user.uid
      firebase.database().ref(`Users/${uid}/matches/matchScores`).on("child_added", ()=> {
          getMatches(uid).then(matches => this.setState({ matches }))
      })
    }

  render() {


      let matches
      matches = (this.state.matches ? this.state.matches : [])
      let matchNames = Object.keys(matches)
      var sortable = [];
      for (var person in matches) {
        sortable.push([person, matches[person]]);
      }

      const goodMatches = sortable.filter(element => element[1] >= 0.02)

      const betterArr = goodMatches.sort(function (a, b) {
        return b[1] - a[1];
      })

      var settings = {
      initialSlide: 0,
      slickGoTo: 0,
      dots: false,
      infinite: false,
      speed: 500,
      slidesToShow: 1,
      slidesToScroll: 1,
      arrows: true
    }


      return (

      <div>
        {betterArr.length ?
        <div>
        <div className="container matches"><h2 style={{textAlign: 'center'}}>Your Matches</h2></div>
          <Slider {...settings} className="container">
            {betterArr.length === goodMatches.length && betterArr.map(match =>{
              return <div key={match[0]}><OneMatch match={match} /></div>})}
          </Slider>
        </div>:
          <div className="container matches">
          <h1 style={{maxWidth: '350px', textAlign: 'center'}}>Calculating Good Friends 4 U</h1>
           <img src="/img/Radio.svg" className="load" />
        </div>
        }
      </div>
    )
  }
}

const mapStateToProps = (state) => {
  return {
    user: state.user
  }
}<commit_msg>proposition: matches look better without that header<commit_after>import React from 'react'
import Slider from 'react-slick'
import { Image } from 'react-bootstrap'
import UserProfile from './UserProfile'
import OneMatch from './OneMatch'
import { connect } from 'react-redux'
import { withRouter } from 'react-router'
import { getMatches } from 'APP/fire/refs'
import firebase from 'APP/fire'

import store, { constantlyUpdateUser } from '../store'

class SimpleSlider extends React.Component {

  constructor(props) {
    super()
    this.state = {
      matches: []
    }
  }

  //not sure i understand this function --eks
  componentWillReceiveProps(nextProps) {
    if (this.props.user.uid !== nextProps.user.uid) {
      getMatches(nextProps.user.uid).then(matches =>
      this.setState({matches}))
    }
  }


componentDidMount() {
      store.dispatch(constantlyUpdateUser())
      const uid = this.props.user.uid
      firebase.database().ref(`Users/${uid}/matches/matchScores`).on("child_added", ()=> {
          getMatches(uid).then(matches => this.setState({ matches }))
      })
    }

  render() {


      let matches
      matches = (this.state.matches ? this.state.matches : [])
      let matchNames = Object.keys(matches)
      var sortable = [];
      for (var person in matches) {
        sortable.push([person, matches[person]]);
      }

      const goodMatches = sortable.filter(element => element[1] >= 0.02)

      const betterArr = goodMatches.sort(function (a, b) {
        return b[1] - a[1];
      })

      var settings = {
      initialSlide: 0,
      slickGoTo: 0,
      dots: false,
      infinite: false,
      speed: 500,
      slidesToShow: 1,
      slidesToScroll: 1,
      arrows: true
    }


      return (

      <div>
        {betterArr.length ?
        <div>
        {/* <div className="container matches"><h2 style={{textAlign: 'center'}}>Your Matches</h2></div> */}
          <Slider {...settings} className="container">
            {betterArr.length === goodMatches.length && betterArr.map(match =>{
              return <div key={match[0]}><OneMatch match={match} /></div>})}
          </Slider>
        </div>:
          <div className="container matches">
          <h1 style={{maxWidth: '350px', textAlign: 'center'}}>Calculating Good Friends 4 U</h1>
           <img src="/img/Radio.svg" className="load" />
        </div>
        }
      </div>
    )
  }
}

const mapStateToProps = (state) => {
  return {
    user: state.user
  }
}
{'fraction_non_alphanumeric': 0.1477342003657793, 'fraction_numerical': 0.008941272099166836, 'mean_word_length': 2.5232641374373657, 'pattern_counts': {'":': 0, '<': 39, '<?xml version=': 0, '>': 53, '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': '2202864', 'n_tokens_mistral': 1548, 'n_tokens_neox': 1505, 'n_words': 338}