<commit_before>import * as React from "react";
import { Link } from "react-router";
import { BackArrow } from "./back_arrow";
import { Specimen } from "./interfaces";

interface SpeciesCatalogTileProps {
  specimen: Specimen;
  dispatch: Function;
}

export class SpeciesCatalogTile extends React.Component<SpeciesCatalogTileProps, any> {
  render() {
    let specimen = this.props.specimen;
    let url = "/app/dashboard/designer?p1=SpeciesInfo&id="
      + specimen._id;
    return (
      <div className="plantCatalogTile">
        <div className="small-header-wrapper">
          <label>{ specimen.name }</label>
        </div>
        <div>
          <p>
            <Link to={ url }>
              <img className="crop-drag-info-image" src={ specimen.imgUrl } />
            </Link>
          </p>
        </div>
      </div>
    );
  }
};

export class SpeciesCatalog extends React.Component<any, any> {
  render() {
    // TEMP FIX:
    // let species = this.props.global.species.map(
    let species = [{
      name: "<NAME>", imgUrl: "http://placehold.it/200x150", _id: "123"
    }].map(
      (specimen, k) => <SpeciesCatalogTile specimen={ specimen }
        key={ k }
        dispatch={ this.props.dispatch } />
      );
    return <div className="panel-container green-panel">
      <div className="panel-content">
        <div className="panel-header green-panel">
          <p className="panel-title">
            <BackArrow/> Choose a Species
          </p>
        </div>
        <i className="fa fa-search"></i><commit_msg>Pretty up the species catalog.<commit_after>import * as React from "react";
import { Link } from "react-router";
import { BackArrow } from "./back_arrow";
import { Specimen } from "./interfaces";

interface SpeciesCatalogTileProps {
  specimen: Specimen;
  dispatch: Function;
}

export class SpeciesCatalogTile extends React.Component<SpeciesCatalogTileProps, any> {
  render() {
    let specimen = this.props.specimen;
    let url = "/app/dashboard/designer?p1=SpeciesInfo&id="
      + specimen._id;
    return (
      <div className="plantCatalogTile">
        <div className="small-header-wrapper">
          <label>{ specimen.name }</label>
        </div>
        <div>
          <p>
            <Link to={ url }>
              <img className="crop-drag-info-image" src={ specimen.imgUrl } />
            </Link>
          </p>
        </div>
      </div>
    );
  }
};

export class SpeciesCatalog extends React.Component<any, any> {
  render() {
    // TEMP FIX:
    // let species = this.props.global.species.map(
    let species = [{
      name: "<NAME>", imgUrl: "http://placehold.it/200x150", _id: "123"
    }].map(
      (specimen, k) => <SpeciesCatalogTile specimen={ specimen }
        key={ k }
        dispatch={ this.props.dispatch } />
      );
    return <div className="panel-container green-panel">
      <div className="panel-header green-panel">
        <p className="panel-title">
          <BackArrow/> Choose a Species
        </p>
      </div>
      <div className="panel-content">
        <i className="fa fa-search"></i>
{'fraction_non_alphanumeric': 0.14914267227434488, 'fraction_numerical': 0.006470397929472662, 'mean_word_length': 2.3829321663019694, 'pattern_counts': {'":': 0, '<': 55, '<?xml version=': 0, '>': 57, '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': '6979962', 'n_tokens_mistral': 949, 'n_tokens_neox': 931, 'n_words': 221}