9

The below line directs firestoreConnect to my collection labeled projects.

 { collection: 'projects' }

It works when the projects collection is immediately under the root like this:

root/
  projects/

But what if the projects collection is referenced by a doc which itself is within another collection, say, like this:

root/
  users/
    alice/
      projects/

How do I point firestoreConnect to the projects collection?

The documentation is silent on the matter.

Link to video 
import React, { Component } from 'react'
import ProjectList from '../projects/ProjectList'
import Notifications from './Notifications'
import { connect } from 'react-redux'
import { firestoreConnect } from 'react-redux-firebase'
import { compose } from 'redux'
import { Redirect } from 'react-router-dom'

class Dashboard extends Component {...}

const mapStateToProps = (state) => {
  // console.log(state);
  return {
    projects: state.firestore.ordered.projects,
    auth: state.firebase.auth,
  }
}

export default compose(
  connect(mapStateToProps),
  firestoreConnect([
    { collection: 'projects' }, // <-- Question is about this line
  ])
)(Dashboard)

Edit: Unsuccessful Attempt

From what I can piece together from the comments here it seems like the answer might be:

firestoreConnect([
  { 
    collection : 'users',
    doc        : 'alice',
    collection : 'projects',
  }
])

But that attempt has failed.

Let Me Tink About It
  • 11,866
  • 13
  • 72
  • 169
  • I apologize for any miscommunication, but were you able to find a solution to this problem? I am running into a similar issue, while following the exact same tutorial. my intended structure was going to looks something like "Collection: courses, doc: state.auth.uid, collection: lecture" but wasn't successful. – Andrew B. Jul 20 '20 at 18:37

1 Answers1

13

It can be done by passing multiple collection/doc settings to the subcollections parameter like so:

firestoreConnect(() => [
  {
    collection: 'states',
    doc: 'CA',
    subcollections: [
      { collection: 'cities', doc: 'SF' },
      { collection: 'zips' }
    ]
  }
])

This is noted in the firestoreConnect section of the react-redux-firebase docs (since it is a react specific HOC). The options that can be passed to queries are documented in the README of redux-firestore.

If you are doing nested subcollections, you will probably want to use the v1.*.* versions since subcollections are stored along side top level collections in redux state. Note that the new version has a different API , as described in the v1.0.0 roadmap.

Disclosure: I am the author of redux-firestore

Scott
  • 885
  • 8
  • 14
  • 2
    +1. My $.02: Encourage people to post their questions here on SO. By providing examples, it can augment your docs quite nicely. And with enough examples, comprehensive documentation becomes less critical. Gitter is good for building a community. If people post their questions here, then the repository of knowledge persists with more permanence and it's also easier to search and find. Which will also help new users discover your library. And great work building that library! – Let Me Tink About It Dec 29 '18 at 17:22
  • Missing the closing bracket for the object inside first array. – spod Feb 11 '19 at 13:09
  • I wonder where all this is documented. I guess it maps to some firestore API, but I haven't figured out which. @Scott where did you find the docs you needed for making your solution above? – Esben von Buchwald Apr 12 '19 at 22:24
  • The use of firestoreConnect is covered in [the react-redux-firebase docs](http://react-redux-firebase.com/docs/api/firestoreConnect.html) (since redux-firestore is not react specific) as referenced in [the README of redux-firestore](https://github.com/prescottprue/redux-firestore#complementary-package). – Scott Apr 16 '19 at 19:48
  • Where can I find the explanation around the "doc" field? – eMarine Mar 11 '21 at 18:55