redux-firebase/Lobby

Discussion of all things Redux and Firebase (offical room of react-redux-firebase)

Wendy Liu

@lynklody

@DMcNamara @gregfenton Thank you both for the help! Right now I pulled data (aka. state.firestore.ordered.todos) successfully from my firestore to my Redux store. But I'm having trouble single out a single piece of data. It seems to me that function is not waiting for the syncing to finish. Is there an elegant way to do the job in rrf or should I modify my async call to accommodate the change?

Dan McNamara

@DMcNamara

RRF has helper functions isEmpty and isLoaded for checking that.

I really love the custom loading HOCs in the RRF docs: https://react-redux-firebase.com/docs/queries.html#customLoadingHOC

3 replies

I'm thinking of implementing similar things in my non-firebase apps.

for getting a single piece of data out of the store, if you have the id you can do state.firestore.data.todos[id], since that's a dictionary of { [id: string]: Document }

Navalex

@navalex

Hi, i'm quit new with react-redux-firebase, and wanted to know if is there any way to get callback of request like profileUpdate cause i want to redirect user to another page when the updateProfile request is done

Dan McNamara

@DMcNamara

Most of the .Add etc. Methods return a promise so you could .then then

Them*

Navalex

@navalex

Thanks, and I have a last question. I want to use redux to share some other data, is there a specific way to combine it to react-redux-firebase ?

Ricjohn

@ricjohn-acosta

Hey guys. How can I use the startAfter query so that it'll start after a specific document? Is there a workaround where I could pass a documentsnapshop to startAfter query?

Ricjohn

@ricjohn-acosta

Also, I have pagination set up so that only 10 documents are getting read per "next page/prev page" click. Now, I'm wondering if there's anything I could do to reduce firestore reads if, say, users spam next page/prev page clicks?

Dan McNamara

@DMcNamara

@navalex rrf is just an extension to redux, you can add another reducer like you normally would and then use a selector to pull and combine data from any part of the store

Dan McNamara

@DMcNamara

@ricjohn-acosta https://firebase.google.com/docs/firestore/query-data/query-cursors might be helpful to you.

caspergreen

@caspergreen

How can I debug where all my firestore reads come from? My app produces way more reads than necessary, and I am not sure how to properly count it when using useFirestoreConnect or firestoreConnect

gregfenton

@gregfenton

I’m not sure how one would go about measuring calls out to Firestore. I assume you have read: https://firebase.google.com/docs/firestore/monitor-usage

Not sure if there is a way to use something like Chrome DevTools’ Profiler to see Firestore activity?

caspergreen

@caspergreen

Yeah, I read that, but not sure I can get it very detailed (like what collection is being queried a lot). I can try to see if Chrome DevTools can be insightful

Navalex

@navalex

Hi, I included Facebook, Twitter, and Google auth to my app, everything is working well except Facebook login that is not creating any profile. Is that normal? Cause if it's normal behaviour I'll generate a profile automatically but I prefer to have confirmation! ;)

gregfenton

@gregfenton

@navalex - can you explain what you mean by “not creating any profile” ?

gregfenton

@gregfenton

Not sure if people saw this yet or not: https://firebase.googleblog.com/2020/05/local-firebase-emulator-ui.html

Dan McNamara

@DMcNamara

I started the emulators for the first time yesterday and saw that! It's very cool, I just need to figure out if I can make auth work using the emulator and point my react-native app at it.

gregfenton

@gregfenton

I’m working through the recipe that cypress-react offers:

https://github.com/prescottprue/cypress-firebase#using-database-emulators

I have my app running locally against Firestore and Functions emulators. The auth is still going against my Firebase project in the cloud (i.e. Accounts are created in Firebase Console and that’s what the session authenticates against) but all data is going into local Firestore database.

…except for one minor issue I’m hoping to resolve in the next short while after Scott’s response: prescottprue/cypress-firebase#135

Dan McNamara

@DMcNamara

Nice, thanks! I'll have to take a look through that next time I have the gumption to get it working. I've just been developing against the prod firebase project until now, haha.

gregfenton

@gregfenton

yeah, that’s what I was doing too. Now I’m going all-in on an e2e test suite so I am looking for productivity boosts :)

Ricjohn

@ricjohn-acosta

just curious. how much a month are you guys spending, if any, on your shipped firebase projects?

Dan McNamara

@DMcNamara

I haven't actually shipped mine yet, but soon! Just waiting on app/play store reviews to go through...

gregfenton

@gregfenton

Ditto, though i’m a bit further away. A few weeks at least.

Trevor Hartman

@devth

I'm getting a FirebaseError: Missing or insufficient permissions error but the error message and stack trace don't indicate the path that's actually causing the error. has anyone figured out a clever way to track down the cause?

gregfenton

@gregfenton

Is it happening on app start or just on a specific component/screen?

Trevor Hartman

@devth

on all screens on every render

gregfenton

@gregfenton

RTDB or Firestore ?

Can you tear down your <App> to make it super-simple and just get a single element to focus on?

Or grab a simple example app and copy your fbConfig into it.

Trevor Hartman

@devth

firestore. i figured out it was rrfConfig

    userProfile: 'profiles',
    // Firestore for Profile instead of Realtime DB
    useFirestoreForProfile: true,

I removed that and it's no longer causing the error

gregfenton

@gregfenton

Excellent! What part did you have to remove, the userFirestoreForProfile or all of it?

…and…do you not want to use Firestore to store additional user profile info?

gregfenton

@gregfenton

So, this is something I haven’t tried before.

I’m using useFirestoreConnect to get a collection of todo

and I’m using useSelector to get the collection

But, my functional component is rendering a calculation (e.g. {todos ? todos.length : “no todos yet”})

On first pass it the component renders “no todos yet”. I have logging showing that the useSelector fires after the first render. But the component is not then re-rendering, so I keep having “no todos yet” even though clearly todos are populated now.

Thoughts on how to cause a re-render of this functional component?

gregfenton

@gregfenton

actually…i guess it is a bit more complex than that. I am calculating a value into another variable (data) and then rendering data. So it is that data needs to be refreshed.

Off to read more on useEffect() and other shades of reactjs...

gregfenton

@gregfenton

OMG, never mind. Third party control issue….grrrrr!!!!!

Sanliegen

@sanliegen

Hi there, I'm somehow struggling to get react-redux-firebase running with react-native. Can someone maybe point me to a recent example app (using the new version 3.0) where I can see where and how react-redux-firebase for e.g. authentication ideally already persisting the redux state?

Dan McNamara

@DMcNamara

I wasn't able to get RRF to set the auth state in my Expo react native app, I spent a lot of time trying. I ended up creating the users in firestore myself and storing the currentUserId in a normal reducer. Everything other than that worked as expected.

4 replies

Where communities thrive

People

Repo info

Activity