firestoreConnect is not keeping the state

Question

I am using firestoreConnect however the data seems to be never written to the state.

const Shipping = ({adoptions,cart,addresses,totals}) => {
  console.log("Shipping Addresses ",addresses)
  return <ViewCheckout to="/" cta="Next: Proceed Pay" totals={totals}  >
            <AddressBook />
            {/* Add address section */}
            <AddressForm />
    </ViewCheckout>
}
const mapPropsToState = state => { 
  
  console.log("state",state)
  return{
    cart: state.cart,
    totals: totalsSelector(state),
    firebase: state.firebase,
    addresses: state.firestore.data.addresses
  }
}


export default compose(
  firestoreConnect(['addresses']),
  connect(mapPropsToState,null))(Shipping)

I see in redux-logger that the data has been loaded however if I read the state the data is never loaded.

I add the logs from the state:

1. When I dispatch action:"@@reduxFirestore/DOCUMENT_ADDED" the state has the firebase data with the addresses.
2. However. When I dispatch action:CREATE_ADDRESS_SUCCESS. Firebase data is not loaded anymore, in the previous state.

I see that the firebase data is never present in my component, and also any of the next actions that I dispatch from my reducers.

I can see that logging the state from the addAddress function is also showing no firebase data on the state.

export function addAddress(data){

    return (dispatch,getState, {getFirebase,getFirestore}) => {


       const firesotre = getFirestore()
        
       console.log("Action state",getState())

        return firesotre.add({collection:'addresses'},
            {...data,
                createdAt: new Date() 
            })
        .then( ()=> dispatch(createAddressSuccess()) )
        .catch( ()=> dispatch(addressError()) )
    }
}

Log data:

Redux Inspector shows two instances.

1. One instance state captures all the actions that I created in the project. Does not updates with firebase.
2. On the other the state behaves the opposite, only keep track of the state regarding the firebase. It does not listen to the application actions.

Any tips around?

Answer 1

I solved myself!

I forgot that I had used a gatsby plugin to create the store.

{
   resolve: `gatsby-plugin-react-redux`,
   options: {
     pathToCreateStoreModule: "./src/store",
      // [optional] - options passed to `serialize-javascript`
    //     // info: https://github.com/yahoo/serialize-javascript#options
    //     // will be merged with these defaults:
    //     serialize: {
    //       space: 0,
    //       // if `isJSON` is set to `false`, `eval` is used to deserialize redux state,
    //       // otherwise `JSON.parse` is used
    //       isJSON: true,
    //       unsafe: false,
    //       ignoreFunction: true,
    //     },
    //     // [optional] - if true will clean up after itself on the client, default:
    //     cleanupOnClient: true,
    //     // [optional] - name of key on `window` where serialized state will be stored, default:
    //     windowKey: "__PRELOADED_STATE__",
    //   },
    // },

Rember when using Gatsby Check what you have in your config file!!! Otherwise, it seems that the code has taken his own life!