react-native-offline: ReduxNetworkProvider with react-native-navigation - could not find store
Hi,
I’m trying to use the v4.x.x with react-native-navigation and can’t make the new ReduxNetworkProvider work.
Here is a simple example of what I’m trying to do
import { applyMiddleware, combineReducers, createStore } from 'redux';
import { Provider } from 'react-redux';
import { reducer as networkReducer } from 'react-native-offline';
const rootReducer = combineReducers({
network: networkReducer
});
const store = createStore(rootReducer, applyMiddleware(thunk, logger));
// Registering the screen as described here https://wix.github.io/react-native-navigation/#/docs/top-level-api-migration?id=registering-screens-with-wrapping-provider-component
Navigation.registerComponent('Home', () => (props) => (
<Provider store={ store }>
<Home {...props} />
</Provider>
), () => Home);
In my Home component, I can access the network isConnected value, though it is always true.
So I’ve tried to add the ReduxNetworkProvider with a pingInterval to check the connectivity.
import React, { Component } from 'react';
import { Text, View } from 'react-native';
import { ReduxNetworkProvider } from 'react-native-offline';
import { connect } from 'react-redux';
class Home extends Component {
render() {
return (
<ReduxNetworkProvider pingInterval={3000}>
<Text>You're { this.props.isOnline ? 'online' : 'offline' }</Text>
</ReduxNetworkProvider>
);
}
}
function mapStateToProps({ network }) {
return {
isOnline: network.isConnected
}
}
export default connect(mapStateToProps)(Home);
But then I get the following error:

It looks like the ReduxNetworkProvider is not a descendant of the react-redux <Provider> component.
Am I using it the wrong way?
Lib used:
"react": "16.8.3",
"react-native": "0.59.4",
"react-native-navigation": "2.17.0",
"react-native-offline": "4.3.1",
"react-redux": "7.0.2",
"redux": "4.0.1",
"redux-logger": "3.0.6",
"redux-thunk": "2.3.0"
About this issue
- Original URL
- State: closed
- Created 5 years ago
- Reactions: 6
- Comments: 17 (2 by maintainers)
Same here using react-navigation.
Hi,
I searched a solution to use the react-redux ^7.1.0 in my app and to use this package too.
According to the changelog of react-redux, the ^7.1.0 seems be ok for the this package. I looked the code for the ReduxProvider and I didn’t see any requirements to not use ^7.1.0. Someone can confirm ? I don’t know if the other components provided by this package need the ^6.0.0 of react-redux, but for redux, it works on my side.
So to do the tricks with yarn, I used the resolutions method. Add in your package.json :
Then execute and try it in your app.
rm -rf nodes_modulesyarn installLatest version 4.3.2 should resolve the issue, please give it a try