# All files / composer/components RetweetAttachment.jsx

0% Statements 0/5
100% Branches 0/0
0% Functions 0/2
0% Lines 0/5

Press n or j to go to the next uncovered block, b, p or k for the previous block.

    1
    2
    3
    4
    5
    6
    7
    8
    9
    10
    11
    12
    13
    14
    15
    16
    17
    18
    19
    20
    21
    22
    23
    24
    25
    26
    27
    28
    29
    30
    31
    32
    33
    34
    35
    36
    37
    38
    39
    40
    41
    42
    43
    44
    45
    46
    47
    48
    49
    50
    51
    52
    53
    54
    55

     import React from 'react';
    import PropTypes from 'prop-types';
    import CloseButton from '../components/CloseButton';
    import AppActionCreators from '../action-creators/AppActionCreators';
    import ComposerActionCreators from '../action-creators/ComposerActionCreators';
    import { AttachmentTypes } from '../AppConstants';

    import styles from './css/RetweetAttachment.css';

    class RetweetAttachment extends React.Component {
      static propTypes = {
        draftId: PropTypes.string.isRequired,
        retweet: PropTypes.object.isRequired,
      };

      onCloseButtonClick = () => {
        ComposerActionCreators.toggleAttachment(this.props.draftId, AttachmentTypes.RETWEET);

        AppActionCreators.trackUserAction(['composer', 'attachment', 'disabled'], {
          attachment_type: AttachmentTypes.RETWEET,
          button_clicked: 'close_button',
        });
      };

      render() {
        const { text, userName, userDisplayName, avatarUrl } = this.props.retweet;

        const retweetIconClassName = [
          styles.retweetIcon,
          'bi bi-retweet',
        ].join(' ');

        return (
          <div className={styles.retweetAttachment}>
            <img src={avatarUrl} alt="Retweeted user's avatar" className={styles.avatar} />

            <span className={styles.retweetLabel}>
              <i className={retweetIconClassName} /> Retweeted by you
            </span>

            <span className={styles.userDisplayName}>{userDisplayName}</span>
            <span className={styles.userName}>@{userName}</span>
            <p className={styles.text}>{text}</p>

            <CloseButton
              className={styles.closeButton} onClick={this.onCloseButtonClick}
              data-tip="Disable Native Retweet Mode"
            />
          </div>
        );
      }
    }

    export default RetweetAttachment;