import React, {Component} from 'react';

import VideoContainer from './video-container'; 
import StreamButtons from '../components/streamButtons'; 

class ArtistContainer extends Component {
  render() {
    return (
      <div className='streamYourself'>
        <form>
          <input
            placeholder='Title'>
          </input>
          <input
            placeholder="Details about the stream">
          </input>
          <button type= 'submit'>
            Submit Stream Details
          </button>
        </form>
        <VideoContainer />
      </div>
    )
  }
}

export default ArtistContainer
import React, {Component} from 'react';
import {reduxForm} from 'redux-form'; 

import VideoContainer from './video-container'; 
import StreamButtons from '../components/streamButtons'; 
import saveBroadcast from '../actions/index'; 

class ArtistContainer extends Component {
  onSubmit(props){
    this.props.saveBroadcast(props)
    .then(()=>{
        //something will happen here
        // this.context.router.push('/');
    })
  }
  render() {
    const {fields: {title, details}, handleSubmit} = this.props
    return (
      <div className='streamYourself'>
        <form onSubmit= {handleSubmit(this.onSubmit.bind(this))}>
          <input
            type='text'
            className='form-control'
            {...title}
            placeholder='Title'>
          </input>
          <input
            type='text'
            className='form-control'
            {...details}
            placeholder='Details about the stream'>
          </input>
          <button type= 'submit'>
            Submit Stream Details
          </button>
        </form>
        <VideoContainer />
      </div>
    )
  }
}

const mapDispatchToProps= {
  saveBroadcast
}

export default reduxForm({
  form: 'BroadcastForm',
  fields: ['title', 'details']
}, null, mapDispatchToProps)(ArtistContainer)









Add redux-form to ArtistContainer