Using material-ui with redux? : <p>I'm currently rendering main component this way: </p>

<pre><code> ReactDOM.render(
      &lt;Provider store = {store}&gt;
        {getRoutes(checkAuth)}
      &lt;/Provider&gt;,
      document.getElementById('app')
    )
</code></pre>

<p>the docs state to use MuiThemeProvider to wrap my app component. I am alrady using Provider to wrap, any suggestions as to how to use material-ui  ina redux app. I am trying to add material-ui in a redux-form Field as below:</p>

<pre><code>import React, { PropTypes } from 'react'
import {default as ReactModal} from 'react-modal'
import {Field, reduxForm} from 'redux-form'
import {TextField} from 'material-ui'

const customStyles = {
  overlay: {
    position: 'fixed',
    top: 0,
    left: 0,
    right: 0,
    bottom: 0,
    backgroundColor: 'rgba(0, 0, 0, 0.55)'
  },
  content: {
    top: '50%',
    left: '50%',
    right: 'auto',
    bottom: 'auto',
    marginRight: '-50%',
    transform: 'translate(-50%, -50%)'
  }
}

const modalForm = (props) =&gt; {
  // console.log(props)
  const { handleSubmit, pristine, reset, submitting } = props
  return (
    &lt;div&gt;
      &lt;button onClick= {props.openModal}&gt;Duck&lt;/button&gt;
      &lt;ReactModal
      isOpen={props.isOpen}
      style={customStyles}
      onRequestClose={props.closeModal}&gt;

  &lt;h1&gt;Compose New Duck&lt;/h1&gt;
  &lt;form onSubmit= {handleSubmit}&gt;
  &lt;label&gt;duck&lt;/label&gt;
    &lt;Field name ='duck' component = {(duck) =&gt;
      &lt;TextField hintText = 'Enter Duck'
        floatingLabelText = 'Enter Duck here'
        {...duck} /&gt;} /&gt;

  &lt;/form&gt;
  &lt;button onClick= {props.closeModal}&gt;Close Modal...&lt;/button&gt;
&lt;/ReactModal&gt;
    &lt;/div&gt;
  )
}

export default reduxForm({
  form: 'duckModal'  // a unique identifier for this form
})(modalForm)
</code></pre>
