Where communities thrive


  • Join over 1.5M+ people
  • Join over 100K+ communities
  • Free without limits
  • Create your own community
People
Activity
    karam
    @kmelkon
    Ugh I was going the wrong way about fixing it, tried to call add from redux action creators
    but calling onPress={() => props.firestore.add({ collection: 'workouts' }, { title })} just worked
    Thanks a lot @illuminist but this means that I can't put logic into my action creators if I'm not mistaken
    illuminist
    @illuminist
    No problem. It's usually fine to put logic in action creators though.
    karam
    @kmelkon
    so I can pass the firestore prop to the action and use it to perform data operations in a thunk?
    illuminist
    @illuminist
    You can get extended firestore instance with getFirestore function, this way you will be able to use firestore everywhere
    karam
    @kmelkon
    Sorry for the questions, but I'm passing getFirestore from redux-firestore to thunk.withExtraArguments
    then receive it in my action creator as (dispatch, getState, getFirestore) and when I call it I get an error:
    Firebase instance does not exist yet, check your compose function
    illuminist
    @illuminist
    getFirestore should be call inside of action creator though.
    karam
    @kmelkon
    that's what I'm doing, calling it in the action creator
    illuminist
    @illuminist
    Which version react-redux-firebase and redux-firestore are you using?
    karam
    @kmelkon
    "redux-firestore": "^0.9.0",
    "react-redux-firebase": "^3.0.3",
    illuminist
    @illuminist
    @kmelkon Sorry for disappearance yesterday. You should try calling createFirestoreInstance manually. And also have to make sure that will be called before any getFirestore call
    karam
    @kmelkon
    No worries, I just ended up passing the firestore object manually to my action creators as an argument
    Michael Lake
    @mlake
    hey folks - I been using redux firestore for awhile, but not that i'm converting everything to react hooks, i'm using firestoreConnect for the first time
    it seems to work except that I get an error in the console like this:
    redux-persist/createPersistoid: error serializing state TypeError: Converting circular structure to JSON
        --> starting at object with constructor 'FirebaseAppImpl'
        |     property 'firebase_' -> object with constructor 'Object'
        |     property 'apps' -> object with constructor 'Array'
        --- index 0 closes the circle
        at JSON.stringify (<anonymous>)
        at defaultSerialize (createPersistoid.js:126)
        at processNextKey (createPersistoid.js:71)
    any ideas what might be causing this?
    illuminist
    @illuminist
    Looks like you're trying to save firebase instance into persistent store. You should check that what are you putting in redux-persist
    Michael Lake
    @mlake
    thanks for the pointer..
    do think it might be this:
    const rootReducer = combineReducers({
      firebase: firebaseReducer,
      firestore: firestoreReducer,
      tripCriteria,
      tripResults,
      selectedCurrency,
      authWall,
      onboarding,
      selectedTrip,
      userData,
      embeddedProfile
    })
    Michael Lake
    @mlake
    that whole createStore.js has always been a little difficult for me to digest..
    Michael Lake
    @mlake
    so in copying the createStore.js from the example, I've got the error to go away, but I've got some other stuff in my old config (which I admittedly don't entirely comprehend...) that's needed because some other things are breaking..
    like..where can I use my persistConfig?
    const persistConfig = {
      key: 'root',
      storage,
      blacklist: ['tripResults', 'embeddedProfile']
    }
    illuminist
    @illuminist
    Try to blacklist firebase and firestore too?
    Michael Lake
    @mlake
    I had tried that to no avail..
    but the config I'm copying from the firestore example app doesn't have any code reference to persistReducer which is what I've been using..
    illuminist
    @illuminist
    which example are you using?
    illuminist
    @illuminist
    Ok checking it now
    Which version of redux-firestore you're using?
    Michael Lake
    @mlake
    "redux-firestore": "^0.10.0",
    illuminist
    @illuminist
    What returned from makeRootReducer() should be the same as rootReducer, you should be able to pass that into the second argument of persistReducer
    Michael Lake
    @mlake
    yeah, I had tried that...I'm wading through the mess now..
    Michael Lake
    @mlake
    narrowed the problem..
    console errors to throw the circular structure error when two conditions are met:
    Michael Lake
    @mlake
    const persistor = persistStore(store)
    
    // AND also..
    
      const {uid} = props
    
      const friendsQuery = useMemo(() => ({
        collection: 'users',
        doc: uid,
        subcollections: [{collection: 'suggested_to_rate'}],
        storeAs: 'friends'
      }), [uid])
    
      useFirestoreConnect([friendsQuery]) // <- particularly here
    I'm using persistor for <PersistGate> in my App.js
    Michael Lake
    @mlake
    aha, I think I found it...
    image.png
    Michael Lake
    @mlake
    so..i feel redux-firestore should have given an error telling me that i was returning a DocumentRef and that those aren't allowed..
    illuminist
    @illuminist
    We can't find the way to handle none plain object yet, such as firestore.Timestamp and Refs
    Michael Lake
    @mlake
    also..how come when HMR does a full reload, all of my stuff requested in "useFirestoreConnect" gets emptied?
    illuminist
    @illuminist
    Is other state in redux get reset too?
    Michael Lake
    @mlake
    nope
    dmitryyacenko
    @dmitryyacenko

    Hello to everyone!
    I have Firebase collections like this:

    phrases: {
      text: string;
    }
    
    stories: {
      //...
      phrases: [
        //DocReference To Phrase,
        //DocReference To Phrase,
       //...
      ]
    }

    How can I load stories with phrases? I tried something like this:

    const populates = (dataKey: any, originalData: any) => {
      if (originalData && originalData.phrases && !originalData.phrasesIds) {
        originalData.phrasesIds = originalData.phrases.map(phrase => phrase.path.split('/')[1]);
      }
      return [{child: 'id', root: 'phrasesIds'}];
    };
    
    const mapStateToProps = ({ firestore, settings, word, story }: TState) => ({
      story: story.item,
      amount: settings.amount,
      data: word.data,
      test: populate(firestore, 'phrases', populates as any)
    });
    
    const mapDispatchToProps = {};
    
    const fireStoreFetch: any = (props: Props) => {
      return [
        {
          collection: 'stories',
          doc: props.story.id,
          subcollections: [{ collection: 'phrases' }],
          populates,
          storeAs: 'phrases',
        }];
    };
    
    export default compose<{}>(
      connect(mapStateToProps, mapDispatchToProps),
      firestoreConnect(fireStoreFetch),
    )(GameScreen);

    But this code loads initial data ("story") instead of nested data ("phrase").

    Any idea what I'm doing wrong?

    Lestley Gabo
    @lestgabo

    hello I am trying to read data from firestore but I always get undefined heres what I am doing

    const mapStateToProps = state => {
        console.log(state);
        return { champDropRates: state.firestore.ordered.champDropRates };
    };

    I can see in console log champDropRates is called several times and only the last couple calls to firestore contains data. And when I try to assign champDropRates it only reads from that first firestore call which is undefined. How do I make mapStateToProps read that latest call to firestore with data instead of the first call to firestore which is empty?

    Lestley Gabo
    @lestgabo
    ^ nevermind I figured it out. redux does auto reload if a value changes. It was my parsing that was wrong, I was parsing for objects instead of an array.
    Pedro Specter
    @pedrospecter_twitter
    Hey @lestgabo how did you solve it? I am actually having the same problem
    Dustin Palea
    @Dkpalea
    Hi everyone! 👋 I'm trying to use populate with firestore in a react function component. Currently, the hook "useFirestoreConnect" from react-redux-firebase doesn't support population(?). Are there any examples that show how I might use firestore population in a function component?