title: Deleting an item from a collection in f, using React Redux
body: <p>I'm trying to delete an item from a collection in Firestore by referencing the id of the selected item. I'm successfully passing on the id by mapDispatchToProps until the action but stops short when trying to delete in Firestore by the delete(). I think the problem may be in the my method to delete in firestore as it stops there. Can anyone kindly please tell me what could be wrong with my code?</p>
  
  <pre><code>import React from 'react'
  import { connect } from 'react-redux'
  import { firestoreConnect } from "react-redux-firebase";
  import { compose } from 'redux'
  import { Redirect } from 'react-router-dom'
  import moment from 'moment'
  import { deleteProject } from '../../store/actions/projectActions'
  
  const handleClick = (e, prop) =&gt; {
      e.preventDefault()
      deleteProject(prop)
      console.log(prop)
  }
  
  const ProjectDetails = (props) =&gt; {
      const { auth, project } = props;
      if (!auth.uid) return &lt;Redirect to='/signin' /&gt;
      if (project) {
          return (
          &lt;div className="container section project-details"&gt;
              &lt;div className="card z-depth-0"&gt;
                 // content here
                  &lt;/div&gt;
                  &lt;button onClick={(e) =&gt; handleClick(e, props.id)}&gt;Delete&lt;/button&gt;
              &lt;/div&gt;
          &lt;/div&gt;
          )
      } else {
          return (
          &lt;div className="container center"&gt;
              &lt;p&gt;Loading...&lt;/p&gt;
          &lt;/div&gt;
              )
      }
  
  }
  
  const mapStateToProps = (state, ownProps) =&gt; {
      const id = ownProps.match.params.id;
      const projects = state.firestore.data.projects;
      const project = projects ? projects[id] : null
      return {
          project: project,
          id: id,
          auth: state.firebase.auth
      }
  }
  const matchDispatchToProps = (dispatch) =&gt; {
      return {
          deleteProject: (id) =&gt; dispatch(deleteProject(id))
      }
  }
  
  export default compose(
      connect(mapStateToProps, matchDispatchToProps),
      firestoreConnect([
          { collection: 'projects' }
      ])
  )(ProjectDetails)
  </code></pre>
  
  <pre><code>export const deleteProject = (id) =&gt; {
    console.log("dispatch", id) \\ successfully shows "dispatch", id
    return(dispatch, getState, {getFirestore}) =&gt; {
      const firestore = getFirestore();
      firestore.collection('projects').doc(id).delete()
        .then(() =&gt; {
          console.log('deleted') \\ does not show deleted here
          dispatch({ type: 'DELETE_PROJECT_SUCCESS' });
        }).catch(err =&gt; {
          dispatch({ type: 'DELETE_PROJECT_ERROR' });
        })
    }
  }
  </code></pre>