don't go to _actions.QUEUE_ACTION
Closed this issue · 2 comments
I do not use in the project - saga
But the fact that I understood with documentation and example, my logic does not work.
After the connection has appeared - the request that has been queued is not sent
Please help me with the connection
step 1.
import { combineReducers } from 'redux';
import search from './search/reducer';
import network from './network/reducer';
import profile from './profile/reducer';
export default combineReducers({
network,
profile,
search,
offline: require('redux-offline-queue').reducer
});
step 2.
import { applyMiddleware, createStore } from 'redux';
import reduxThunk from 'redux-thunk';
import networkTracker from '../middleware/networkTracker';
import apiMiddleware from '../middleware/api';
import errorMiddleware from '../middleware/error';
import rootModuleReducer from '../modules';
import { composeWithDevTools } from 'redux-devtools-extension/developmentOnly';
import { offlineMiddleware } from 'redux-offline-queue';
import { REHYDRATE } from 'redux-persist';
const configureStore = initialState => {
const store = createStore(
rootModuleReducer,
initialState,
composeWithDevTools(
applyMiddleware(networkTracker, reduxThunk, apiMiddleware, errorMiddleware, offlineMiddleware({ additionalTriggers: REHYDRATE }))
)
);
return store;
};
export default configureStore;
step 3.
export const searchTickets = (ID, value) => ({
type: CALL_API,
payload: {
types: [FETCH_SEARCH_REQUEST, FETCH_SEARCH_SUCCESS, FETCH_SEARCH_FAILURE],
promise: searchTicketsRequest(ID, value, 1)
}
});
markActionsOffline({ searchTickets }, ['searchTickets']);
step 4.
import { NetInfo } from 'react-native';
import { CHANGE_NETWORK, CLOSE_OFFLINE_BAR } from './actionTypes';
import { OFFLINE, ONLINE } from 'redux-offline-queue';
export const startNetworkTracking = () => (dispatch, getState) => {
NetInfo.isConnected.addEventListener('connectionChange', isConnected => {
dispatch({
type: CHANGE_NETWORK,
isOnline: isConnected,
isOfflineBarOpened: !isConnected
});
dispatch({ type: isConnected ? ONLINE : OFFLINE });
});
return NetInfo.isConnected
.fetch()
.then(isConnected =>
dispatch({
type: CHANGE_NETWORK,
isOnline: isConnected,
isOfflineBarOpened: !isConnected
})
)
.catch(() =>
dispatch({
type: CHANGE_NETWORK,
OFFLINE,
isOnline: false,
isOfflineBarOpened: true
})
);
};
export const closeOfflineBar = () => ({
type: CLOSE_OFFLINE_BAR
});
I think that maybe the problem is in my "networkTracker"
import { CALL_API } from './api';
export default store => next => action => {
if (!action) {
return false;
}
const { network } = store.getState();
const isNetworkAction = typeof action === 'function' ? !action.isOffline : action.type === CALL_API || action.type.indexOf('REQUEST') != -1;
if (!network.isOnline && isNetworkAction) {
return Promise.reject('Network is offline');
}
return next(action);
};
I analyzed action.type in function reducer(redux-offline-queue=>lib=>reduser.js) and i don't go to _actions.QUEUE_ACTION
CHANGE_NETWORK
redux-offline-queue/OFFLINE
requestApi.js:23 /tickets?ticket_id=52123&page=1
spread.js:23 interceptor error undefined
YellowBox.js:67 Possible Unhandled Promise Rejection (id: 0):
"Network is offline"
YellowBox.js:67 Possible Unhandled Promise Rejection (id: 1):
Object {
"reason": Array [
"Network Error",
],
"status": 500,
}
reducer.js:19 CHANGE_NETWORK
reducer.js:19 redux-offline-queue/ONLINE
reducer.js:19 redux-offline-queue/RESET_QUEUE
but when in markActionsOffline I console.log(offlineActions) => I can see my action ["searchTickets"]
maybe this will help to understand the problem
@Ann1995 Try and place the offlineMiddleware
first in your createStore. Also depending on how you plan to use this you may want to add consumeActionMiddleware
to your applyMiddleware
as the last middleware. I am not sure how you intend to use this, if you just want to re run the reducer or if you want to suspend your redux thunk calls and still run the reducers? because redux thunk has not been tested and there has been some reports so it is still unclear to me if it does.