{"size": 1091, "ext": "js", "max_stars_repo_path": "js/views/Legend.js", "max_stars_repo_name": "syt123450/ucsc-xena-client", "max_stars_repo_stars_event_min_datetime": "2019-08-30T13:08:01.000Z", "max_stars_repo_stars_event_max_datetime": "2019-11-06T07:14:20.000Z", "max_issues_repo_path": "js/views/Legend.js", "max_issues_repo_name": "syt123450/ucsc-xena-client", "max_issues_repo_issues_event_min_datetime": null, "max_issues_repo_issues_event_max_datetime": null, "max_forks_repo_path": "js/views/Legend.js", "max_forks_repo_name": "syt123450/ucsc-xena-client", "max_forks_repo_forks_event_min_datetime": null, "max_forks_repo_forks_event_max_datetime": null}
{"max_stars_count": 3, "max_issues_count": null, "max_forks_count": null, "avg_line_length": 26.6097560976, "max_line_length": 82, "alphanum_fraction": 0.6012832264}
'use strict';

var React = require('react');
var _ = require('../underscore_ext');
var colorHelper = require('../color_helper');

// Styles
var compStyles = require('./Legend.module.css');

var nodata = [["null (no data)", "#808080"]];

class Legend extends React.Component {
	static defaultProps = { max: 40 };

	render() {
		var {labels, colors, max, footnotes} = this.props,
			ellipsis = labels.length > max,
			items = _.map(nodata.concat(_.last(_.zip(labels, colors), max)), ([l, c], i) =>
						  <label className={compStyles.label}
							  key={i}
							  title={l}
							  style={{backgroundColor: c,
								  color: colorHelper.contrastColor(c)}}>
							  {l}
						  </label>).reverse(),
			footnotesItems = footnotes ? footnotes.map((text, i) =>
				<div key={i} className={compStyles.footnotes}>
					{text}
				</div>) : null;
		return (
			<div className={compStyles.Legend}>
				{items ? <div className={compStyles.column}>{items}</div> : null}
				{ellipsis ? <div>...</div> : null}
				{footnotes ? footnotesItems : null}
			</div>
		);
	}
}

module.exports = Legend;
