resources/js/components/episodes/CrewMember.js

   1 import PropTypes from 'prop-types';
   2 import React from 'react';
   3 import { Button } from 'react-bootstrap';
   4
   5 import { getName, getStreamLink } from '../../helpers/Crew';
   6 import { getAvatarUrl } from '../../helpers/User';
   7
   8 const CrewMember = ({ crew }) => {
   9         const classNames = [
  10                 'crew-member',
  11                 'text-light',
  12         ];
  13         if (!crew.confirmed) {
  14                 classNames.push('unconfirmed');
  15         }
  16         return <Button
  17                 className={classNames.join(' ')}
  18                 href={getStreamLink(crew) || null}
  19                 key={crew.id}
  20                 rel="noreferer"
  21                 variant="outline-twitch"
  22         >
  23                 <img alt="" src={getAvatarUrl(crew.user)} />
  24                 <span>{getName(crew)}</span>
  25         </Button>;
  26 };
  27
  28 CrewMember.propTypes = {
  29         crew: PropTypes.shape({
  30                 confirmed: PropTypes.bool,
  31                 id: PropTypes.number,
  32                 user: PropTypes.shape({
  33                 }),
  34         }),
  35 };
  36
  37 export default CrewMember;