Where communities thrive

  • Join over 1.5M+ people
  • Join over 100K+ communities
  • Free without limits
  • Create your own community
    Dustin Graves
    @rscotten thanks I will take a look
    Serhii Palash

    @prescottprue is there anything like profileParamsToListen in react-redux-firebase?

    I want to add global listener to the app on connections/${profile.connectionId} node in database.

    There is profileParamsToPopulate Api. The thing is that it doesn't listen some prop under profile continually, but only populates it once on every profile update.

    Hi good day! I'm having a hard time implementing data filter using firestore. Can someone help me?
    Scott Prue
    @serhiipalash there is not the ability to listen for any populates currently, but that is something that has been on the roadmap for a while
    Jascha Brinkmann
    @jasonejavier what exactly do you mean by "data filter"?
    I've found firestores filtering capabilities very limited so depending on your needs it might not even be possible with firestore alone
    Scott Prue
    I agree, not sure what is meant by “data filter”. Personally have found firestore’s querying to be enough for most filtering/sorting I have needed, but it does sometimes mean adding new parameters to your objects
    Marcus Lundgren
    trying to use store.getState() in firestoreconnect, but can't seem to get it working. using 3.0
    work please?
    Marcus Lundgren
    Ugh, anyways props and store seems to be referencing the same object
    store === props is true
    so im not sure what im doing wrong, or what i should do differentley, cant seem to access store. Maybe not available in 3.0?
    Marcus Lundgren
    ignore everything i just said
    Marcus Lundgren
    is there any way to specify the key when storing it in redux?
    so i dont have to deal with the weird -LD5..
    Scott Prue
    @marluo using storeAs you can do that
    Marcus Lundgren
    Well i tired doing that but only came this far
    saved it as lols obviously
    Also - i tried accessing the store in firebaseconnect, but cant seem to do that either. Is this changed in 3.0? same issue as above
    Marcus Lundgren
    any way to customize key it gets written to in uploadFiles?
    Scott Prue
    You should use connect before firebaseConnect instead of using getState in firebaseConnect (there are a number of known issues with that method, so yeah it hasn’t been tested for v3)
    Marcus Lundgren
    tried, throwed me an error.
    Anyways i solved it anyways.
    Marcus Lundgren
    trying to work with pagination, they do indeed get ordered right when ordering by upvotes
    but when im trying to do ["upvotes", "desc"] everything just gets weird, and it only seems to order it by the limit you have set
    i.e 1-10 only ordering these posts
    10-20, only ordering those posts
    but if i dont use desc, it works, but obviously in reversed order.
    Hazim Ali
    Hye, I want to ask regarding actionTypes.CLEAR_DATA to clear firestore data.. I use this one as a callback after user logout.. when I open another screen after that, the screen is calling firestoreConnect with collection but my firestore did not update again. does this is normal behaviour or did I did something wrong ?
    Screen Shot 2019-04-25 at 3.01.10 AM.png
    Screen Shot 2019-04-25 at 3.00.49 AM.png
    Marcus Lundgren
    Uncaught Error: Supplied prop/s "dispatch" are reserved for internal firebaseConnect() usage
    apperentley deleting dispatch when rendering worked
    for my privateroute
    Scott Prue
    @marluo yeah that was a feature added to prevent prop collisions
    Hazim Ali
    @prescottprue hye scott.. any insight what I did wrong on the above ? :-)
    Yash Ahuja

    Hello Guys and @prescottprue I have been facing a major issue with setting up my React Redux Firebase & Redux Firestore on a base project. The issue is when i use firestoreConnect

    The errors that i get are : TypeError: this.props.firestore.setListeners & this.props.firestore.unsetListeners is not a function
    I have read through all the docs as well read through the examples of the repo at the next branch but couldn't solve it.
    i would be very grateful if someone could help me here.

    I have all my react-redux libraries to the latest version , my package.json :

        "dependencies": {
            "firebase": "^6.0.1",
            "react": "^16.8.6",
            "react-dom": "^16.8.6",
            "react-redux": "^7.1.0-alpha.4",
            "react-redux-firebase": "^3.0.0-alpha.11",
            "react-scripts": "3.0.0",
            "redux": "^4.0.1",
            "redux-firestore": "^0.7.3"

    My index.js file with setup :

    import React from "react";
    import ReactDOM from "react-dom";
    import "./index.css";
    import Todos from "./Todos";
    import * as serviceWorker from "./serviceWorker";
    import { Provider } from "react-redux";
    import firebase from "firebase/app";
    import "firebase/auth";
    import "firebase/firestore"; // <- needed if using firestore
    import { createStore, combineReducers, compose } from "redux";
    import ReactReduxFirebaseProvider from "react-redux-firebase/lib/ReactReduxFirebaseProvider";
    import firebaseReducer from "react-redux-firebase/lib/reducer";
    import { createFirestoreInstance, firestoreReducer } from "redux-firestore"; // <- needed if using firestore
    const fbConfig = { // XXXXXXX to hide actual config
        apiKey: "XXXXXXXX_R_E-faSBKZ0FmS4o",
        authDomain: "XXXXXXXX-8261c.firebaseapp.com",
        databaseURL: "https://XXXXXXXX-8261c.firebaseio.com",
        projectId: "XXXXXXXXXX-8261c",
        storageBucket: "XXXXXXX-8261c.appspot.com",
        messagingSenderId: "XXXXXXXXXXXXX",
        appId: "1:XXXXXXXXXXX:web:XXXXXXXXXXX"
    // react-redux-firebase config
    const rrfConfig = {
        userProfile: "users",
        useFirestoreForProfile: true // Firestore for Profile instead of Realtime DB
    // Initialize firebase instance
    // Initialize other services on firebase instance
    firebase.firestore(); // <- needed if using firestore
    // firebase.functions() // <- needed if using httpsCallable
    // Add firebase to reducers
    const rootReducer = combineReducers({
        firebase: firebaseReducer,
        firestore: firestoreReducer // <- needed if using firestore
    // Create store with reducers and initial state
    const initialState = {};
    const store = createStore(rootReducer, initialState);
    const rrfProps = {
        config: rrfConfig,
        dispatch: store.dispatch,
        createFirestoreInstance // <- needed if using firestore
    // Setup react-redux so that connect HOC can be used
    function Index() {
        return (
            <Provider store={store}>
                <ReactReduxFirebaseProvider {...rrfProps}>
                    <Todos />
    ReactDOM.render(<Index />, document.getElementById("root"));

    The Todos.js file where i am using firestoreConnect :

    import React, { Component } from "react";
    import PropTypes from "prop-types";
    import { compose } from "redux";
    import { connect } from "react-redux";
    import { firestoreConnect } from "react-redux-firebase";
    /* function Todos(props) {
        return (
                <p>This is a todo page</p>
    } */
    class Todos extends Component {
        render() {
            return (
                    <p>This is a todo page</p>
    const enhance = compose(
        firestoreConnect({ collection: "todos" }), // or () => ["users"]
        connect((state, props) => {
            return { todos: state.firestore.ordered.todos };
    export default enhance(Todos);

    I have tried functional component also, i get the same error.

    The following are the logs i get:

    Few warnings : 
    1. Warning: Failed prop type: The prop `dispatch` is marked as required in `FirestoreConnectWrapped(Connect(Todos))`, but its value is `undefined`.
    2. Warning: Failed prop type: Invalid prop `firebase` of type `string` supplied to `FirestoreConnectWrapped(Connect(Todos))`, expected `object`.
    3. Warning: Failed prop type: Invalid prop `firestore` of type `string` supplied to `FirestoreConnectWrapped(Connect(Todos))`, expected `object`.
    The debugs i had added :
    4. {}
    constructor: ƒ Object()
    hasOwnProperty: ƒ hasOwnProperty()
    isPrototypeOf: ƒ isPrototypeOf()
    propertyIsEnumerable: ƒ propertyIsEnumerable()
    toLocaleString: ƒ toLocaleString()
    toString: ƒ toString()
    valueOf: ƒ valueOf()
    __defineGetter__: ƒ __defineGetter__()
    __defineSetter__: ƒ __defineSetter__()
    __lookupGetter__: ƒ __lookupGetter__()
    __lookupSetter__: ƒ __lookupSetter__()
    get __proto__: ƒ __proto__()
    set __proto__: ƒ __proto__()
    5. {firestore: "ReduxFirestore", firebase: "ReactReduxFirebase", dispatch: ƒ, todos: undefined}
    dispatch: ƒ dispatch(action)
    firebase: "ReactReduxFirebase"
    firestore: "ReduxFirestore"
    todos: undefined
    __proto__: Object
    The errors because of which the code breaks :
    6. Uncaught TypeError: this.props.firestore.setListeners is not a function
        at FirestoreConnectWrapped.componentDidMount (firestoreConnect.js:133)
    7. Uncaught TypeError: this.props.firestore.unsetListeners is not a function
        at FirestoreConnectWrapped.componentWillUnmount (firestoreConnect.js:139)
    Some extra erros, i am assuming these indicate the location of the above errors :
    8. index.js:1437 The above error occurred in the <FirestoreConnectWrapped(Connect(Todos))> component:
        in FirestoreConnectWrapped(Connect(Todos)) (created by Context.Consumer)
    9. Uncaught TypeError: this.props.firestore.setListeners is not a function
        at FirestoreConnectWrapped.componentDidMount (firestoreConnect.js:133)

    I have read through all the docs i could but i couldn't get to make a working solution, also because all the examples are updated according to the newer version.
    Any help would be really appreciated

    Although you guys try to keep the documentation updated, but i feel the latest docs to setup react-redux-firebase + redux-firestore are missing some key pieces.
    Scott Prue
    @samsoul16 You should be passing the rrf config without spreading I believe
    Yash Ahuja

    @prescottprue I think you meant not spreading rrfProps & not rrfConfig.

    Any do that was not the issue, i exactly don't know what was but i was able to solve it and hence i will share my working solution tomorrow.

    Yash Ahuja

    Also a major thing @prescottprue was getting Firestore to work with the latest version of react-redux-firebase as now we don't have getFirebase & getFirestore

    I read along your issue no 635 on that thread and i was able to build a final working solution with latest version of react-redux, redux, react-redux-firebase, redux-firestore and redux-devtools-extension as well. I will be sharing my codepen soon here for others who want to get a working setup atleast as i the docs aren't cleaned up yet; i noticed you are working on them, but i'm sure i will be able to save alot of people's time with that codepen setup because it took me a whole day to get them working.

    Scott Prue
    @samsoul16 that would be amazing to post, thanks! I will try to work it into the docs ASAP
    Yash Ahuja

    Hello Guys, i would like to share a working solution for getting redux, react-redux, react-redux-firebase, redux-firestore, redux-thunk and redux-devtools-extension completely working back up.

    The below code uses the latest version of all the libraries so please look at the version of dependencies on the left first and to get it working in your project.

    Please take a look at this code-pen : https://codesandbox.io/s/8423o1m529

    Here i have created separate actions file which has (actions / actionCreator as some say) and call firestore functions from there, which is one of the most common use case from what i have seen.

    I have organized everything as i have done in my original project just not added files to folders.

    Also it would be great if you could just have a glimpse through it @prescottprue.

    The reason for me not posting everything here is that it would take too much space and this will not be a great place to do it.