rgommezz/react-native-offline

Failed API request was not added into offline queue when using redux-saga

CrushyChilli opened this issue · 1 comments

Current Behavior

I am trying to call an API request to fetch a list of news under an offline environment.

Actual Behavior

It detects the connectivity normally.
LOG isConnected false
But I cannot see the failed API request inside the offline queue.
LOG state network failed [TypeError: Network request failed] action queue length is 0
The API request should be added into offline queue,
but the offline queue is always empty from newsSaga.js: console.log().
And it does not retry the API when the Internet connectivity back to normal.

saga/newsSaga.js

...
const fetch = require('node-fetch');

export function* newsSaga() {
    yield takeLatest(FETCH_NEWS_REQUESTED, fetchNews);
  }
function* fetchNews(action) {
    try {
        yield call(function(){
            return fetch(
                'http://newsapi.org/v2/everything?q=bitcoin&from=2020-11-21&sortBy=publishedAt&apiKey=API_KEY',
              );
        });
        //This is not executed
        console.log("state network ok",yield select(state=>state.network.actionQueue));
    } catch (e) {
        //This is executed
        console.log("state network failed",e,'action queue length is ',yield select(state=>state.network.actionQueue.length));
        console.log('isConnected',yield select(state=>state.network.isConnected));
    }
 }

saga/index.js

...

export default function* rootSaga() {
    yield all([
        fork(newsSaga),
        fork(networkSaga, { pingInterval: 2000 }),
    ]);
}

store.js

...

const sagaMiddleware = createSagaMiddleware();
const networkMiddleware = createNetworkMiddleware({
    regexActionType: /^\w+/gm,
    queueReleaseThrottle: 200,
  });

let store = createStore(
    rootReducer,
    applyMiddleware(networkMiddleware,sagaMiddleware)
);

sagaMiddleware.run(rootSaga);

export default store;

action/index.js

...

const fetchNews = (data) => {
  return {
    type: FETCH_NEWS_REQUESTED,
    payload: null,
    meta: {
      retry: true
    }
  };
};
export const FETCH_NEWS_REQUESTED = "FETCH_NEWS_REQUEST";

reducer/index.js

...

const rootReducer= combineReducers({
  network,
});

export default rootReducer;

Thank you for your patience~

I found it.
I forgot to add
"yield put(offlineActionCreators.fetchOfflineMode(action));"
inside the Fetch catch error in saga.