<commit_before>import React from "react"
import request from "../helpers/request.js"

export default class Repos extends React.Component{
  constructor(props){
    super(props)
    this.state={packages:[]}
  }
  componentDidMount(){
    request.getJSON(`/api/repos/${this.props.routeParams.name}/packages`).then((r)=>{
      console.log(r);
      var packages = r.reduce((els,str)=>{
        var infos = str.split(" ");
        var name = infos[1];
        var arch = infos[0].slice(1);
        var version = infos[2];
        console.log("els : ",els)
        if(!els[name]){
          els[name] = [];
        }
        els[name].push({arch:arch,version:version});
        return els;
      },{});
      this.setState({packages:packages});
    });
  }
  buildList(pack,component){
    var elems = pack.map((p)=>{
      return (<li>{p[component]}</li>)
    });
    return (<ul style={{listStyle:"none",paddingLeft:"0px",textAlign:"center"}}>{elems}</ul>)
  }
  render(){

    var p = Object.keys(this.state.packages).map((name,index)=>{
      var pack = this.state.packages[name];
      var archs = this.buildList(pack,"arch")
      var versions = this.buildList(pack,"version")
      return (<tr key={index} className="package-line">
          <td className="mdl-data-table__cell--non-numeric">{archs}</td>
          <td className="mdl-data-table__cell--non-numeric">{name}</td>
          <td className="mdl-data-table__cell--non-numeric">{versions}</td>
      </tr>)
    })
    return (<div>
      <h1>{this.props.routeParams.name}</h1>
      <table className="mdl-data-table mdl-js-data-table mdl-shadow--2dp"><commit_msg>style improvement on packages lists<commit_after>import React from "react"
import request from "../helpers/request.js"

export default class Repos extends React.Component{
  constructor(props){
    super(props)
    this.state={packages:[]}
  }
  componentDidMount(){
    request.getJSON(`/api/repos/${this.props.routeParams.name}/packages`).then((r)=>{
      console.log(r);
      var packages = r.reduce((els,str)=>{
        var infos = str.split(" ");
        var name = infos[1];
        var arch = infos[0].slice(1);
        var version = infos[2];
        console.log("els : ",els)
        if(!els[name]){
          els[name] = [];
        }
        els[name].push({arch:arch,version:version});
        return els;
      },{});
      this.setState({packages:packages});
    });
  }
  lineStyle(){
    return {padding:"6px 18px 6px 18px",height:"auto"}
  }
  buildList(pack,index,name){
    return (<tr key={index} style={{height:"auto"}} className="package-line">
        <td style={this.lineStyle()} className="mdl-data-table__cell--non-numeric">{pack.arch}</td>
        <td style={this.lineStyle()} className="mdl-data-table__cell--non-numeric">{name}</td>
        <td style={this.lineStyle()} className="mdl-data-table__cell--non-numeric">{pack.version}</td>
    </tr>)
  }
  render(){
    var index = 0;
    var p = Object.keys(this.state.packages).reduce((elements,name)=>{
      var pack = this.state.packages[name];
      for(let i=0;i<pack.length;i++){
        elements.push(this.buildList(pack[i],index,(i==0)?name:""));
        index++;
      }
      return elements;
    },[])
    return (<div>
      <h1>{this.props.routeParams.name}</h1>
      <table className="mdl-data-table mdl-js-data-table mdl-shadow--2dp">
{'fraction_non_alphanumeric': 0.19195230998509688, 'fraction_numerical': 0.007153502235469449, 'mean_word_length': 3.009557945041816, 'pattern_counts': {'":': 0, '<': 32, '<?xml version=': 0, '>': 38, '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': '7214746', 'n_tokens_mistral': 1108, 'n_tokens_neox': 1095, 'n_words': 174}