<commit_before>import React from 'react';
import ReactDOM from 'react-dom';



import createPlotlyComponent from 'react-plotlyjs';
// import Plotly from 'plotly.js/dist/plotly.js';
const PlotlyComponent = createPlotlyComponent(Plotly);
function getNextDayDate(date){
    return new Date(date.setDate(date.getDate()+1))
}
class GitHubRepositoryViewsChart extends React.Component{
    constructor(props){
        super(props);
        this.state = {
            id: this.props.name+"-visits"
        };
        this.chartTitle="Visitors";
        this.uniqueLineTitle="unique visitors";
        this.totalLineTitle="visits";
        this.getDateStr = this.getDateStr.bind(this);
        this.getChartValues = this.getChartValues.bind(this);
    }

    getDateStr(date){
        let monthNo = date.getMonth()+1;
        return ((monthNo>=10 ? monthNo : "0"+monthNo)
        +"/"
        +(date.getDate()>=10 ? date.getDate() : "0"+date.getDate()));
    }


    getChartValues(values){
        let dates = values.map(value => new Date(value.timestamp));
        let allValues = values.map(value => {
            return {date: new Date(value.timestamp), count: value.count, uniques: value.uniques}
        });


        const minDate = new Date(Math.min.apply(null,dates));
        const maxDate = new Date(Math.max.apply(null,dates));


        let date = minDate;
        while(date < maxDate){
            if(!dates.find(item => item.getTime()==date.getTime())){
                allValues.push({date: new Date(date), count: 0, uniques: 0})
            }
            date=getNextDayDate(date);
        }
        allValues.sort((val1, val2) => val1.date.getTime()-val2.date.getTime());
        return allValues.map(value => {
            return {date: this.getDateStr(value.date), count: value.count, uniques: value.uniques}
        });
    }

    render(){
        // TODO startDate is max(userRegistrationToHubTrafficDate, 14 days) //14 days cuz this is what github gives us
        let values = this.getChartValues(this.props.values);

        let totalCount = {<commit_msg>charting changes<commit_after>import React from 'react';
import ReactDOM from 'react-dom';



import createPlotlyComponent from 'react-plotlyjs';
// import Plotly from 'plotly.js/dist/plotly.js';
const PlotlyComponent = createPlotlyComponent(Plotly);
function getNthDayDate(date, nthDay){
    return new Date(date.setDate(date.getDate()+nthDay))
}
function getNextDayDate(date){
    return getNthDayDate(date, 1)
}

const GitHubTrafficAPIDays = 14;

class GitHubRepositoryViewsChart extends React.Component{
    constructor(props){
        super(props);
        this.state = {
            id: this.props.name+"-visits"
        };
        this.chartTitle="Visitors";
        this.uniqueLineTitle="unique visitors";
        this.totalLineTitle="visits";
        this.getDateStr = this.getDateStr.bind(this);
        this.getChartValues = this.getChartValues.bind(this);
    }

    getDateStr(date){
        let monthNo = date.getMonth()+1;
        return ((monthNo>=10 ? monthNo : "0"+monthNo)
        +"/"
        +(date.getDate()>=10 ? date.getDate() : "0"+date.getDate()));
    }


    getChartValues(values){
        let dates = values.map(value => new Date(value.timestamp));
        let allValues = values.map(value => {
            return {date: new Date(value.timestamp), count: value.count, uniques: value.uniques}
        });


        const minDate = dates.length ? new Date(Math.min.apply(null,dates)) : new Date();
        const maxDate = dates.length ? new Date(Math.max.apply(null,dates)) : new Date();



        // TODO min(..., userJoinDate)
        const startDate = new Date(
            Math.min(
                minDate ? minDate : new Date(),
                getNthDayDate(new Date(), -GitHubTrafficAPIDays)
            )
        );
        const endDate = new Date(Math.max(maxDate ? maxDate : new Date(), new Date()));

        let date = startDate;
        while(date < endDate){
            if(!dates.find(item => item.toDateString()===date.toDateString())){ // test if date with same day already exists
                allValues.push({date: new Date(date), count: 0, uniques: 0})
            }
            date=getNextDayDate(date);
        }
        allValues.sort((val1, val2) => val1.date.getTime()-val2.date.getTime());
        return allValues.map(value => {
            return {date: this.getDateStr(value.date), count: value.count, uniques: value.uniques}
        });
    }

    render(){
        let values = this.getChartValues(this.props.values);

        let totalCount = {
{'fraction_non_alphanumeric': 0.1374645428758455, 'fraction_numerical': 0.007418721361553567, 'mean_word_length': 2.6066089693154995, 'pattern_counts': {'":': 0, '<': 5, '<?xml version=': 0, '>': 17, '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': '2099306', 'n_tokens_mistral': 1418, 'n_tokens_neox': 1360, 'n_words': 283}