<commit_before>import React from 'react';
import createReactClass from 'create-react-class';
import PropTypes from 'prop-types';

const SalesforceMediaButtons = createReactClass({
  displayName: 'SalesforceMediaButtons',

  propTypes: {
    article: PropTypes.object,
    course: PropTypes.object,
    editors: PropTypes.array,
    before_rev_id: PropTypes.number,
    after_rev_id: PropTypes.number
  },

  render() {
    const salesforceMediaUrlRoot = '/salesforce/create_media?';
    const courseParam = `course_id=${this.props.course.id}`;
    const articleParam = `&article_id=${this.props.article.id}`;
    const diffParams = `&before_rev_id=${this.props.before_rev_id}&after_rev_id=${this.props.after_rev_id}`;
    const urlWithoutUsername = salesforceMediaUrlRoot + courseParam + articleParam + diffParams;

    const salesforceButtons = this.props.editors.map(username => {
      const usernameParam = `&username=${username}`;
      const completeUrl = urlWithoutUsername + usernameParam;
      return (
        <a href={completeUrl} target="_blank" className="button dark small" key={`salesforce-media-${username}`}>
          {username}
        </a>
      );
    });

    return (
      <div>
        <p>
          Create a new Salesforce &quot;Media&quot; record for this article, credited to:
        </p>
        {salesforceButtons}
      </div>
    );
  }
});
<commit_msg>Convert SalesForceMediaButtons class component to a stateless functional component (#1522)<commit_after>import React from 'react';
import PropTypes from 'prop-types';

const SalesforceMediaButtons = ({
  article,
  course,
  editors,
  before_rev_id,
  after_rev_id
}) => {
  const salesforceMediaUrlRoot = '/salesforce/create_media?';
  const courseParam = `course_id=${course.id}`;
  const articleParam = `&article_id=${article.id}`;
  // eslint-disable-next-line
  const diffParams = `&before_rev_id=${before_rev_id}&after_rev_id=${after_rev_id}`;
  const urlWithoutUsername = salesforceMediaUrlRoot + courseParam + articleParam + diffParams;

  const salesforceButtons = editors.map(username => {
    const usernameParam = `&username=${username}`;
    const completeUrl = urlWithoutUsername + usernameParam;
    return (
      <a
        href={completeUrl}
        target="_blank"
        className="button dark small"
        key={`salesforce-media-${username}`}
      >
        {username}
      </a>
    );
  });

  return (
    <div>
      <p>
        Create a new Salesforce &quot;Media&quot; record for this article, credited to:
      </p>
      {salesforceButtons}
    </div>
  );
};

SalesforceMediaButtons.propTypes = {
  article: PropTypes.object,
  course: PropTypes.object,
  editors: PropTypes.array,
  before_rev_id: PropTypes.number,
  after_rev_id: PropTypes.number
};

{'fraction_non_alphanumeric': 0.12247838616714697, 'fraction_numerical': 0.001440922190201729, 'mean_word_length': 3.6283333333333334, 'pattern_counts': {'":': 0, '<': 15, '<?xml version=': 0, '>': 18, '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': '1566594', 'n_tokens_mistral': 841, 'n_tokens_neox': 852, 'n_words': 175}