react-native-offline - npm Package Compare versions

Comparing version 4.2.0 to 4.3.0-beta.0

package.json

 {
   "name": "react-native-offline",
-  "version": "4.2.0",
+  "version": "4.3.0-beta.0",
   "description": "Handy toolbelt to deal with offline mode in React Native applications. Cross-platform, provides a smooth redux integration.",
@@ -74,3 +74,3 @@ "main": "./src/index.js",
     "react-redux": "^6.0.0",
-    "redux":"4.x",
+    "redux": "4.x",
     "redux-saga": "^0.16.2"
@@ -77,0 +77,0 @@ },

README.md

@@ -11,2 +11,5 @@ # react-native-offline
 
+## Example app
+A comprehensive [example app](/example) is available within Expo to play with the library and better understand its different modules. [Go and check it out!](https://expo.io/@rgommezz/example)
+
 ## Contents
@@ -13,0 +16,0 @@

src/components/ReduxNetworkProvider.js

@@ -16,3 +16,2 @@ /* @flow */
   isConnected: boolean,
-  actionQueue: Array<FluxAction>,
   pingTimeout?: number,
@@ -40,13 +39,6 @@ pingServerUrl?: string,
   handleConnectivityChange = (isConnected: boolean) => {
-    const { isConnected: wasConnected, actionQueue, dispatch } = this.props;
-
+    const { isConnected: wasConnected, dispatch } = this.props;
     if (isConnected !== wasConnected) {
       dispatch(connectionChange(isConnected));
     }
-    // dispatching queued actions in order of arrival (if we have any)
-    if (!wasConnected && isConnected && actionQueue.length > 0) {
-      actionQueue.forEach((action: *) => {
-        dispatch(action);
-      });
-    }
   };
@@ -70,3 +62,2 @@
     isConnected: state.network.isConnected,
-    actionQueue: state.network.actionQueue,
   };
@@ -73,0 +64,0 @@ }

src/redux/createNetworkMiddleware.js

@@ -9,4 +9,4 @@ /* @flow */
 } from './actionCreators';
-import getSimilarActionInQueue from '../utils/getSimilarActionInQueue';
 import type { NetworkState } from '../types';
+import networkActionTypes from './actionTypes';
 
@@ -27,2 +27,47 @@ type MiddlewareAPI<S> = {
 
+function validateParams(regexActionType, actionTypes) {
+  if ({}.toString.call(regexActionType) !== '[object RegExp]')
+    throw new Error('You should pass a regex as regexActionType param');
+
+  if ({}.toString.call(actionTypes) !== '[object Array]')
+    throw new Error('You should pass an array as actionTypes param');
+}
+
+function findActionToBeDismissed(action, actionQueue) {
+  return find(actionQueue, (a: *) => {
+    const actionsToDismiss = get(a, 'meta.dismiss', []);
+    return actionsToDismiss.includes(action.type);
+  });
+}
+
+function isObjectAndShouldBeIntercepted(action, regexActionType, actionTypes) {
+  return (
+    typeof action === 'object' &&
+    (regexActionType.test(action.type) || actionTypes.includes(action.type))
+  );
+}
+
+function isThunkAndShouldBeIntercepted(action) {
+  return typeof action === 'function' && action.interceptInOffline === true;
+}
+
+function checkIfActionShouldBeIntercepted(
+  action,
+  regexActionType,
+  actionTypes,
+) {
+  return (
+    isObjectAndShouldBeIntercepted(action, regexActionType, actionTypes) ||
+    isThunkAndShouldBeIntercepted(action)
+  );
+}
+
+function didComeBackOnline(action, wasConnected) {
+  return (
+    action.type === networkActionTypes.CONNECTION_CHANGE &&
+    !wasConnected &&
+    action.payload === true
+  );
+}
+
 function createNetworkMiddleware({
@@ -35,46 +80,38 @@ regexActionType = /FETCH.*REQUEST/,
   ) => (action: any) => {
-    if ({}.toString.call(regexActionType) !== '[object RegExp]')
-      throw new Error('You should pass a regex as regexActionType param');
-
-    if ({}.toString.call(actionTypes) !== '[object Array]')
-      throw new Error('You should pass an array as actionTypes param');
-
     const { isConnected, actionQueue } = getState().network;
 
-    const isObjectAndMatchCondition =
-      typeof action === 'object' &&
-      (regexActionType.test(action.type) || actionTypes.includes(action.type));
+    validateParams(regexActionType, actionTypes);
 
-    const isFunctionAndMatchCondition =
-      typeof action === 'function' && action.interceptInOffline === true;
+    const shouldInterceptAction = checkIfActionShouldBeIntercepted(
+      action,
+      regexActionType,
+      actionTypes,
+    );
 
-    if (isObjectAndMatchCondition || isFunctionAndMatchCondition) {
-      if (isConnected === false) {
-        // Offline, preventing the original action from being dispatched.
-        // Dispatching an internal action instead.
-        return next(fetchOfflineMode(action));
-      }
-      const actionQueued =
-        actionQueue.length > 0
-          ? getSimilarActionInQueue(action, actionQueue)
-          : null;
-      if (actionQueued) {
-        // Back online and the action that was queued is about to be dispatched.
-        // Removing action from queue, prior to handing over to next middleware or final dispatch
-        next(removeActionFromQueue(action));
+    if (shouldInterceptAction && isConnected === false) {
+      // Offline, preventing the original action from being dispatched.
+      // Dispatching an internal action instead.
+      return next(fetchOfflineMode(action));
+    }
 
-        return next(action);
-      }
+    const isBackOnline = didComeBackOnline(action, isConnected);
+    if (isBackOnline) {
+      // Dispatching queued actions in order of arrival (if we have any)
+      next(action);
+      return actionQueue.forEach((a: *) => {
+        next(removeActionFromQueue(a));
+        next(a);
+      });
     }
 
-    // We don't want to dispatch actions all the time, but rather when there is a dismissal case
-    const isAnyActionToBeDismissed = find(actionQueue, (a: *) => {
-      const actionsToDismiss = get(a, 'meta.dismiss', []);
-      return actionsToDismiss.includes(action.type);
-    });
+    // Checking if we have a dismissal case
+    const isAnyActionToBeDismissed = findActionToBeDismissed(
+      action,
+      actionQueue,
+    );
     if (isAnyActionToBeDismissed && !isConnected) {
       next(dismissActionsFromQueue(action.type));
-      return next(action);
     }
 
+    // Proxy the original action to the next middleware on the chain or final dispatch
     return next(action);
@@ -81,0 +118,0 @@ };

src/redux/sagas.js

@@ -211,12 +211,6 @@ /* @flow */
 ): Generator<*, *, *> {
-  const { actionQueue, isConnected } = yield select(networkSelector);
+  const { isConnected } = yield select(networkSelector);
   if (isConnected !== hasInternetAccess) {
     yield put(connectionChange(hasInternetAccess));
   }
-  if (hasInternetAccess && actionQueue.length > 0) {
-    // eslint-disable-next-line
-    for (const action of actionQueue) {
-      yield put(action);
-    }
-  }
 }
@@ -223,0 +217,0 @@

New alerts

License Policy Violation

License

This package is not allowed per your license policy. Review the package's license to ensure compliance.

Found 1 instance in 1 package

No v1

Quality

Package is not semver >=1. This means it is not stable and does not support ^ ranges.

Found 1 instance in 1 package

Fixed alerts

License Policy Violation

License

This package is not allowed per your license policy. Review the package's license to ensure compliance.

Found 1 instance in 1 package

Improved metrics

Total package byte prevSize

68541

increased by0.67%

Number of package files

22

increased by4.76%

Lines of code

1020

increased by2%

Number of lines in readme file

678

increased by0.44%

Worsened metrics

Number of low quality alerts

1

increased byInfinity%

No dependency changes