<commit_before>/*** @jsx React.DOM */

var React = require("react");
var Router = require("react-router");

var api = require("../api");
var Count = require("../components/count");
var GroupState = require("../mixins/groupState");
var LoadingError = require("../components/loadingError");
var LoadingIndicator = require("../components/loadingIndicator");
var PropTypes = require("../proptypes");

var GroupTagValues = React.createClass({
  mixins: [GroupState, Router.State],

  getInitialState() {
    return {
      tagKey: null,
      tagValueList: null,
      loading: true,
      error: false
    };
  },

  componentWillMount() {
    this.fetchData();
  },

  fetchData() {
    var params = this.getParams();

    this.setState({
      loading: true,
      error: false
    });

    api.request('/groups/' + this.getGroup().id + '/tags/' + this.getParams().tagKey + '/', {
      success: (data) => {
        this.setState({
          tagKey: data,
          loading: this.state.tagValueList === null
        });
      },
      error: (error) => {
        this.setState({
          error: true,
          loading: false
        });
      }
    });

    api.request('/groups/' + this.getGroup().id + '/tags/' + this.getParams().tagKey + '/values/', {
      success: (data) => {
        this.setState({
          tagValueList: data,
          loading: this.state.tagKey === null
        });
      },
      error: (error) => {
        this.setState({
          error: true,
          loading: false
        });
      }
    });
  },

  render() {
    if (this.state.loading) {
      return <LoadingIndicator />;
    } else if (this.state.error) {
      return <LoadingError onRetry={this.fetchData} />;
    }

    var tagKey = this.state.tagKey;
    var children = this.state.tagValueList.map((tagValue, tagValueIdx) => {
      var pct = parseInt(tagValue.count / tagKey.totalValues * 100, 10);
      return (
        <li key={tagValueIdx}>
          <a className="tag-bar" href="">
            <span className="tag-bar-background" style={{width: pct + '%'}}></span>
            <span className="tag-bar-label">{tagValue.value}</span>
            <span className="tag-bar-count"><Count value={tagValue.count} /></span>
          </a>
        </li>
      );
    });

    return (
      <div className="box">
        <div className="box-content with-padding">
          <div className="page-header">
            <span className="pull-right">
              <a href="">More Details</a>
            </span>
            <h5>{tagKey.name} <small><Count value={tagKey.totalValues} /></small></h5>
          </div>

          <ul className="list-unstyled">
            {children}
          </ul>
        </div>
      </div>
    );
  }
});

module.exports = GroupTagValues;
<commit_msg>Add paginator to group tag values<commit_after>/*** @jsx React.DOM */

var $ = require("jquery");
var React = require("react");
var Router = require("react-router");

var api = require("../api");
var Count = require("../components/count");
var GroupState = require("../mixins/groupState");
var LoadingError = require("../components/loadingError");
var LoadingIndicator = require("../components/loadingIndicator");
var Pagination = require("../components/pagination");
var PropTypes = require("../proptypes");

var GroupTagValues = React.createClass({
  mixins: [GroupState, Router.Navigation, Router.State],

  getInitialState() {
    return {
      tagKey: null,
      tagValueList: null,
      loading: true,
      error: false,
      pageLinks: ''
    };
  },

  componentWillMount() {
    this.fetchData();
  },

  fetchData() {
    var params = this.getParams();
    var queryParams = this.getQuery();
    var querystring = $.param(queryParams);

    this.setState({
      loading: true,
      error: false
    });

    api.request('/groups/' + this.getGroup().id + '/tags/' + this.getParams().tagKey + '/', {
      success: (data) => {
        this.setState({
          tagKey: data,
          loading: this.state.tagValueList === null
        });
      },
      error: (error) => {
        this.setState({
          error: true,
          loading: false
        });
      }
    });

    api.request('/groups/' + this.getGroup().id + '/tags/' + this.getParams().tagKey + '/values/?' + querystring, {
      success: (data, _, jqXHR) => {
        this.setState({
          tagValueList: data,
          loading: this.state.tagKey === null,
          pageLinks: jqXHR.getResponseHeader('Link')
        });
      },
      error: (error) => {
        this.setState({
          error: true,
          loading: false
        });
      }
    });
  },

  onPage(cursor) {
    var queryParams = this.getQuery();
    queryParams.cursor = cursor;

    this.transitionTo('groupTagValues', this.getParams(), queryParams);
  },

  render() {
    if (this.state.loading) {
      return <LoadingIndicator />;
    } else if (this.state.error) {
      return <LoadingError onRetry={this.fetchData} />;
    }

    var tagKey = this.state.tagKey;
    var children = this.state.tagValueList.map((tagValue, tagValueIdx) => {
      var pct = parseInt(tagValue.count / tagKey.totalValues * 100, 10);
      return (
        <li key={tagValueIdx}>
          <a className="tag-bar" href="">
            <span className="tag-bar-background" style={{width: pct + '%'}}></span>
            <span className="tag-bar-label">{tagValue.value}</span>
            <span className="tag-bar-count"><Count value={tagValue.count} /></span>
          </a>
        </li>
      );
    });

    return (
      <div className="box">
        <div className="box-content with-padding">
          <div className="page-header">
            <span className="pull-right">
              <a href="">More Details</a>
            </span>
            <h5>{tagKey.name} <small><Count value={tagKey.totalValues} /></small></h5>
          </div>

          <ul className="list-unstyled">
            {children}
          </ul>

          <Pagination pageLinks={this.state.pageLinks} onPage={this.onPage} />
        </div>
      </div>
    );
  }
});

module.exports = GroupTagValues;

{'fraction_non_alphanumeric': 0.17177009988537745, 'fraction_numerical': 0.002292451285410185, 'mean_word_length': 2.1598551474392136, 'pattern_counts': {'":': 0, '<': 64, '<?xml version=': 0, '>': 74, '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': '4887991', 'n_tokens_mistral': 1856, 'n_tokens_neox': 1834, 'n_words': 360}