<commit_before>import _ from 'lodash';
import PropTypes from 'prop-types';
import React from 'react';
import styled from 'react-emotion';

import InlineSvg from 'app/components/inlineSvg';
import Tooltip from 'app/components/tooltip';
import {t, tn} from 'app/locale';
import utils from 'app/utils';

const Chunks = styled.span`
  span {
    display: inline;
  }
`;

const Redaction = styled.span`
  background: rgba(255, 0, 0, 0.05);
  cursor: default;
`;

const Placeholder = styled(Redaction)`
  font-style: italic;

  :before {
    content: '<';
  }
  :after {
    content: '>';
  }
`;

const ErrorIcon = styled(InlineSvg)`
  color: ${props => props.theme.redDark};
`;

const REMARKS = {
  a: 'Annotated',
  x: 'Removed',
  s: 'Substitued',
  m: 'Masked',
  p: 'Pseudonymized',
  e: 'Encrypted',
};

function renderChunk(chunk) {
  if (chunk.type === 'redaction') {
    const title = t('%s due to PII rule "%s"', REMARKS[chunk.remark], chunk.rule_id);
    return (
      <Tooltip title={title}>
        <Redaction>{chunk.text}</Redaction>
      </Tooltip>
    );
  }

  return <span>{chunk.text}</span>;
}

function renderChunks(chunks) {
  if (chunks.length === 1) {
    return chunks[0].text;
  }

  const spans = chunks.map((chunk, key) => React.cloneElement(renderChunk(chunk), {key}));<commit_msg>fix(ui): Typo 'Substitued' -> 'Substituted'<commit_after>import _ from 'lodash';
import PropTypes from 'prop-types';
import React from 'react';
import styled from 'react-emotion';

import InlineSvg from 'app/components/inlineSvg';
import Tooltip from 'app/components/tooltip';
import {t, tn} from 'app/locale';
import utils from 'app/utils';

const Chunks = styled.span`
  span {
    display: inline;
  }
`;

const Redaction = styled.span`
  background: rgba(255, 0, 0, 0.05);
  cursor: default;
`;

const Placeholder = styled(Redaction)`
  font-style: italic;

  :before {
    content: '<';
  }
  :after {
    content: '>';
  }
`;

const ErrorIcon = styled(InlineSvg)`
  color: ${props => props.theme.redDark};
`;

const REMARKS = {
  a: 'Annotated',
  x: 'Removed',
  s: 'Substituted',
  m: 'Masked',
  p: 'Pseudonymized',
  e: 'Encrypted',
};

function renderChunk(chunk) {
  if (chunk.type === 'redaction') {
    const title = t('%s due to PII rule "%s"', REMARKS[chunk.remark], chunk.rule_id);
    return (
      <Tooltip title={title}>
        <Redaction>{chunk.text}</Redaction>
      </Tooltip>
    );
  }

  return <span>{chunk.text}</span>;
}

function renderChunks(chunks) {
  if (chunks.length === 1) {
    return chunks[0].text;
  }

  const spans = chunks.map((chunk, key) => React.cloneElement(renderChunk(chunk), {key}));
{'fraction_non_alphanumeric': 0.17063942489595157, 'fraction_numerical': 0.007567158531971245, 'mean_word_length': 3.7553956834532376, 'pattern_counts': {'":': 0, '<': 17, '<?xml version=': 0, '>': 22, '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': '2562350', 'n_tokens_mistral': 979, 'n_tokens_neox': 952, 'n_words': 226}