import React from 'react'

import { connect } from 'react-redux'

import { action as startStream } from 'src/redux/events/startStream'
import { action as stopStream } from 'src/redux/events/stopStream'

import Button from 'src/components/@WaspMozg/lib/Button'

import css from './index.module.sass'

const StartStream = ({ dispatch, active, id }) => (
  <div className={css['button']}>
    {!active && <Button onClick={() => dispatch(startStream({ id }))}>
      Начать вещание
    </Button>}
    {active && <Button onClick={() => dispatch(stopStream({ id }))} theme={'grey'}>
      Остановить вещание
    </Button>}
  </div>
)

export default connect()(StartStream)