<commit_before>import React, { Component } from 'react';
import PropTypes from 'prop-types';
import UserListModal from 'components/Modals/UserListModal';
import Likers from 'components/Likers';
import LikeButton from 'components/Buttons/LikeButton';
import StarButton from 'components/Buttons/StarButton';

export default class SideButtons extends Component {
  static propTypes = {
    byUser: PropTypes.bool.isRequired,
    canStar: PropTypes.bool.isRequired,
    isStarred: PropTypes.bool.isRequired,
    likes: PropTypes.array.isRequired,
    likeVideo: PropTypes.func.isRequired,
    changeByUserStatus: PropTypes.func.isRequired,
    starVideo: PropTypes.func.isRequired,
    style: PropTypes.object,
    uploader: PropTypes.object.isRequired,
    userId: PropTypes.number,
    videoId: PropTypes.oneOfType([PropTypes.string, PropTypes.number])
      .isRequired
  };

  state = {
    userListModalShown: false
  };

  render() {
    const {
      byUser,
      canStar,
      isStarred,
      likes,
      likeVideo,
      starVideo,
      style,
      uploader,
      userId,
      videoId
    } = this.props;
    const { userListModalShown } = this.state;
    return (
      <div style={style}>
        <div
          style={{
            display: 'flex',
            alignItems: 'center',
            justifyContent: 'flex-end',
            width: '100%'
          }}
        >
          {canStar && (
            <div
              style={{
                position: 'relative',
                width: '4rem',
                height: '4rem',
                marginRight: '1rem'
              }}
            >
              <StarButton
                byUser={byUser}
                contentId={Number(videoId)}
                style={{ position: 'absolute', top: 0, left: 0 }}
                isStarred={isStarred}
                onToggleStarred={() => starVideo(videoId)}
                onToggleByUser={this.onToggleByUser}
                uploader={uploader}
              />
            </div>
          )}
          <LikeButton
            contentType="video"
            contentId={Number(videoId)}
            filled
            style={{
              fontSize: '2.5vw',
              minWidth: '50%',
              maxWidth: '13vw'
            }}
            onClick={likeVideo}
            liked={(likes => {
              let liked = false;
              if (likes) {
                for (let i = 0; i < likes.length; i++) {
                  if (likes[i].id === userId) liked = true;
                }
              }
              return liked;
            })(likes)}
          />
        </div>
        <Likers
          style={{
            textAlign: 'center',
            lineHeight: '1.7rem',
            marginTop: '0.5rem'
          }}
          userId={userId}
          likes={likes}
          onLinkClick={() => this.setState({ userListModalShown: true })}
          target="video"
          defaultText="Be the first to like this video"
        />
        {userListModalShown && (
          <UserListModal
            onHide={() => this.setState({ userListModalShown: false })}
            title="People who liked this video"
            users={likes.map(like => {
              return {
                username: like.username,
                userId: like.userId
              };
            })}
            description="(You)"
          />
        )}
      </div>
    );
  }<commit_msg>minor error fix<commit_after>import React, { Component } from 'react';
import PropTypes from 'prop-types';
import UserListModal from 'components/Modals/UserListModal';
import Likers from 'components/Likers';
import LikeButton from 'components/Buttons/LikeButton';
import StarButton from 'components/Buttons/StarButton';

export default class SideButtons extends Component {
  static propTypes = {
    byUser: PropTypes.bool.isRequired,
    canStar: PropTypes.bool.isRequired,
    isStarred: PropTypes.bool.isRequired,
    likes: PropTypes.array.isRequired,
    likeVideo: PropTypes.func.isRequired,
    changeByUserStatus: PropTypes.func.isRequired,
    starVideo: PropTypes.func.isRequired,
    style: PropTypes.object,
    uploader: PropTypes.object.isRequired,
    userId: PropTypes.number,
    videoId: PropTypes.oneOfType([PropTypes.string, PropTypes.number])
      .isRequired
  };

  state = {
    userListModalShown: false
  };

  render() {
    const {
      byUser,
      canStar,
      isStarred,
      likes,
      likeVideo,
      starVideo,
      style,
      uploader,
      userId,
      videoId
    } = this.props;
    const { userListModalShown } = this.state;
    return (
      <div style={style}>
        <div
          style={{
            display: 'flex',
            alignItems: 'center',
            justifyContent: 'flex-end',
            width: '100%'
          }}
        >
          {canStar && (
            <div
              style={{
                position: 'relative',
                width: '4rem',
                height: '4rem',
                marginRight: '1rem'
              }}
            >
              <StarButton
                byUser={byUser}
                contentId={Number(videoId)}
                style={{ position: 'absolute', top: 0, left: 0 }}
                isStarred={isStarred}
                onToggleStarred={() => starVideo(videoId)}
                onToggleByUser={this.onToggleByUser}
                uploader={uploader}
              />
            </div>
          )}
          <LikeButton
            contentType="video"
            contentId={Number(videoId)}
            filled
            style={{
              fontSize: '2.5vw',
              minWidth: '50%',
              maxWidth: '13vw'
            }}
            onClick={likeVideo}
            liked={(likes => {
              let liked = false;
              if (likes) {
                for (let i = 0; i < likes.length; i++) {
                  if (likes[i]?.id === userId) liked = true;
                }
              }
              return liked;
            })(likes)}
          />
        </div>
        <Likers
          style={{
            textAlign: 'center',
            lineHeight: '1.7rem',
            marginTop: '0.5rem'
          }}
          userId={userId}
          likes={likes}
          onLinkClick={() => this.setState({ userListModalShown: true })}
          target="video"
          defaultText="Be the first to like this video"
        />
        {userListModalShown && (
          <UserListModal
            onHide={() => this.setState({ userListModalShown: false })}
            title="People who liked this video"
            users={likes.map(like => {
              return {
                username: like.username,
                userId: like.id
              };
            })}
            description="(You)"
          />
        )}
      </div>
    );
  }
{'fraction_non_alphanumeric': 0.11377245508982035, 'fraction_numerical': 0.005549875858040018, 'mean_word_length': 1.4766726943942134, 'pattern_counts': {'":': 0, '<': 25, '<?xml version=': 0, '>': 33, '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': '4895522', 'n_tokens_mistral': 1871, 'n_tokens_neox': 1879, 'n_words': 384}