]> git.localhorst.tv Git - alttp.git/blob - resources/js/components/episodes/CrewMember.js
compact keysanity tracker
[alttp.git] / 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;