react-remote-resource - npm Package Compare versions

Comparing version 1.0.1 to 1.0.2

.size-snapshot.json

 {
   "dist/index.js": {
-    "bundled": 8743,
-    "minified": 4591,
-    "gzipped": 1574,
+    "bundled": 8212,
+    "minified": 4272,
+    "gzipped": 1508,
     "treeshaked": {
       "rollup": {
-        "code": 1094,
+        "code": 885,
         "import_statements": 233
       },
       "webpack": {
-        "code": 2341
+        "code": 2124
       }
@@ -17,5 +17,5 @@ }
   "dist/index.cjs.js": {
-    "bundled": 10197,
-    "minified": 5428,
-    "gzipped": 1688
+    "bundled": 9553,
+    "minified": 5042,
+    "gzipped": 1618
   },
@@ -22,0 +22,0 @@ "dist/esm.js": {

dist/index.cjs.js

@@ -16,4 +16,2 @@ 'use strict';
 
-var LOADING_ENTRY = "LOADING_ENTRY";
-var LOADING_ENTRY_FAILED = "LOADING_ENTRY_FAILED";
 var RECEIVE_ENTRY_DATA = "RECEIVE_ENTRY_DATA";
@@ -23,4 +21,3 @@ var Entry = immutable.Record({
   data: Maybe.Nothing(),
-  updatedAt: Maybe.Nothing(),
-  loadPromise: Maybe.Nothing()
+  updatedAt: Maybe.Nothing()
 }, "RemoteResourceEntry");
@@ -34,14 +31,2 @@
   switch (action.type) {
-    case LOADING_ENTRY:
-      return state.merge({
-        id: action.entryId,
-        loadPromise: Maybe.of(action.promise)
-      });
-
-    case LOADING_ENTRY_FAILED:
-      return state.merge({
-        id: action.entryId,
-        loadPromise: Maybe.Nothing()
-      });
-
     case RECEIVE_ENTRY_DATA:
@@ -51,4 +36,3 @@ return state.merge({
         data: Maybe.fromNullable(action.data),
-        updatedAt: ramda.isNil(action.data) ? Maybe.Nothing() : Maybe.of(action.now),
-        loadPromise: Maybe.Nothing()
+        updatedAt: ramda.isNil(action.data) ? Maybe.Nothing() : Maybe.of(action.now)
       });
@@ -125,14 +109,5 @@
 var createRemoteResource = function createRemoteResource(_ref) {
-  var _ref$load = _ref.load,
-      load = _ref$load === void 0 ? function () {
-    return Promise.resolve();
-  } : _ref$load,
-      _ref$save = _ref.save,
-      save = _ref$save === void 0 ? function () {
-    return Promise.resolve();
-  } : _ref$save,
-      _ref$delete = _ref.delete,
-      destroy = _ref$delete === void 0 ? function () {
-    return Promise.resolve();
-  } : _ref$delete,
+  var load = _ref.load,
+      save = _ref.save,
+      destroy = _ref.delete,
       _ref$initialValue = _ref.initialValue,
@@ -151,4 +126,6 @@ initialValue = _ref$initialValue === void 0 ? null : _ref$initialValue,
   var resourceId = uuid();
+  var loadingPromisesByEntryId = new Map();
   return {
     id: resourceId,
+    loadingPromisesByEntryId: loadingPromisesByEntryId,
     createEntryId: createEntryId,
@@ -196,3 +173,4 @@ initialValue: initialValue,
   var children = _ref.children,
-      onLoadError = _ref.onLoadError,
+      _ref$onLoadError = _ref.onLoadError,
+      onLoadError = _ref$onLoadError === void 0 ? function () {} : _ref$onLoadError,
       _ref$fallback = _ref.fallback,
@@ -251,4 +229,6 @@ fallback = _ref$fallback === void 0 ? null : _ref$fallback,
     }, [data]),
-    refresh: function refresh() {
-      return resource.load.apply(resource, args).then(function (data) {
+    refresh: React.useCallback(function () {
+      return resource.loadingPromisesByEntryId.get(entryId) || // We need to store the promise so that if the component gets re-mounted
+      // while the promise is pending we have the ability to throw it.
+      resource.loadingPromisesByEntryId.set(entryId, resource.load.apply(resource, args).then(function (data) {
         resource.dispatch({
@@ -260,10 +240,6 @@ type: RECEIVE_ENTRY_DATA,
         });
-      }).catch(function (error) {
-        registerError(error);
-        resource.dispatch({
-          type: LOADING_ENTRY_FAILED,
-          entryId: entryId
-        });
-      });
-    }
+      }).catch(registerError).finally(function () {
+        resource.loadingPromisesByEntryId.delete(entryId);
+      })).get(entryId);
+    }, args)
   };
@@ -305,8 +281,6 @@
   }).getOrElse(data === resource.initialValue);
-  var loadPromise = maybeEntry.chain(function (entry) {
-    return entry.loadPromise;
-  }).getOrElse(null);
+  var loadPromise = resource.loadingPromisesByEntryId.get(entryId);
   var actions = useResourceActions(resource, args);
   React.useEffect(function () {
-    return (// Important! The return value is used to unsubsribe from the store when necessary.
+    return (// Important! The return value is used to unsubscribe from the store when necessary.
       resource.onChange(function () {
@@ -320,11 +294,3 @@ setEntry(resource.getEntry(entryId));
   if (isFirstRender && cacheInvalid && !loadPromise) {
-    var promise = actions.refresh(); // We need to store the promise so that if the component gets re-mounted
-    // while the promise is pending we have the ability to throw it.
-
-    resource.dispatch({
-      type: LOADING_ENTRY,
-      entryId: entryId,
-      promise: promise
-    });
-    throw promise;
+    throw actions.refresh();
   } else if (loadPromise) {
@@ -331,0 +297,0 @@ throw loadPromise;

dist/index.js

@@ -5,8 +5,6 @@ import _extends from '@babel/runtime/helpers/esm/extends';
 import { isNil } from 'ramda';
-import { Record, Map } from 'immutable';
+import { Record, Map as Map$1 } from 'immutable';
 import Maybe from 'data.maybe';
 import React, { createContext, useState, useMemo, useCallback, Suspense, useContext, useEffect, useRef } from 'react';
 
-const LOADING_ENTRY = "LOADING_ENTRY";
-const LOADING_ENTRY_FAILED = "LOADING_ENTRY_FAILED";
 const RECEIVE_ENTRY_DATA = "RECEIVE_ENTRY_DATA";
@@ -16,4 +14,3 @@ const Entry = Record({
   data: Maybe.Nothing(),
-  updatedAt: Maybe.Nothing(),
-  loadPromise: Maybe.Nothing()
+  updatedAt: Maybe.Nothing()
 }, "RemoteResourceEntry");
@@ -27,14 +24,2 @@
   switch (action.type) {
-    case LOADING_ENTRY:
-      return state.merge({
-        id: action.entryId,
-        loadPromise: Maybe.of(action.promise)
-      });
-
-    case LOADING_ENTRY_FAILED:
-      return state.merge({
-        id: action.entryId,
-        loadPromise: Maybe.Nothing()
-      });
-
     case RECEIVE_ENTRY_DATA:
@@ -44,4 +29,3 @@ return state.merge({
         data: Maybe.fromNullable(action.data),
-        updatedAt: isNil(action.data) ? Maybe.Nothing() : Maybe.of(action.now),
-        loadPromise: Maybe.Nothing()
+        updatedAt: isNil(action.data) ? Maybe.Nothing() : Maybe.of(action.now)
       });
@@ -54,4 +38,4 @@
 
-const initialResourceState = Map({
-  entriesById: Map()
+const initialResourceState = Map$1({
+  entriesById: Map$1()
 });
@@ -73,4 +57,4 @@
 
-const initialRootState = Map({
-  resourcesById: Map()
+const initialRootState = Map$1({
+  resourcesById: Map$1()
 });
@@ -114,8 +98,5 @@
 const createRemoteResource = (_ref) => {
-  let _ref$load = _ref.load,
-      load = _ref$load === void 0 ? () => Promise.resolve() : _ref$load,
-      _ref$save = _ref.save,
-      save = _ref$save === void 0 ? () => Promise.resolve() : _ref$save,
-      _ref$delete = _ref.delete,
-      destroy = _ref$delete === void 0 ? () => Promise.resolve() : _ref$delete,
+  let load = _ref.load,
+      save = _ref.save,
+      destroy = _ref.delete,
       _ref$initialValue = _ref.initialValue,
@@ -134,4 +115,6 @@ initialValue = _ref$initialValue === void 0 ? null : _ref$initialValue,
   const resourceId = uuid();
+  const loadingPromisesByEntryId = new Map();
   return {
     id: resourceId,
+    loadingPromisesByEntryId,
     createEntryId,
@@ -175,3 +158,4 @@ initialValue,
   let children = _ref.children,
-      onLoadError = _ref.onLoadError,
+      _ref$onLoadError = _ref.onLoadError,
+      onLoadError = _ref$onLoadError === void 0 ? () => {} : _ref$onLoadError,
       _ref$fallback = _ref.fallback,
@@ -222,3 +206,5 @@ fallback = _ref$fallback === void 0 ? null : _ref$fallback,
     }, [data]),
-    refresh: () => resource.load(...args).then(data => {
+    refresh: useCallback(() => resource.loadingPromisesByEntryId.get(entryId) || // We need to store the promise so that if the component gets re-mounted
+    // while the promise is pending we have the ability to throw it.
+    resource.loadingPromisesByEntryId.set(entryId, resource.load(...args).then(data => {
       resource.dispatch({
@@ -230,9 +216,5 @@ type: RECEIVE_ENTRY_DATA,
       });
-    }).catch(error => {
-      registerError(error);
-      resource.dispatch({
-        type: LOADING_ENTRY_FAILED,
-        entryId
-      });
-    })
+    }).catch(registerError).finally(() => {
+      resource.loadingPromisesByEntryId.delete(entryId);
+    })).get(entryId), args)
   };
@@ -270,5 +252,5 @@
   const cacheInvalid = maybeEntry.map(entry => entry.updatedAt + resource.invalidateAfter < Date.now()).getOrElse(data === resource.initialValue);
-  const loadPromise = maybeEntry.chain(entry => entry.loadPromise).getOrElse(null);
+  const loadPromise = resource.loadingPromisesByEntryId.get(entryId);
   const actions = useResourceActions(resource, args);
-  useEffect(() => // Important! The return value is used to unsubsribe from the store when necessary.
+  useEffect(() => // Important! The return value is used to unsubscribe from the store when necessary.
   resource.onChange(() => {
@@ -280,11 +262,3 @@ setEntry(resource.getEntry(entryId));
   if (isFirstRender && cacheInvalid && !loadPromise) {
-    const promise = actions.refresh(); // We need to store the promise so that if the component gets re-mounted
-    // while the promise is pending we have the ability to throw it.
-
-    resource.dispatch({
-      type: LOADING_ENTRY,
-      entryId,
-      promise
-    });
-    throw promise;
+    throw actions.refresh();
   } else if (loadPromise) {
@@ -291,0 +265,0 @@ throw loadPromise;

package.json

 {
   "name": "react-remote-resource",
-  "version": "1.0.1",
+  "version": "1.0.2",
   "description": "Intuitive remote data management in React",
@@ -5,0 +5,0 @@ "main": "index.js",

src/create-remote-resource.js

@@ -13,4 +13,7 @@ import uuid from "uuid/v1";
   const resourceId = uuid();
+  const loadingPromisesByEntryId = new Map();
+
   return {
     id: resourceId,
+    loadingPromisesByEntryId,
     createEntryId,
@@ -17,0 +20,0 @@ initialValue,

src/store.js

@@ -6,4 +6,2 @@ import { createStore } from "redux";
 
-export const LOADING_ENTRY = "LOADING_ENTRY";
-export const LOADING_ENTRY_FAILED = "LOADING_ENTRY_FAILED";
 export const RECEIVE_ENTRY_DATA = "RECEIVE_ENTRY_DATA";
@@ -15,4 +13,3 @@
     data: Maybe.Nothing(),
-    updatedAt: Maybe.Nothing(),
-    loadPromise: Maybe.Nothing()
+    updatedAt: Maybe.Nothing()
   },
@@ -24,12 +21,2 @@ "RemoteResourceEntry"
   switch (action.type) {
-    case LOADING_ENTRY:
-      return state.merge({
-        id: action.entryId,
-        loadPromise: Maybe.of(action.promise)
-      });
-    case LOADING_ENTRY_FAILED:
-      return state.merge({
-        id: action.entryId,
-        loadPromise: Maybe.Nothing()
-      });
     case RECEIVE_ENTRY_DATA:
@@ -39,4 +26,3 @@ return state.merge({
         data: Maybe.fromNullable(action.data),
-        updatedAt: isNil(action.data) ? Maybe.Nothing() : Maybe.of(action.now),
-        loadPromise: Maybe.Nothing()
+        updatedAt: isNil(action.data) ? Maybe.Nothing() : Maybe.of(action.now)
       });
@@ -43,0 +29,0 @@ default:

src/use-resource-actions.js

 import { useCallback, useContext } from "react";
 import Context from "./Context";
-import { RECEIVE_ENTRY_DATA, LOADING_ENTRY_FAILED } from "./store";
+import { RECEIVE_ENTRY_DATA } from "./store";
 
@@ -25,20 +25,28 @@ const useResourceActions = (resource, args = []) => {
     ),
-    refresh: () =>
-      resource
-        .load(...args)
-        .then(data => {
-          resource.dispatch({
-            type: RECEIVE_ENTRY_DATA,
+    refresh: useCallback(
+      () =>
+        resource.loadingPromisesByEntryId.get(entryId) ||
+        // We need to store the promise so that if the component gets re-mounted
+        // while the promise is pending we have the ability to throw it.
+        resource.loadingPromisesByEntryId
+          .set(
             entryId,
-            data,
-            now: Date.now()
-          });
-        })
-        .catch(error => {
-          registerError(error);
-          resource.dispatch({
-            type: LOADING_ENTRY_FAILED,
-            entryId
-          });
-        })
+            resource
+              .load(...args)
+              .then(data => {
+                resource.dispatch({
+                  type: RECEIVE_ENTRY_DATA,
+                  entryId,
+                  data,
+                  now: Date.now()
+                });
+              })
+              .catch(registerError)
+              .finally(() => {
+                resource.loadingPromisesByEntryId.delete(entryId);
+              })
+          )
+          .get(entryId),
+      args
+    )
   };
@@ -45,0 +53,0 @@

src/use-resource-state.js

 import { useState, useEffect, useCallback, useRef } from "react";
-import { LOADING_ENTRY, RECEIVE_ENTRY_DATA } from "./store";
+import { RECEIVE_ENTRY_DATA } from "./store";
 import useResourceActions from "./use-resource-actions";
@@ -20,5 +20,2 @@
     .getOrElse(data === resource.initialValue);
-  const loadPromise = maybeEntry
-    .chain(entry => entry.loadPromise)
-    .getOrElse(null);
   const actions = useResourceActions(resource, args);
@@ -36,12 +33,5 @@
   const isFirstRender = useFirstRender();
+  const loadPromise = resource.loadingPromisesByEntryId.get(entryId);
   if (isFirstRender && cacheInvalid && !loadPromise) {
-    const promise = actions.refresh();
-    // We need to store the promise so that if the component gets re-mounted
-    // while the promise is pending we have the ability to throw it.
-    resource.dispatch({
-      type: LOADING_ENTRY,
-      entryId,
-      promise
-    });
-    throw promise;
+    throw actions.refresh();
   } else if (loadPromise) {
@@ -48,0 +38,0 @@ throw loadPromise;

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

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

Worsened metrics

Total package byte prevSize

333642

decreased by-0.44%

Lines of code

1403

decreased by-4.62%

No dependency changes