resources/js/components/episodes/Channel.js

   1 import PropTypes from 'prop-types';
   2 import React from 'react';
   3 import { Button } from 'react-bootstrap';
   4
   5 import Icon from '../common/Icon';
   6 import { mayEditRestream } from '../../helpers/permissions';
   7 import { withUser } from '../../helpers/UserContext';
   8
   9 const Channel = ({ channel, episode, onEditRestream, user }) =>
  10         <div className="episode-channel text-nowrap">
  11                 <Button
  12                         href={channel.stream_link}
  13                         rel="noreferer"
  14                         target="_blank"
  15                         title={channel.title}
  16                         variant="outline-twitch"
  17                 >
  18                         <Icon.STREAM />
  19                         {' '}
  20                         {channel.short_name || channel.title}
  21                 </Button>
  22                 {onEditRestream && mayEditRestream(user, episode, channel) ?
  23                         <Button
  24                                 className="ms-1"
  25                                 onClick={() => onEditRestream(episode, channel)}
  26                                 variant="outline-secondary"
  27                         >
  28                                 <Icon.SETTINGS />
  29                         </Button>
  30                 : null}
  31         </div>;
  32
  33 Channel.propTypes = {
  34         channel: PropTypes.shape({
  35                 short_name: PropTypes.string,
  36                 stream_link: PropTypes.string,
  37                 title: PropTypes.string,
  38         }),
  39         episode: PropTypes.shape({
  40         }),
  41         onEditRestream: PropTypes.func,
  42         user: PropTypes.shape({
  43         }),
  44 };
  45
  46 export default withUser(Channel);