<commit_before>var React = require('react');
var _ = require('lodash');
var ReactPropTypes = React.PropTypes;
var PillSelector = require('./PillSelector.react');
var QBerModal = require('./QBerModal.react');
var Caret = require('./Caret.react');

function findByURI(source, uri) {
    return source.filter(function( obj ) {
        return obj.uri === uri;
    })[ 0 ];
}


var CodeDefinitionTable = React.createClass({

  // This React class only works if a list of 'codes' is passed through its properties.
  propTypes: {
    codes: ReactPropTypes.array.isRequired
  },

  getInitialState: function() {
    return {
      'visible': true,
      'modal_visible': false,
      'selected_code_value': undefined,
      'selected_code_uri': undefined
    };
  },

  /**
   * @return {object}
   */
  render: function() {
    // This section should be hidden by default
    // and shown when we do have variables in our dataset
    if (this.props.codes === undefined || this.props.codes.length < 1) {
      return null;
    }

    var table;
    if (this.state.visible) {
      var codes = this.props.codes;
      var codes_rows = [];
      var button_disabled = (this.props.dimension && this.props.dimension.codelist) ? false: true;

      for (var key in codes) {

        codes_rows.push(<tr key={codes[key].id}>
                          <td>
                            { codes[key].id }
                          </td>
                          <td>
                            <span className='btn btn-default btn-xs'
                                  value={codes[key].id}
                                  onClick={this._handleToggleModal}
                                  disabled={button_disabled}>
                                  <span className="glyphicon glyphicon-random"/>
                            </span>
                          </td>
                          <td width="100%">
                            <span className='badge pull-right'> { codes[key].count }</span>
                          </td>
                        </tr>);
      }

      var modal;<commit_msg>Linking variable value to mapped URI on brwsr instance located at data.clariah-sdh.eculture.labs.vu.nl if mapping is present<commit_after>var React = require('react');
var _ = require('lodash');
var ReactPropTypes = React.PropTypes;
var PillSelector = require('./PillSelector.react');
var QBerModal = require('./QBerModal.react');
var Caret = require('./Caret.react');

function findByURI(source, uri) {
    return source.filter(function( obj ) {
        return obj.uri === uri;
    })[ 0 ];
}


var CodeDefinitionTable = React.createClass({

  // This React class only works if a list of 'codes' is passed through its properties.
  propTypes: {
    codes: ReactPropTypes.array.isRequired
  },

  getInitialState: function() {
    return {
      'visible': true,
      'modal_visible': false,
      'selected_code_value': undefined,
      'selected_code_uri': undefined
    };
  },

  /**
   * @return {object}
   */
  render: function() {
    // This section should be hidden by default
    // and shown when we do have variables in our dataset
    if (this.props.codes === undefined || this.props.codes.length < 1) {
      return null;
    }

    var table;
    if (this.state.visible) {
      var codes = this.props.codes;
      var codes_rows = [];
      var button_disabled = (this.props.dimension && this.props.dimension.codelist) ? false: true;

      for (var key in codes) {
        var mapped_uri = this.props.dimension.codelist.mappings[codes[key].id];
        var mapped_uri_icon;
        if (mapped_uri){
          mapped_uri_icon = <span className="glyphicon glyphicon-link"/>;
        }
        var browse_mapped_uri;
        if (mapped_uri){
          browse_mapped_uri = "http://data.clariah-sdh.eculture.labs.vu.nl/browse?uri="+encodeURIComponent(mapped_uri);
        }
        codes_rows.push(<tr key={codes[key].id}>
                          <td>
                            { codes[key].id }
                          </td>
                          <td>
                            <span className='btn btn-default btn-xs'
                                  value={codes[key].id}
                                  onClick={this._handleToggleModal}
                                  disabled={button_disabled}>
                                  <span className="glyphicon glyphicon-random"/>
                            </span>
                          </td>
                          <td width="100%">
                            {mapped_uri_icon}
                            <a className='small' target="_blank" href={browse_mapped_uri}>
                              {mapped_uri}
                            </a>
                          </td>
                          <td>
                            <span className='badge pull-right'> { codes[key].count }</span>
                          </td>
                        </tr>);
      }

      var modal;
{'fraction_non_alphanumeric': 0.11741053478086047, 'fraction_numerical': 0.002010454362685967, 'mean_word_length': 1.5512820512820513, 'pattern_counts': {'":': 0, '<': 36, '<?xml version=': 0, '>': 34, 'https://': 0, 'lorem ipsum': 0, 'www.': 0, 'xml': 0}, 'pii_count': 0, 'substrings_counts': 0, 'word_list_counts': {'cursed_substrings.json': 8, 'profanity_word_list.json': 0, 'sexual_word_list.json': 0, 'zh_pornsignals.json': 0}}
{'dir': 'git-commits-cleaned', 'id': '6199694', 'n_tokens_mistral': 1375, 'n_tokens_neox': 1321, 'n_words': 312}