title: How to add object to state from props in ReactJS using firestoreConnect?
body: <p>I am using firebase in my project. On a component, I would like to show information about the device stored in firestore. I transfer the information to props using react-redux-firebase. But I can't use the props directly or by throwing it into the state.</p>
  
  <p>I tried to use both methods.</p>
  
  <pre><code>class Budget extends Component {
  
    constructor(props){
      super(props);
      this.state = {
       dev: []
      }
    }
    componentDidMount() {
     this.setState({
       dev: this.props.devices
     })
    }
  
    render() {
      const {devices, profile, classes, className, ...rest } = this.props;
  
      const rootClassName = classNames(classes.root, className);
  
      console.log(this.state)
  
      return (
        &lt;Paper
          {...rest}
          className={rootClassName}
        &gt;
          &lt;div className={classes.content}&gt;
            &lt;div className={classes.details}&gt;
              &lt;Typography
                className={classes.title}
                variant="body2"
              &gt;
                Device
              &lt;/Typography&gt;
  
              &lt;Typography
                className={classes.value}
                variant="h3"
              &gt;
                Device condition
              &lt;/Typography&gt;
            &lt;/div&gt;
            &lt;div className={classes.iconWrapper}&gt;
              &lt;MoneyIcon className={classes.icon} /&gt;
            &lt;/div&gt;
          &lt;/div&gt;
          &lt;div className={classes.footer}&gt;
            &lt;Typography
              className={classes.deviceError}
              variant="body2"
            &gt;
              &lt;Error /&gt;
              Error
            &lt;/Typography&gt;
            &lt;Typography
              className={classes.deviceOk}
              variant="body2"
            &gt;
              &lt;Done /&gt;
              Running
            &lt;/Typography&gt;
          &lt;/div&gt;
        &lt;/Paper&gt;
      );
    }
  }
  
  Budget.propTypes = {
    className: PropTypes.string,
    classes: PropTypes.object.isRequired
  };
  
  const mapStateToProps =(state) =&gt; {
    return {
      authError: state.auth.authError,
      auth: state.firebase.auth,
      profile: state.firebase.profile,
      devices: state.firestore.ordered.devices
    }
  }
  
  export default compose(withStyles(styles),
    connect(mapStateToProps),
    firestoreConnect((props)=&gt;[
      {
        collection: 'devices',
        where: [
          ['managerId', '==', props.auth.uid],
        ]
      },
    ]))(Budget);
  </code></pre>
  
  <p>When I run the above code, the 'dev' in the state appears to be undefined. 
  If I use devices props in return, i have this error message: "Unhandled Rejection (TypeError): Can't read property 'name' of undefined".
  Name is key of a device object.</p>