<commit_before>import React, { Component } from 'react';
import { Link } from 'react-router';
import { map, find } from 'lodash';
import classNames from 'classnames';

function getStyles(color, isActive, isDoubleColor) {
  return  {
    background: isDoubleColor ? `linear-gradient(to right, ${color[0]} 0%, ${color[0]} 50%, ${color[1]} 50%, ${color[1]} 100%)` : undefined,
    backgroundColor: isDoubleColor ? undefined : color[1],
    borderColor: isActive ? typeof color[2] === 'string' ? color[2] : color[color[2]] : undefined
  };
}

const doubleColors = [
  {id: 'black_pink', colors: ['#36516e', '#f93b58', 0]},
  {id: 'pink_black', colors: ['#f93b58', '#36516e', 1]},
  {id: 'white_blue', colors: ['#45c0e9', '#efefef', 0]},
  {id: 'blue_white', colors: ['#45c0e9', '#efefef', 1]},
  {id: 'beige_black', colors: ['#eadaca', '#433947', 1]},
  {id: 'black_white', colors: ['#433947', '#efefef', 0]}
];

const ColorPicker = ({ colors, current: { asset, type, color }, urlPrefix, onClick }) => {
  if (Object.keys(colors).length < 2) return <div />;

  return (
    <div className="colorPicker">
      {map(colors, colorItem => {
        const isActive = color === colorItem.id;
        const className = classNames('color', colorItem.id, {
          active: isActive
        });

        const isEyes = asset === 'Eyes';
        const isSpecialType = ! colorItem.id.indexOf('brown_') && type !== '03';
        const isDoubleColor = colorItem.id.indexOf('_') !== -1;

        const file = colorItem.files[0];
        const color1 = isEyes ? isSpecialType ? file.svgColors[2] : file.svgColors[2] : file.svgColors[0];
        const color2 = isEyes ? isSpecialType ? file.svgColors[3] : file.svgColors[5] : file.svgColors[1];
        const borderColor = file.svgColors[file.svgColors.length - 1];

        const finded = find(doubleColors, {id: colorItem.id});
        const colors = finded ? finded.colors : [color1, color2, borderColor];
        const style  = getStyles(colors, isActive, isDoubleColor);

        return (
          <Link key={colorItem.id}
            to={`${urlPrefix}${colorItem.id}`}
            style={style}
            className={className} activeClassName="active"
            onClick={() => onClick(colorItem.id)}
          />
        );
      })}
    </div>
  );<commit_msg>english is my native language<commit_after>import React, { Component } from 'react';
import { Link } from 'react-router';
import { map, find } from 'lodash';
import classNames from 'classnames';

function getStyles(color, isActive, isDoubleColor) {
  return  {
    background: isDoubleColor ? `linear-gradient(to right, ${color[0]} 0%, ${color[0]} 50%, ${color[1]} 50%, ${color[1]} 100%)` : undefined,
    backgroundColor: isDoubleColor ? undefined : color[1],
    borderColor: isActive ? typeof color[2] === 'string' ? color[2] : color[color[2]] : undefined
  };
}

const doubleColors = [
  {id: 'black_pink', colors: ['#36516e', '#f93b58', 0]},
  {id: 'pink_black', colors: ['#f93b58', '#36516e', 1]},
  {id: 'white_blue', colors: ['#45c0e9', '#efefef', 0]},
  {id: 'blue_white', colors: ['#45c0e9', '#efefef', 1]},
  {id: 'beige_black', colors: ['#eadaca', '#433947', 1]},
  {id: 'black_white', colors: ['#433947', '#efefef', 0]}
];

const ColorPicker = ({ colors, current: { asset, type, color }, urlPrefix, onClick }) => {
  if (Object.keys(colors).length < 2) return <div />;

  return (
    <div className="colorPicker">
      {map(colors, colorItem => {
        const isActive = color === colorItem.id;
        const className = classNames('color', colorItem.id, {
          active: isActive
        });

        const isEyes = asset === 'Eyes';
        const isSpecialType = ! colorItem.id.indexOf('brown_') && type !== '03';
        const isDoubleColor = colorItem.id.indexOf('_') !== -1;

        const file = colorItem.files[0];
        const color1 = isEyes ? isSpecialType ? file.svgColors[2] : file.svgColors[2] : file.svgColors[0];
        const color2 = isEyes ? isSpecialType ? file.svgColors[3] : file.svgColors[5] : file.svgColors[1];
        const borderColor = file.svgColors[file.svgColors.length - 1];

        const found = find(doubleColors, {id: colorItem.id});
        const colors = found ? found.colors : [color1, color2, borderColor];
        const style  = getStyles(colors, isActive, isDoubleColor);

        return (
          <Link key={colorItem.id}
            to={`${urlPrefix}${colorItem.id}`}
            style={style}
            className={className} activeClassName="active"
            onClick={() => onClick(colorItem.id)}
          />
        );
      })}
    </div>
  );
{'fraction_non_alphanumeric': 0.1787491884873404, 'fraction_numerical': 0.032893313135684915, 'mean_word_length': 3.2756706753006477, 'pattern_counts': {'":': 0, '<': 13, '<?xml version=': 0, '>': 17, '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': '2871396', 'n_tokens_mistral': 1587, 'n_tokens_neox': 1524, 'n_words': 356}