glitch-soc/mastodon

File emoji_picker_dropdown.jsx has 353 lines of code (exceeds 250 allowed). Consider refactoring.

Open

import PropTypes from 'prop-types';
import { PureComponent } from 'react';

import { defineMessages, injectIntl, FormattedMessage } from 'react-intl';

Function render has 51 lines of code (exceeds 25 allowed). Consider refactoring.

Open

  render () {
    const { loading, style, intl, custom_emojis, skinTone, frequentlyUsedEmojis } = this.props;

    if (loading) {
      return <div style={{ width: 299 }} />;

Function render has 33 lines of code (exceeds 25 allowed). Consider refactoring.

Open

  render () {
    const { intl, onPickEmoji, onSkinTone, skinTone, frequentlyUsedEmojis } = this.props;
    const title = intl.formatMessage(messages.emoji);
    const { active, loading, placement } = this.state;

Similar blocks of code found in 2 locations. Consider refactoring.

Open

class EmojiPickerDropdown extends PureComponent {

  static propTypes = {
    custom_emojis: ImmutablePropTypes.list,
    frequentlyUsedEmojis: PropTypes.arrayOf(PropTypes.string),

• Read up
  Read up

Identical blocks of code found in 2 locations. Consider refactoring.

Open

  getI18n = () => {
    const { intl } = this.props;

    return {
      search: intl.formatMessage(messages.emoji_search),

• Read up
  Read up

Similar blocks of code found in 4 locations. Consider refactoring.

Open

const messages = defineMessages({
  emoji: { id: 'emoji_button.label', defaultMessage: 'Insert emoji' },
  emoji_search: { id: 'emoji_button.search', defaultMessage: 'Search...' },
  custom: { id: 'emoji_button.custom', defaultMessage: 'Custom' },
  recent: { id: 'emoji_button.recent', defaultMessage: 'Frequently used' },

• Read up
  Read up

Identical blocks of code found in 2 locations. Consider refactoring.

Open

  static propTypes = {
    custom_emojis: ImmutablePropTypes.list,
    frequentlyUsedEmojis: PropTypes.arrayOf(PropTypes.string),
    loading: PropTypes.bool,
    onClose: PropTypes.func.isRequired,

• Read up
  Read up

Identical blocks of code found in 2 locations. Consider refactoring.

Open

  componentDidMount () {
    document.addEventListener('click', this.handleDocumentClick, { capture: true });
    document.addEventListener('touchend', this.handleDocumentClick, listenerOptions);

    // Because of https://github.com/react-bootstrap/react-bootstrap/issues/2614 we need

• Read up
  Read up

Similar blocks of code found in 2 locations. Consider refactoring.

Open

const notFoundFn = () => (
  <div className='emoji-mart-no-results'>
    <Emoji
      emoji='sleuth_or_spy'
      set='twitter'

• Read up
  Read up

Similar blocks of code found in 2 locations. Consider refactoring.

Open

  handleClick = (emoji, event) => {
    if (!emoji.native) {
      emoji.native = emoji.colons;
    }
    if (!(event.ctrlKey || event.metaKey)) {

• Read up
  Read up

Similar blocks of code found in 6 locations. Consider refactoring.

Open

        <button type='button' onClick={this.handleClick} data-index={2}><Emoji emoji='fist' set='twitter' size={22} sheetSize={32} skin={2} backgroundImageFn={backgroundImageFn} native={useSystemEmojiFont} /></button>

• Read up
  Read up

Similar blocks of code found in 6 locations. Consider refactoring.

Open

        <button type='button' onClick={this.handleClick} data-index={1}><Emoji emoji='fist' set='twitter' size={22} sheetSize={32} skin={1} backgroundImageFn={backgroundImageFn} native={useSystemEmojiFont} /></button>

• Read up
  Read up

Similar blocks of code found in 6 locations. Consider refactoring.

Open

        <button type='button' onClick={this.handleClick} data-index={3}><Emoji emoji='fist' set='twitter' size={22} sheetSize={32} skin={3} backgroundImageFn={backgroundImageFn} native={useSystemEmojiFont} /></button>

• Read up
  Read up

Similar blocks of code found in 6 locations. Consider refactoring.

Open

        <button type='button' onClick={this.handleClick} data-index={4}><Emoji emoji='fist' set='twitter' size={22} sheetSize={32} skin={4} backgroundImageFn={backgroundImageFn} native={useSystemEmojiFont} /></button>

• Read up
  Read up

Similar blocks of code found in 6 locations. Consider refactoring.

Open

        <button type='button' onClick={this.handleClick} data-index={5}><Emoji emoji='fist' set='twitter' size={22} sheetSize={32} skin={5} backgroundImageFn={backgroundImageFn} native={useSystemEmojiFont} /></button>

• Read up
  Read up

Similar blocks of code found in 6 locations. Consider refactoring.

Open

        <button type='button' onClick={this.handleClick} data-index={6}><Emoji emoji='fist' set='twitter' size={22} sheetSize={32} skin={6} backgroundImageFn={backgroundImageFn} native={useSystemEmojiFont} /></button>

• Read up
  Read up

Identical blocks of code found in 2 locations. Consider refactoring.

Open

  handleDocumentClick = e => {
    if (this.node && !this.node.contains(e.target) && !this.props.pickerButtonRef.contains(e.target)) {
      this.props.onClose();
    }
  };

• Read up
  Read up

Identical blocks of code found in 2 locations. Consider refactoring.

Open

  handleDocumentClick = e => {
    if (this.node && !this.node.contains(e.target)) {
      this.props.onClose();
    }
  };

• Read up
  Read up

Identical blocks of code found in 2 locations. Consider refactoring.

Open

  handleClick = () => {
    if (this.props.active) {
      this.props.onClose();
    } else {
      this.props.onOpen();

• Read up
  Read up

Identical blocks of code found in 2 locations. Consider refactoring.

Open

        <ModifierPicker
          active={modifierOpen}
          modifier={skinTone}
          onOpen={this.handleModifierOpen}
          onClose={this.handleModifierClose}

• Read up
  Read up

Identical blocks of code found in 2 locations. Consider refactoring.

Open

  static propTypes = {
    active: PropTypes.bool,
    modifier: PropTypes.number,
    onChange: PropTypes.func,
    onClose: PropTypes.func,

• Read up
  Read up