react-redux-firebase error using firestoreConnect.

Question

So... i'm getting an error using firestoreConnect from react-redux-firebase, not sure what's going on. Here is my index.js:

const createStoreWithFirebase = compose(
applyMiddleware(thunk.withExtraArgument({getFirebase, getFirestore})),
reduxFirestore(firebaseConfig),
reactReduxFirebase(firebaseConfig, {useFirestoreForProfile: true, userProfile: 'users', attachAuthIsReady: true}))(createStore);

const initialState = {};
const store = createStoreWithFirebase(rootReducer, initialState);

store.firebaseAuthIsReady.then(() => {
ReactDOM.render(<Provider store={store}><App/></Provider>, document.getElementById('root'));

serviceWorker.unregister();
});

And here is the export part of my component:

export default compose(
firestoreConnect([
    {'collection': 'allocables'},
    {'collection': 'solution'},
    {'collection': 'resources'}
]),
connect(mapStateToProps, mapDispatchToProps)
)(Dashboard);

The error is the following:

<div style="font-size: 2em; font-family: sans-serif; color: rgb(206, 17, 38); white-space: pre-wrap; margin: 0px 2rem 0.75rem 0px; flex: 0 0 auto; max-height: 50%; overflow: auto;">TypeError: undefined is not an object (evaluating 'this.store.firestore')</div>
<div><div>componentWillMount</div><div style="font-size: 0.9em; margin-bottom: 0.9em;"><span tabindex="0" style="text-decoration: none; color: rgb(135, 142, 145); cursor: pointer;">node_modules/react-redux-firebase/es/firestoreConnect.js:142</span></div><span><span style="cursor: pointer;"><pre style="position: relative; display: block; padding: 0.5em; margin-top: 0.5em; margin-bottom: 0.5em; overflow-x: auto; white-space: pre-wrap; border-top-left-radius: 0.25rem; border-top-right-radius: 0.25rem; border-bottom-right-radius: 0.25rem; border-bottom-left-radius: 0.25rem; background-color: rgba(206, 17, 38, 0.0470588);"><code style="font-family: Consolas, Menlo, monospace;"><span data-ansi-line="true"><span></span><span> </span><span style="color: #333333;"> 139 | </span><span>_createClass(</span><span style="color: #881280;">FirestoreConnect</span><span></span><span style="color: #881280;">,</span><span> [{</span><span></span></span><br><span data-ansi-line="true"><span></span><span> </span><span style="color: #333333;"> 140 | </span><span>  key</span><span style="color: #881280;">:</span><span> </span><span style="color: #1155cc;">'componentWillMount'</span><span></span><span style="color: #881280;">,</span><span></span><span></span></span><br><span data-ansi-line="true"><span></span><span> </span><span style="color: #333333;"> 141 | </span><span>  value</span><span style="color: #881280;">:</span><span> </span><span style="color: #c80000;">function</span><span> componentWillMount() {</span><span></span></span><br><span data-ansi-line="true" style="background-color: rgb(252, 207, 207);"><span></span><span></span><span style="color: #881280;"></span><span style="color: #881280;">&gt;</span><span style="color: #881280;"></span><span></span><span style="color: #333333;"> 142 | </span><span>    </span><span style="color: #c80000;">var</span><span> firestore </span><span style="color: #881280;">=</span><span> </span><span style="color: #c80000;">this</span><span></span><span style="color: #881280;">.</span><span>store</span><span style="color: #881280;">.</span><span>firestore</span><span style="color: #881280;">;</span><span></span><span></span></span><br><span data-ansi-line="true" style="position: absolute;"><span></span><span> </span><span style="color: #333333;">     | </span><span></span><span style="color: #881280;"></span><span style="color: #881280;">^</span><span style="color: #881280;"></span><span></span><span></span></span><span data-ansi-line="true"><span></span><span> </span><span style="color: #333333;"> 143 | </span><span></span><span></span></span><br><span data-ansi-line="true"><span></span><span> </span><span style="color: #333333;"> 144 | </span><span>    </span><span style="color: #c80000;">if</span><span> (</span><span style="color: #c80000;">this</span><span></span><span style="color: #881280;">.</span><span>firestoreIsEnabled) {</span><span></span></span><br><span data-ansi-line="true"><span></span><span> </span><span style="color: #333333;"> 145 | </span><span>      </span><span style="color: #c80000;">var</span><span> inputAsFunc </span><span style="color: #881280;">=</span><span> (</span><span style="color: #994500;">0</span><span></span><span style="color: #881280;">,</span><span> _utils</span><span style="color: #881280;">.</span><span>createCallable)(dataOrFn)</span><span style="color: #881280;">;</span><span></span><span></span></span></code></pre></span><button style="margin-bottom: 1.5em; color: rgb(135, 142, 145); cursor: pointer; border: none; display: block; width: 100%; text-align: left; background-color: rgb(255, 255, 255); font-family: Consolas, Menlo, monospace; font-size: 1em; padding: 0px; line-height: 1.5; background-position: initial initial; background-repeat: initial initial;">View compiled</button></span></div>

Answer 1

If you just upgraded to React-Redux v6, it's because react-redux-firebase is not compatible with v6.

See https://github.com/prescottprue/react-redux-firebase/issues/581 for details.