<commit_before>import React from 'react';
import { CopyToClipboard } from 'react-copy-to-clipboard';
import moment from 'moment';
import Environment from '../EnvironmentTeaser';
import { bp, color, fontSize } from '../../variables';
import giturlparse from 'git-url-parse';

class Project extends React.Component {
  constructor(props) {
    super(props);

    const gitUrlParsed = giturlparse(this.props.project.gitUrl);
    const gitLink = `${gitUrlParsed.resource}/${gitUrlParsed.full_name}`;

    this.state = {
      project: [],
      gitUrl: this.props.project.gitUrl,
      copied: false,
      gitLinkWithScheme: `https://${gitLink}`,
      gitLink: gitLink,
    };
  }

  render() {
    return (
      <div className='content-wrapper'>
        <div className='details'>
          <div className='field-wrapper created'>
            <div>
              <label>Created</label>
              <div className='field'>{moment.utc(this.props.project.created).local().format('DD MMM YYYY, HH:mm:ss')}
              </div>
            </div>
          </div>
          <div className='field-wrapper origin'>
            <div>
              <label>Origin</label>
              <div className='field'><a className='hover-state' target="_blank" href={this.state.gitLinkWithScheme}>{this.state.gitLink}</a></div>
            </div>
          </div>
          <div className='field-wrapper giturl'>
            <div>
              <label>Git URL</label>
              <div className='field'>
                {this.props.project.gitUrl}
              </div>
              <span className='copied' style={this.state.copied ? {top: '4px', opacity: '0'} : null}>Copied</span>
              <CopyToClipboard text={this.state.gitUrl} onCopy={() => {
                  this.setState({copied: true});
                  setTimeout(function(){
                     this.setState({copied:false});
                  }.bind(this),750);
                }
              }>
                <span className='copy'></span>
              </CopyToClipboard>
            </div>
          </div>
          <div className='field-wrapper branches'>
            <div>
              <label>Branches enabled</label>
              <div className='field'>{this.props.project.branches}</div>
            </div>
          </div>
          <div className='field-wrapper prs'>
            <div>
              <label>Pull requests enabled</label>
              <div className='field'>{this.props.project.pullrequests}</div>
            </div>
          </div>
        </div>
        <div className="environments-wrapper">
          <h3>Environments</h3>
          <div className="environments">
            {!this.props.project.environments.length && `No Environments`}
            {this.props.project.environments.map(environment =>
              <Environment
                key={environment.id}
                environment={environment}
                project={this.props.project.name}
              />)
              .sort((a, b) => {
                const environmentTypes = {
                  production: 1,
                  development: 2,<commit_msg>add a field for the environment count.<commit_after>import React from 'react';
import { CopyToClipboard } from 'react-copy-to-clipboard';
import moment from 'moment';
import Environment from '../EnvironmentTeaser';
import { bp, color, fontSize } from '../../variables';
import giturlparse from 'git-url-parse';

class Project extends React.Component {
  constructor(props) {
    super(props);

    const gitUrlParsed = giturlparse(this.props.project.gitUrl);
    const gitLink = `${gitUrlParsed.resource}/${gitUrlParsed.full_name}`;

    this.state = {
      project: [],
      gitUrl: this.props.project.gitUrl,
      copied: false,
      gitLinkWithScheme: `https://${gitLink}`,
      gitLink: gitLink,
    };
  }

  render() {
    return (
      <div className='content-wrapper'>
        <div className='details'>
          <div className='field-wrapper created'>
            <div>
              <label>Created</label>
              <div className='field'>{moment.utc(this.props.project.created).local().format('DD MMM YYYY, HH:mm:ss')}
              </div>
            </div>
          </div>
          <div className='field-wrapper origin'>
            <div>
              <label>Origin</label>
              <div className='field'><a className='hover-state' target="_blank" href={this.state.gitLinkWithScheme}>{this.state.gitLink}</a></div>
            </div>
          </div>
          <div className='field-wrapper giturl'>
            <div>
              <label>Git URL</label>
              <div className='field'>
                {this.props.project.gitUrl}
              </div>
              <span className='copied' style={this.state.copied ? {top: '4px', opacity: '0'} : null}>Copied</span>
              <CopyToClipboard text={this.state.gitUrl} onCopy={() => {
                  this.setState({copied: true});
                  setTimeout(function(){
                     this.setState({copied:false});
                  }.bind(this),750);
                }
              }>
                <span className='copy'></span>
              </CopyToClipboard>
            </div>
          </div>
          <div className='field-wrapper branches'>
            <div>
              <label>Branches enabled</label>
              <div className='field'>{this.props.project.branches}</div>
            </div>
          </div>
          <div className='field-wrapper prs'>
            <div>
              <label>Pull requests enabled</label>
              <div className='field'>{this.props.project.pullrequests}</div>
            </div>
          </div>
        </div>
        <div className='field-wrapper envlimit'>
          <div>
            <label>Non-Production environments in use</label>
            <div className='field'>{this.props.project.environments.length} of {this.props.project.developmentEnvironmentsLimit} </div>
          </div>
        </div>
        <div className="environments-wrapper">
          <h3>Environments</h3>
          <div className="environments">
            {!this.props.project.environments.length && `No Environments`}
            {this.props.project.environments.map(environment =>
              <Environment
                key={environment.id}
                environment={environment}
                project={this.props.project.name}
              />)
              .sort((a, b) => {
                const environmentTypes = {
                  production: 1,
                  development: 2,
{'fraction_non_alphanumeric': 0.14255254340542187, 'fraction_numerical': 0.0027413950654888823, 'mean_word_length': 1.7920918367346939, 'pattern_counts': {'":': 0, '<': 123, '<?xml version=': 0, '>': 129, 'https://': 2, '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': '3006887', 'n_tokens_mistral': 1795, 'n_tokens_neox': 1751, 'n_words': 326}