<commit_before>import React, { Component } from 'react';
import { Sigil } from '/components/lib/icons/sigil';
import { ProfileOverlay } from '/components/lib/profile-overlay';
import { OverlaySigil } from '/components/lib/overlay-sigil';
import classnames from 'classnames';
import { Route, Link } from 'react-router-dom'
import { uxToHex, cite, writeText } from '/lib/util';
import urbitOb from 'urbit-ob';
import moment from 'moment';
import _ from 'lodash';
import ReactMarkdown from 'react-markdown';
import RemarkDisableTokenizers from 'remark-disable-tokenizers';

const DISABLED_BLOCK_TOKENS = [
  'indentedCode',
  'blockquote',
  'atxHeading',
  'thematicBreak',
  'list',
  'setextHeading',
  'html',
  'definition',
  'table',
];

const DISABLED_INLINE_TOKENS = [
  'autoLink',
  'url',
  'email',
  'link',
  'reference'
];

const MessageMarkdown = React.memo(
  props => (<ReactMarkdown
              {...props}
              plugins={[[RemarkDisableTokenizers, { block: DISABLED_BLOCK_TOKENS, inline: DISABLED_INLINE_TOKENS }]]}
            />));

export class Message extends Component {
  constructor() {
    super();
    this.state = {
      unfold: false,
      copied: false,
    };
    this.unFoldEmbed = this.unFoldEmbed.bind(this);
  }

  unFoldEmbed(id) {
    let unfoldState = this.state.unfold;
    unfoldState = !unfoldState;
    this.setState({unfold: unfoldState});
    let iframe = this.refs.iframe;
    iframe.setAttribute('src', iframe.getAttribute('data-src'));
  }


  renderContent() {
    const { props } = this;
    let letter = props.msg.letter;

    if ('code' in letter) {
      let outputElement =
        (!!letter.code.output &&
         letter.code.output.length && letter.code.output.length > 0) ?
        (
          <pre className="f7 clamp-attachment pa1 mt0 mb0 b--gray4 b--gray1-d bl br bb">
            {letter.code.output[0].join('\n')}
          </pre>
        ) : null;
      return (
        <div className="mv2">
          <pre className="f7 clamp-attachment pa1 mt0 mb0 bg-light-gray b--gray4 b--gray1-d ba">
            {letter.code.expression}
          </pre>
          {outputElement}
        </div>
      );
    } else if ('url' in letter) {
      let imgMatch =
        /(jpg|img|png|gif|tiff|jpeg|JPG|IMG|PNG|TIFF|GIF|webp|WEBP|webm|WEBM)$/
        .exec(letter.url);
      let youTubeRegex = new RegExp(''
      + /(?:https?:\/\/(?:[a-z]+.)?)/.source // protocol
      + /(?:youtu\.?be(?:\.com)?\/)(?:embed\/)?/.source // short and long-links
      + /(?:(?:(?:(?:watch\?)?(?:time_continue=(?:[0-9]+))?.+v=)?([a-zA-Z0-9_-]+))(?:\?t\=(?:[0-9a-zA-Z]+))?)/.source // id
      )
      let ytMatch =
      youTubeRegex.exec(letter.url);<commit_msg>Add SVG.<commit_after>import React, { Component } from 'react';
import { Sigil } from '/components/lib/icons/sigil';
import { ProfileOverlay } from '/components/lib/profile-overlay';
import { OverlaySigil } from '/components/lib/overlay-sigil';
import classnames from 'classnames';
import { Route, Link } from 'react-router-dom'
import { uxToHex, cite, writeText } from '/lib/util';
import urbitOb from 'urbit-ob';
import moment from 'moment';
import _ from 'lodash';
import ReactMarkdown from 'react-markdown';
import RemarkDisableTokenizers from 'remark-disable-tokenizers';

const DISABLED_BLOCK_TOKENS = [
  'indentedCode',
  'blockquote',
  'atxHeading',
  'thematicBreak',
  'list',
  'setextHeading',
  'html',
  'definition',
  'table',
];

const DISABLED_INLINE_TOKENS = [
  'autoLink',
  'url',
  'email',
  'link',
  'reference'
];

const MessageMarkdown = React.memo(
  props => (<ReactMarkdown
              {...props}
              plugins={[[RemarkDisableTokenizers, { block: DISABLED_BLOCK_TOKENS, inline: DISABLED_INLINE_TOKENS }]]}
            />));

export class Message extends Component {
  constructor() {
    super();
    this.state = {
      unfold: false,
      copied: false,
    };
    this.unFoldEmbed = this.unFoldEmbed.bind(this);
  }

  unFoldEmbed(id) {
    let unfoldState = this.state.unfold;
    unfoldState = !unfoldState;
    this.setState({unfold: unfoldState});
    let iframe = this.refs.iframe;
    iframe.setAttribute('src', iframe.getAttribute('data-src'));
  }


  renderContent() {
    const { props } = this;
    let letter = props.msg.letter;

    if ('code' in letter) {
      let outputElement =
        (!!letter.code.output &&
         letter.code.output.length && letter.code.output.length > 0) ?
        (
          <pre className="f7 clamp-attachment pa1 mt0 mb0 b--gray4 b--gray1-d bl br bb">
            {letter.code.output[0].join('\n')}
          </pre>
        ) : null;
      return (
        <div className="mv2">
          <pre className="f7 clamp-attachment pa1 mt0 mb0 bg-light-gray b--gray4 b--gray1-d ba">
            {letter.code.expression}
          </pre>
          {outputElement}
        </div>
      );
    } else if ('url' in letter) {
      let imgMatch =
        /(jpg|img|png|gif|tiff|jpeg|JPG|IMG|PNG|TIFF|GIF|webp|WEBP|webm|WEBM|svg|SVG)$/
        .exec(letter.url);
      let youTubeRegex = new RegExp(''
      + /(?:https?:\/\/(?:[a-z]+.)?)/.source // protocol
      + /(?:youtu\.?be(?:\.com)?\/)(?:embed\/)?/.source // short and long-links
      + /(?:(?:(?:(?:watch\?)?(?:time_continue=(?:[0-9]+))?.+v=)?([a-zA-Z0-9_-]+))(?:\?t\=(?:[0-9a-zA-Z]+))?)/.source // id
      )
      let ytMatch =
      youTubeRegex.exec(letter.url);
{'fraction_non_alphanumeric': 0.1774044674173897, 'fraction_numerical': 0.007753369023444711, 'mean_word_length': 2.77035490605428, 'pattern_counts': {'":': 0, '<': 17, '<?xml version=': 0, '>': 21, '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': '7481772', 'n_tokens_mistral': 1910, 'n_tokens_neox': 1865, 'n_words': 358}