<commit_before>'use strict';
import React from "react";
import RepoListItem from "./repo_list_item"

/**
 * The RepoList is a list of GitHub repositories
 */
export default
class RepoList extends React.Component {
    constructor( props ) {
        super(props);
    }

    /**
     * http://facebook.github.io/react/docs/component-specs.html#updating-componentwillreceiveprops
     * Invoked when a component is receiving new props. This method is not called for the initial render.
     Use this as an opportunity to react to a prop transition before render() is called by updating the state using
     this.setState(). The old props can be accessed via this.props. Calling this.setState() within this function will
     not trigger an additional render.
     */
    componentWillReceiveProps( nextProps ) {
        const trendingUp = {};
        const trendingDown = {};

        //this is not efficient, but an example
        nextProps.repos.forEach(( newRepo ) => {
            //find the matching old repo
            let oldRepo = this.props.repos.filter(r => {
                return r.id === newRepo.id;
            })[0];
            //if found, compare the current star count against the old count
            if ( oldRepo ) {
                if ( newRepo.stargazers_count > oldRepo.stargazers_count ) {
                    trendingUp[newRepo.id] = newRepo;
                } else if ( newRepo.stargazers_count < oldRepo.stargazers_count ) {
                    trendingDown[newRepo.id] = newRepo;
                }
            }

        });
        //update our state trendingUp and trendingDown
        this.setState({trendingUp: trendingUp, trendingDown: trendingDown});

    }

    /**
     * http://facebook.github.io/react/docs/component-specs.html
     * The render() method is required.
     When called, it should examine this.props and this.state and return a single child component.
     This child component can be either a virtual representation of a native DOM component (such as <div />
     or React.DOM.div()) or another composite component that you've defined yourself. You can also return null or
     false to indicate that you don't want anything rendered. Behind the scenes, React renders a <noscript> tag to
     work with our current diffing algorithm. When returning null or false, React.findDOMNode(this) will return null.
     The render() function should be pure, meaning that it does not modify component state, it returns the same result
     each time it's invoked, and it does not read from or write to the DOM or otherwise interact with the browser
     (e.g., by using setTimeout). If you need to interact with the browser, perform your work in componentDidMount()
     or the other lifecycle methods instead. Keeping render() pure makes server rendering more practical and makes
     components easier to think about.
     * @returns {XML}
     */
    render() {
        //create our repo elements
        const repos = this.props.repos.map(( r, idx ) => {
            //are we trending in a direction?
            let trendingUp = this.state.trendingUp[r.id] !== undefined
                , trendingDown = this.state.trendingDown[r.id] !== undefined;

            return <RepoListItem id={idx} key={idx} repo={r} trendingUp={trendingUp} trendingDown={trendingDown}/>;

        });

        return (
            <div {...this.props} className={this.props.className + " repo-list"}>
                <h1>ReactJS
                    <small> {this.props.repos.length} repositories</small>
                </h1>
                <ul className="media-list">
                    {repos}
                </ul>
            </div>
        );
    }

}<commit_msg>removed un-needed prop<commit_after>'use strict';
import React from "react";
import RepoListItem from "./repo_list_item"

/**
 * The RepoList is a list of GitHub repositories
 */
export default
class RepoList extends React.Component {
    constructor( props ) {
        super(props);
    }

    /**
     * http://facebook.github.io/react/docs/component-specs.html#updating-componentwillreceiveprops
     * Invoked when a component is receiving new props. This method is not called for the initial render.
     Use this as an opportunity to react to a prop transition before render() is called by updating the state using
     this.setState(). The old props can be accessed via this.props. Calling this.setState() within this function will
     not trigger an additional render.
     */
    componentWillReceiveProps( nextProps ) {
        const trendingUp = {};
        const trendingDown = {};

        //this is not efficient, but an example
        nextProps.repos.forEach(( newRepo ) => {
            //find the matching old repo
            let oldRepo = this.props.repos.filter(r => {
                return r.id === newRepo.id;
            })[0];
            //if found, compare the current star count against the old count
            if ( oldRepo ) {
                if ( newRepo.stargazers_count > oldRepo.stargazers_count ) {
                    trendingUp[newRepo.id] = newRepo;
                } else if ( newRepo.stargazers_count < oldRepo.stargazers_count ) {
                    trendingDown[newRepo.id] = newRepo;
                }
            }

        });
        //update our state trendingUp and trendingDown
        this.setState({trendingUp: trendingUp, trendingDown: trendingDown});

    }

    /**
     * http://facebook.github.io/react/docs/component-specs.html
     * The render() method is required.
     When called, it should examine this.props and this.state and return a single child component.
     This child component can be either a virtual representation of a native DOM component (such as <div />
     or React.DOM.div()) or another composite component that you've defined yourself. You can also return null or
     false to indicate that you don't want anything rendered. Behind the scenes, React renders a <noscript> tag to
     work with our current diffing algorithm. When returning null or false, React.findDOMNode(this) will return null.
     The render() function should be pure, meaning that it does not modify component state, it returns the same result
     each time it's invoked, and it does not read from or write to the DOM or otherwise interact with the browser
     (e.g., by using setTimeout). If you need to interact with the browser, perform your work in componentDidMount()
     or the other lifecycle methods instead. Keeping render() pure makes server rendering more practical and makes
     components easier to think about.
     * @returns {XML}
     */
    render() {
        //create our repo elements
        const repos = this.props.repos.map(( r, idx ) => {
            //are we trending in a direction?
            let trendingUp = this.state.trendingUp[r.id] !== undefined
                , trendingDown = this.state.trendingDown[r.id] !== undefined;

            //using the IDX as the key is important here, as we are tracking by their position in the set
            return <RepoListItem key={idx} repo={r} trendingUp={trendingUp} trendingDown={trendingDown}/>;

        });

        return (
            <div {...this.props} className={this.props.className + " repo-list"}>
                <h1>ReactJS
                    <small> {this.props.repos.length} repositories</small>
                </h1>
                <ul className="media-list">
                    {repos}
                </ul>
            </div>
        );
    }

}
{'fraction_non_alphanumeric': 0.08835287846481876, 'fraction_numerical': 0.0007995735607675906, 'mean_word_length': 2.2715780296425456, 'pattern_counts': {'":': 0, '<': 27, '<?xml version=': 0, '>': 33, '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': '1331729', 'n_tokens_mistral': 1982, 'n_tokens_neox': 1942, 'n_words': 734}