Hi, It would be nice add to queue or retry after refreshing the key 401 failed results. maybe some other options. Can you suggest the best way to do so.

Hi,

There is (in my opinion) a big problem by fetching an url to check connectivity as requests are never aborted so if you have an interval of 10s and your timeout is 3s, the code in checkInternetAccess will resolve false but the request is still maintained in stack and waiting for response as in node-fetch you cannot specify a real timeout.
So the problem is when there is a real timeout, fetch requests still waiting in stack got a reject asynchroniously and resolve => isConnected to false but actually you've the connection back.

Anyway it causes a non stable comportement in application, or sometimes you've got a hundred of request responses at once.

Another problem is that it causes a memory leak in app due to hundreds of requests loaded in memory waiting response.

Maybe you should change fetch with something else which is able to properly handle real timeouts ?

For now because of this problem I'm unable to use this in production with checkConnectionInterval parameter and I cannot use it without this parameter as on both platforms (Android and iOs) sometimes I don't have isConnected set back to true when I loose connection and I won it back...

One possible solution would be to abort waiting request when timeout occurs but it's not possible neither with node-fetch :/

Hey!

First off, I want to say that I'm really digging what you're doing with this library! I ran into an issue with the README example here: https://github.com/rauliyohmc/react-native-offline#thunks-config.

For the thunk example, you have

export const fetchUser = (url) => {
  return function thunk(dispatch) {
    fetch(url)
      .then((response) => response.json())
      .then((responseJson) => {
        dispatch({type: FETCH_USER_SUCCESS, payload: responseJson});
      })
      .catch((error) => {
        console.error(error);
      });
  };
  
  thunk.interceptInOffline = true; // This is the important part
};

But that didn't work for me. I had to do this:

export const fetchUser = (url) => {
  // I also prefer arrow functions :)
 const thunk = (dispatch) => { // <-- DON'T RETURN HERE
    fetch(url)
      .then((response) => response.json())
      .then((responseJson) => {
        dispatch({type: FETCH_USER_SUCCESS, payload: responseJson});
      })
      .catch((error) => {
        console.error(error);
      });
  };
  
  thunk.interceptInOffline = true; // This is the important part
  return thunk; // <-- RETURN HERE
};

Beyond that, having a great experience with the library!

I am using this library for displaying no connection screen on mobile. On iOS , I am getting red screen error when my keyboard is displaying on screen and I disconnect internet.

My configurations
"react-native": "^0.42.3",
"react-native-offline": "^3.4.1",

I think that because componentWillUnmount is not called when this library calls no connection screen, this error comes. Can anyone help me to have workaround for same.

Can anyone please suggest me or help me how to resolve this issue

NetInfo is not capable of detecting internet access at all, but rather only connectivity. Cases like an airport, where you automatically connect to WiFi networks but don't get access unless you login would cause false positives. A better approach would be to verify internet access in one of the following ways:

• Ping a server (HEAD request)
• Websocket connection

When retry=true, user may navigate away from the view, so that the re-trigger is not relevant any longer and action can be removed from the queue.

• Move meta property one level up in the action creator parameters (sibling of payload and type) => Breaking change
• Add discard property (sibling of retry) in order to pass an action or array of actions to listen to that would cause the removal from the queue

An typical example while using react-navigation:

 {
  type: FETCH_USER_ID_REQUEST
  payload: {
    id: '3',
  },
  meta: {
    retry: true,
    discard: ['Navigation/NAVIGATE', 'Navigation/BACK']
  },
}

When i compile for developpement everything is workign fine, i am on airplane mode, start a fetch request and middleware catch it, perfect.

As soon as i switch to preprod or release config on Android and IOS, i do the exactly same test with same code, but unfortunately the middleware doesn't catch anything and i end up with this on Android Studio and XCode console :

E/ReactNativeJS: [TypeError: Network request failed]
E/unknown:React: Network request failed, stack:
                                                  onerror@134:13650
                                                  value@124:1505
                                                 etc etc...

Code:

export const getQuizs = (data) => {
let obj={
userId : data.userId,
};
let thunk = (dispatch)=>{
dispatch(loading_start({ type: LOADING_START }));
RestClient.get('quizzes/getMyQuiz',obj).then((response) => {
dispatch(loading_stop({ type: LOADING_STOP }));
}).catch(error => {
dispatch(loading_stop({ type: LOADING_STOP }));
});
}
thunk.interceptInOffline = true; // This is the important part
thunk.meta = {
retry: true, // By passing true, your thunk will be enqueued on offline mode
dismiss: ['NAVIGATE_BACK']
}
return thunk; // Return it afterwards

  After hitting this action in offline mode Null values  are coming in actionView array

Is there any way of delaying all redux actions to be dispatched until offlineActionTypes.CONNECTION_CHANGE action is fired?

Reason being that right now the initial state of the network.isConnected is true and this is an issue when users open apps with no internet connection

Thanks

Thank you so much for this great library. It gives me (a newbie to react-native) a great help in developing an app that works in offline mode using react-native. May i ask if i can add Redux-persist on top of your library by doing something like the following? Thank you so much for your advice.

const store = createStore(
rootReducer,
compose(
applyMiddleware([networkMiddleware, thunk]),
autoRehydrate()
)
);

persistStore(store, { storage: AsyncStorage });

According to the React docs:

componentDidUpdate() is invoked immediately after updating occurs. This method is not called for the initial render.

https://reactjs.org/docs/react-component.html#componentdidupdate

However, when I use export default withNetworkConnectivity()(YourComponent), the componentDidUpdate() event is called even though I'm not changing state nor am I changing my network connectivity status. If I remove withNetworkConnectivity then componentDidUpdate is no longer called.

Is this expected behaviour?

This discussion may be relevant:

withNetworkConnectivity HoC subscribes to connectivity change events after the component that it wraps mounts. Being that component the top most component, there is an implicit delay since React & RN have to render the whole app for the 1st time.

There is full test coverage for networkReducer and createNetworkMiddleware, which are the backbone of the library.

However, It would be great to have unit tests for withNetworkConnectivity as well, since its logic has grown over the last months with new ideas of customisation coming from the community.

I don't have enough time in the near future to tackle it, but would take it eventually if nobody else's offers volunteer :)

Hi,
To use your lib, i had to use babel-plugin-syntax-export-extensions and add it to my .babelrc file.

{
    "presets": [
        "react-native"
    ],
    "plugins": [
        "syntax-export-extensions"
    ]
}

When using this react-native-navigation there is no root component, so I needed to wrap each screen. Or is there another way of doing this?

export const registerScreens = () => {
  Navigation.registerComponent('Login', () => connect(mapStateToProps, mapDispatchToProps)(withNetworkConnectivity()(Login)), store, Provider)
  Navigation.registerComponent('Home', () => connect(mapStateToProps, mapDispatchToProps)(withNetworkConnectivity()(Home)), store, Provider)
}

There is an issue with the screen options that are not working anymore. I think statics are not passed within withNetworkConnectivity. Example:

export default class Home extends Component {
    static navigatorStyle = {
       tabBarHidden: true,
       navBarHidden: true
    }
    ...
}

It seems there is a problem with the way you export your module or the way I use it ..
when I try to import the reducer, i've got this error
import { reducer as network } from 'react-native-offline-utils';
-> ExceptionsManager.js:71 No reducer provided for key "network"

Hi there,

First of all : great lib, came at the right moment and is really straightforward and great !

I want to discuss the possibility to be able, from the createNetworkMiddleware function, to configure the thunk-actions to be retry

I wanted to discuss that because actually my implementation looks like this :

• I have a bunch of thunk actions (a lot actually) that I transformed into a named function with name pattern that ends with Thunk

export const loadAllOtopsFromMyCommunity = () => {
    function loadAllOtopsFromMyCommunityThunk(dispatch, getState) {
        dispatch({ type: types.FETCH_REQUEST });
        const options = { /* ...*/ };

        fetch(`${URL}/api/otops/getfriendsotops`, options)
            .then(res => res.json())
            .then(otops => dispatch({
                type: types.FETCH_REQUEST_SUCCESS,
                payload: otops
            })).catch(err => dispatch({
                type: types.FETCH_REQUEST_FAILURE,
                error: err
            }));
    }
    return loadAllOtopsFromMyCommunityThunk;
};

And then I created a middleware : interceptInOfflineEveryThunkAction which looks like this :

const interceptInOfflineEveryThunkAction = store => next => action => {

    if (action == null) {
        return null;
    }
    if (typeof action === 'function') {
        const thunkActionsToRetry = [
            'loadSomethingThunk',
            'fetchUserDataThunk',
        ];

        thunkActionsToRetry.forEach(thunkName => {
            if (thunkName === action.name) {
                action.meta = { retry: true };
            }
        });

        action.interceptInOffline = true;
        return next(action);
    }
    return next(action);
};

And so that saved me the pain of having to put the .meta = { retry: true }, and so I was wondering if you find useful to add a : 'thunkNameToRetry' property to the config object that will accept function names in order to do this during the createNetworkMiddleware() call

Really I don't know if this might be helpful, the implementation is newbie (so am I) so if it is out of context then fine haha

Thanks for the great work

if you use a server that does not support HEAD (i tried with https://spaces.archilogic.com), it always reports offline.

These servers report a 405 error on the HEAD command.

you can test that with curl -i --head https://spaces.archilogic.com

Version: 3.7.0

I've just tried to upgrade to 3.7.0, I received the:

Unable to resolve module redux-saga/effects from <app path>/node_modules/react-native-offline/src/saga.js: Module does not exist.

Given the standard 3 options to fix: clear watchman, remove and reinstall node modules, reset metro bundler cache.

None of the above worked. When looking at the redux-saga source code, under the effects directory, there is no module, it's just a package.json. I'm not sure if the issue is redux-saga or this library.

Thoughts?

I see that the pinging keeps running even if the app is backgrounded.

What do you think about adding an option for configuring this behaviour? It might not always be good that the pinging continues endlessly when the app is background.

PS. Great job on making this library, @rauliyohmc! Thanks a lot.

Is RN 0.49 supported with all features?

As per #23 (comment)

I just started a new app and have been testing out react-native-offline. I followed the instructions on the readme to get redux, redux-saga, and react-native-offline working together and everything seems to be working correctly except that the actionQueue does not dispatch the actions when coming back online.

When I switch to airplane mode on my phone I can see the actions going into the actionQueue. When I switch out of airplane mode I can see that the phone is connecting again but the actionQueue doesn't dispatch the actions in the queue.

My app is using the following packages:

• react-native 0.52
• react-redux 5.0.6
• redux 3.7 .2
• redux-saga 0.16.0
• react-native-offline 3.7.1

I tracked the issue down to the handleConnectivityChange function in src/sagas.js.

function* handleConnectivityChange(
  hasInternetAccess: boolean,
): Generator<*, *, *> {
  yield put(connectionChange(hasInternetAccess));
  const actionQueue = select(
    (state: { network: NetworkState }) => state.network.actionQueue,
  );

  if (hasInternetAccess && actionQueue.length > 0) {
    // eslint-disable-next-line
    for (const action of actionQueue) {
      yield put(action);
    }
  }
}

More specifically the const actionQueue = select(...) line. I believe this line should be:

const actionQueue = yield select(...)

Without the yield keyword it returns something that looks like a function instead of an array. This is the output in the Xcode console:

SELECT: { selector: [Function], args: [] } }

When I add yield in front of the call to select everything works as expected.

I can create a pull request for this but the readme mentioned creating an issue first. If you'd like a PR just let me know.

Thanks!

I've been using this with a Redux-connected component as described in https://github.com/rauliyohmc/react-native-offline#integration-with-redux and it's been great so far, however, one thing I'd like to do is be able to test the "offline behavior" while not actually in airplane mode.

Is it possible to introduce a boolean flag, for use in Dev only, that will allow me to do this? In other words: where would I be able to hook into this library, preferably in a single place, that will allow me to override isConnected to be true/false using an env var?

While internet is connected, when i get the success response from the server i am navigating to different screen.
But how to dismiss the navigation action when i am in offline mode. As soon as internet connected it action is dispatched and goes to another screen from the current screen.
mood.interceptInOffline = true; mood.meta = { retry: true, dismiss: ["SUBMITTING"] }; return thunk;

this is the sample code i am using .HELP WANTED

Thank u.

This is an issue I'm struggling with on my current project. What would be very very useful is an example project to show typical usage.

So sort of something like this repository: https://github.com/spencercarli/offline-redux-actions, for this article: https://medium.com/differential/handling-offline-actions-in-react-native-74949cbfabf2

Here is my code for just getting isconnected in redux state

import { reducer as network } from 'react-native-offline';

const AppReducer = combineReducers({
  nav,
  maindata,
  network,
});

const sagaMiddleware = createSagaMiddleware();
const store = createStore(AppReducer,applyMiddleware(sagaMiddleware));
sagaMiddleware.run(rootSaga)
export default store;

I have tried with middleware nothing seems to work for me ..

Can you provide some working example ? with redux or with middleware like redux-saga.

Packages in use:

• redux
• react-redux
• reduxsauce
• redux-persist
• redux-saga
• redux-logger
• seamless-immutable

I'm trying to set up offline use.
I set up the reducer:

import { combineReducers } from 'redux';
import { reducer as networkReducer } from 'react-native-offline';

import configActions, { reducer as configReducer } from './configStore';
import initActions, { reducer as initReducer } from './initStore';
import loginActions, { reducer as loginReducer } from './loginStore';
import navigationActions, { reducer as navigationReducer } from './navigationStore';
import uiActions, { reducer as uiReducer } from './uiStore';
import userActions, { reducer as userReducer } from './userStore';

export default combineReducers({
    config: configReducer,
    init: initReducer,
    login: loginReducer,
    navigation: navigationReducer,
    network: networkReducer,
    ui: uiReducer,
    user: userReducer
});

export {
    configActions,
    initActions,
    loginActions,
    navigationActions,
    uiActions,
    userActions
};

And I added the middleware:

import { applyMiddleware, createStore, compose } from 'redux';
import { persistStore, autoRehydrate } from 'redux-persist';
import { createNetworkMiddleware } from 'react-native-offline';
import createSagaMiddleware from 'redux-saga';
import { createLogger } from 'redux-logger';

import rootReducer, { initActions } from './index';
import { reduxPersist } from '../config';
import rootSaga from '../sagas';

// onComplete remove loading
export default (onComplete) => {
    const middlewares = [];
    const enhancers = [];
    const networkMiddleware = createNetworkMiddleware({ regexActionType: /.*_REQUEST/ });
    const sagaMiddleware = createSagaMiddleware();

    middlewares.push(networkMiddleware);
    middlewares.push(sagaMiddleware);

    if (__DEV__) {
        const loggerMiddleware = createLogger();
        middlewares.push(loggerMiddleware);
    }

    enhancers.push(applyMiddleware(...middlewares));
    enhancers.push(autoRehydrate());

    const store = createStore(rootReducer, undefined, compose(...enhancers));
    sagaMiddleware.run(rootSaga);

    if (reduxPersist.active) {
        // REHYDRATE dispatches READY action
        persistStore(store, reduxPersist.config, onComplete);
    } else {
        // Manual dispatch READY action
        store.dispatch(initActions.initialize());
        onComplete();
    }

    return store;
};

My startup Saga:

import { put } from 'redux-saga/effects';
import {
    configActions,
    initActions
} from '../redux';

export function* initialize() {
    yield put(configActions.configRequest({ message: 'Loading...' }, { retry: true }));
    yield put(initActions.ready());
}

My config redux store config:

import { createActions, createReducer } from 'reduxsauce';

/* ------------- Types and Action Creators ------------- */
const { Types, Creators } = createActions({
    configRequest: ['payload', 'meta'],
    configSuccess: ['payload']
});
// Initial state and reducers...

But I do not see the action @@ network-connectivity/FETCH_OFFLINE_MODE being dispatched.
I also can not see an action that has triggered on the app startup, being intercepted, added to the offline queue and then re-dispatched when the connection returns.

What can I do to resolve this?
Below my resumed log from redux-logger:

action persist/REHYDRATE @ 19:35:46.381
action CONFIG_REQUEST @ 19:35:46.394 // <-- this is the action that I want to intercept
action Object {
    type: "CONFIG_REQUEST",
    payload: {message: "Loading..."},
    meta: {retry: true},
    @@redux-saga/SAGA_ACTION: true
}
action READY @ 19:35:46.401 // <-- action thats enable aplication interface
action @@network-connectivity/CONNECTION_CHANGE @ 19:35:46.794
action Object {type: "@@network-connectivity/CONNECTION_CHANGE", payload: false}
action @@network-connectivity/CONNECTION_CHANGE @ 19:35:52.098
action Object {type: "@@network-connectivity/CONNECTION_CHANGE", payload: true}

My suspicion is because that the offline action is dispatched after the CONFIG_REQUEST action, the middleware can not intercept and action is not added to offline queue.

I am getting error

Invariant Violation: Element type is invalid: expected a string (for built-in components) or a class/function (for composite components) but got: undefined. You likely forgot to export your component from the file it's defined in.

Check the render method of `ConnectivityRenderer`.

This error is located at:
    in ConnectivityRenderer (at Racelist.js:620)
    in RCTView (at View.js:113)

here is my simple code ..

import { ConnectivityRenderer } from 'react-native-offline';

render(){
return(
<View>
<ConnectivityRenderer>
                     {isConnected => (
                       <SnackBar
                         message="You are currently offline"
                         showIf={!isConnected}
                         duration={3000}
                       />
                     )}
                  </ConnectivityRenderer>
</View>
);
} 

I am checking whether my phone is online or not using below code.
const { isConnected } = this.props;
But it first returns true but instantly it returns false.
Please let me know what I am doing wrong.

Hi,
I'm using react-native-offline with redux, i followed all steps in the readme. I am using thunks like

export const deleteMail = (mailIds) => {

   function doDeleteMail(dispatch) {
    dispatch(deleteMailRequest)
    const params = {
      path: 'emails/moveToTrash/',
      method: 'PUT',
      body: {
        "messageIds": mailIds      
      },
    }
    fetch(apiRequest(params))
    .then(response => {
      errorHandler(response, true)
      .then(() => dispatch(deleteMailSuccess))
      .catch(error => console.log(error))
    })
    .catch(error => dispatch(deleteMailFailure(error)))
  }
  
  doDeleteMail.meta = {
    retry: true
  }
  
  doDeleteMail.interceptInOffline = true;
  
  return doDeleteMail;
}

but even if i turn on the airplane mode, network.isConnected stay at true. I tried to change checkConnectionInterval in withNetworkConnectivity config but nothing change.

Do you see an error in my code? There is someone with same issue?
RN : 0.47.2
react-native-offline : 3.5.0
Testing on android device

As per a brief exchange with @rauliyohmc on #49, I would like to open an issue to discuss modifying how react-native-offline writes to the meta namespace. In my use case, I have had to rename a metadata key in my production code from dismiss to something else because the meta namespace is hardcoded in the project. This was found after a fair bit of debugging thinking there was a bug with react-native-offline when in fact it was just a namespace collision.

What would be great is to be able to programatically change the namespace (for example, action.meta.foo.bar instead of action.meta) so that projects can avoid namespace collisions.

I am trying to understand something that is perhaps more related to redux code patterns but is highly relevant to my usage of this library. Consider the situation where I am trying to fetch a users Id. I would dispatch a function such

const fetchUserID = (userID) => {
  function thunk(dispatch) {
    const USER = { userID: userID };

    const USER_POST_URI =
      "https://someURL.com/users/create-user";

    fetch(USER_POST_URI, {
      headers: new Headers({
        Accept: "application/json",
        "Content-Type": "application/json"
      }),
      method: "POST",
      body: JSON.stringify(USER)
    })
      .then(res => {
        if (res.status == 200) {
          const XAUTH_TOKEN = res.headers.map["x-auth"][0];
          dispatch(actions.setUserToken(XAUTH_TOKEN));
          return res.json();
        } else {
          throw new Error("Something wrong with the server!");
        }
      })
      .then(data => {
        dispatch(actions.setUserID(data._id));
      })
      .catch(error => {
        console.error(error);
      });
  }
  thunk.interceptInOffline = true;
  return thunk;
};

Upon dispatching this action, if I was offline react-native-offline would place this action into an action queue to be retried later, and the following code (as taken from the docs in this repo) could be implemented to specify that the 'FETCH_USER_ID' action criteria for re-dispatching.

const fetchAction = {
  type: 'FETCH_USER_ID',
  payload: {
    id: 2
  },
  meta: {
    retry: true,
    dismiss: ['NAVIGATE_BACK']
  }
};

What I don't understand is how to link this 'FETCH_USER_ID' action type with my fetchUserID function. If the 'fetchAction' above is dispatched, it specifies with type 'FETCH_USER_ID' in my reducers which piece of state to change, however, it is not recommended to dispatch an async action such as 'fetchUserID' from within the reducer, so how do I state that 'fetchUserID' is represented by the 'FETCH_USER_ID' action type to be dispatched.

Sorry if this is a bit confusing or verbose. I sense that there is something pretty simple or fundamental that I'm missing here, though having a difficult time explaining it. Any insight would be appreciated, and if there is any progress of a full example, this would be really useful. Thanks!

Hello,

It would be really apreciated if you could show us an exemple on how to use your usefull library with Redux Thunk and Redux Persist.
I tried to do it without success. How do we have to initialise the middleware ?

I have anything like this :

import {persistStore, autoRehydrate} from "redux-persist";
import {applyMiddleware, createStore, compose} from "redux";
import {AsyncStorage} from "react-native";
import thunk from "redux-thunk";
import reducers from './reducers';

import {createNetworkMiddleware} from 'react-native-offline';

const middlewares = [thunk,createNetworkMiddleware];


store = createStore(reducers, undefined, compose(
        applyMiddleware(...middlewares),
        autoRehydrate()
    ));


persistStore(store, {storage: AsyncStorage});

export default store;

Thanks in advance, and good job for the library.

I've noticed the event listener on NetInfo.isConnected isn't getting removed properly. It seems this was introduced in Added ability to check connectivity regularly (#32).

See:

    componentDidMount() {
      NetInfo.isConnected.addEventListener(
        'connectionChange',
        withExtraHeadRequest ? this.checkInternet : this.handleNetInfoChange,
      );
    }

and

    componentWillUnmount() {
      NetInfo.isConnected.removeEventListener(
        'connectionChange',
        withExtraHeadRequest
          ? this.handleNetInfoChange
          : this.handleConnectivityChange,
      );
    }

I'm assuming, based on the change, that the addEventListener should be using this.handleNetInfoChange and this.handleConnectivityChange, though I'm not familiar enough with the project to say that with full confidence.

https://facebook.github.io/react-native/docs/netinfo.html#effectiveconnectiontype-enum

The network reducer state will have the next shape:

type NetworkState = {
  isConnected: boolean,
  connectionType: '2g' | '3g' | '4g' | 'unknown',
  actionQueue: Array<*>
}

That will allow the user to dynamically set different timeouts for API calls, depending on the connection quality.

hi,

your event listener NetInfo.isConnected.addEventListener('change', this.checkInternet) is deprecated will you update the module for fix this?

thanks

When I disable wifi it works fine, the isConnected property is updated and everything, when I enable it back the app freezes and shows this error on Xcode:

This doesn't happen every time, sometimes it works enabling it back but then crashes when I disable and enable again.

I'm not sure if this a react-native-offline-related issue, it seems to happen with react-native's NetInfo as well, everything works fine if I simulate updating isConnected property on the store with a setInterval function.

Code

import { reducer as network } from 'react-native-offline';

// ...

export default combineReducers({
  // ...
  network,
});

import { withNetworkConnectivity } from 'react-native-offline';

class Main extends Component {
  // ...
} 

export default withNetworkConnectivity({
  withRedux: true,
})(connect(mapStateToProps, mapDispatchToProps)(Main));

class MyComponent extends Component {
  render() {
    if (this.props.network.isConnected) {
      return (
        <View>
          <Text>Not connected</Text>
        </View>
      );
    }

    return (
        <View>
          <Text>My awesome view</Text>
        </View>
    );
  }
}

const mapStateToProps = ({ network }) => ({
  network,
});

export default connect(mapStateToProps)(MyComponent);

Versions

• maxOS: Sierra 10.12.6
• iOS: 10.3.3
• react-native: 0.47.2
• react-native-offline: 3.1.0

Hi guys

This might be a stupid question, but I can't seem to figure it out from the docs.

I am trying to call a different onPress() function from my component, depending on whether an internet connection exists or not.

So for example:

foo() => {
//if connected
return "Connected!"
//else
return "Not connected"
}

<Button onPress={ this.foo() } />

I can't seem to get this right. I have applied it via the ConnectivityRenderer component currently, but that requires me to duplicate the entire component, whereas I just want to change the onPress method.

I feel like there is something obvious I'm missing, and I was hoping one of you could help me out.

Hello,

I didn't found a way to manually trigger a connectivityCheck in the code, is there a way to do this ?

Thanks.

It will cause an inconsistent state if we start up the app in offline mode

Follow up the thread on: facebook/react-native#8615
A couple of potential workarounds have been proposed.

Works fine on real devices

Would really like to use your library but got this error right off the bat:

hello,

when i use this module with redux-persist, if i have a actionQueue when i kill app, on resume i have always an error because it restore the actionQueue with an Array of null value.
Anyone else have this error?

thanks

Thanks for the great offline library. When i run it in a real android. the following issues are found:

1. If i run the thunk actioncreator function in componentDidMount when there is no network (turn off wifi and 4G in the mobile phone), thunk return function will not be called when the network is resumed.

2. There are occasions when the library cannot detect the network condition correctly.
   a) when i enter into a lift of a high-rise building, network-off condition is detected correctly. However, when the real network is back after i come out from the lift, network-on condition is not detected.

b) bringing the app back from the background to the foreground, network-on condition is always not detected.

May i seek for your help?

Thank you very much.

In the readme, we have

import { createStore, applyMiddleware } from 'redux';
import { createNetworkMiddleware } from 'react-native-offline';
import createSagaMiddleware from 'redux-saga';

const sagaMiddleware = createSagaMiddleware();
const networkMiddleware = createNetworkMiddleware();

const store = createStore(
  rootReducer,
  applyMiddleware([networkMiddleware, sagaMiddleware])
);

I do not know if it is the same for sagaMiddleware but for redux-thunk, we need to use applyMiddleware without an array like:

const store = createStore(
  rootReducer,
  applyMiddleware(networkMiddleware, thunk)
);

So, question, is it the readme which is not up to date or it is just redux-thunk working differently ?(or it is only just for me ^^)