react-async-hook - npm Package Compare versions

Comparing version 3.6.0 to 3.6.1

dist/index.d.ts

@@ -43,6 +43,7 @@ declare type UnknownResult = unknown;
 export declare const useAsyncCallback: <R = unknown, Args extends any[] = any[]>(asyncFunction: (...args: Args) => MaybePromise<R>, options?: UseAsyncCallbackOptions<R>) => UseAsyncReturn<R, Args>;
-export declare const useAsyncFetchMore: <R, Args extends any[]>({ value, fetchMore, merge, }: {
+export declare const useAsyncFetchMore: <R, Args extends any[]>({ value, fetchMore, merge, isEnd: isEndFn, }: {
     value: UseAsyncReturn<R, Args>;
     fetchMore: (result: R) => Promise<R>;
     merge: (result: R, moreResult: R) => R;
+    isEnd: (moreResult: R) => boolean;
 }) => {
@@ -53,3 +54,4 @@ canFetchMore: boolean;
     fetchMore: () => Promise<R>;
+    isEnd: boolean;
 };
 export {};

dist/react-async-hook.cjs.development.js

@@ -303,4 +303,12 @@ 'use strict';
       fetchMore = _ref.fetchMore,
-      merge = _ref.merge;
+      merge = _ref.merge,
+      isEndFn = _ref.isEnd;
   var getAsyncValue = useGetter(value);
+
+  var _useState3 = react.useState(false),
+      isEnd = _useState3[0],
+      setIsEnd = _useState3[1]; // TODO not really fan of this id thing, we should find a way to support cancellation!
+
+
+  var fetchMoreId = react.useRef(0);
   var fetchMoreAsync = useAsyncCallback(function () {
@@ -318,7 +326,11 @@ try {
 
+      fetchMoreId.current = fetchMoreId.current + 1;
+      var currentId = fetchMoreId.current;
       return Promise.resolve(fetchMore(freshAsyncValue.result)).then(function (moreResult) {
-        // Handle race conditions: we only merge the fetchMore result if the initial async value is the same
         // TODO not satisfied with this, we should just use "freshAsyncValue === getAsyncValue()" but asyncValue is not "stable"
-        var canMerge = freshAsyncValue.status === getAsyncValue().status && freshAsyncValue.result === getAsyncValue().result;
+        var isStillSameValue = freshAsyncValue.status === getAsyncValue().status && freshAsyncValue.result === getAsyncValue().result;
+        var isStillSameId = fetchMoreId.current === currentId; // Handle race conditions: we only merge the fetchMore result if the initial async value is the same
 
+        var canMerge = isStillSameValue && isStillSameId;
+
         if (canMerge) {
@@ -328,2 +340,6 @@ value.merge({
           });
+
+          if (isEndFn(moreResult)) {
+            setIsEnd(true);
+          }
         } // return is useful for chaining, like fetchMore().then(result => {});
@@ -337,10 +353,16 @@
     }
-  }); // We only allow to fetch more on a stable async value
+  });
+
+  var reset = function reset() {
+    fetchMoreAsync.reset();
+    setIsEnd(false);
+  }; // We only allow to fetch more on a stable async value
   // If that value change for whatever reason, we reset the fetchmore too (which will make current pending requests to be ignored)
   // TODO value is not stable, we could just reset on value change otherwise
 
+
   var shouldReset = value.status !== 'success';
   react.useEffect(function () {
     if (shouldReset) {
-      fetchMoreAsync.reset();
+      reset();
     }
@@ -352,3 +374,4 @@ }, [shouldReset]);
     status: fetchMoreAsync.status,
-    fetchMore: fetchMoreAsync.execute
+    fetchMore: fetchMoreAsync.execute,
+    isEnd: isEnd
   };
@@ -355,0 +378,0 @@ };

dist/react-async-hook.cjs.production.min.js

@@ -1,2 +0,2 @@
-"use strict";var e=require("react");function t(){return(t=Object.assign||function(e){for(var t=1;t<arguments.length;t++){var r=arguments[t];for(var n in r)Object.prototype.hasOwnProperty.call(r,n)&&(e[n]=r[n])}return e}).apply(this,arguments)}"undefined"!=typeof Symbol&&(Symbol.iterator||(Symbol.iterator=Symbol("Symbol.iterator"))),"undefined"!=typeof Symbol&&(Symbol.asyncIterator||(Symbol.asyncIterator=Symbol("Symbol.asyncIterator")));var r="undefined"!=typeof window&&void 0!==window.document&&void 0!==window.document.createElement?e.useLayoutEffect:e.useEffect,n={status:"not-requested",loading:!1,result:void 0,error:void 0},u={status:"loading",loading:!0,result:void 0,error:void 0},o=function(){},s={initialState:function(e){return e&&e.executeOnMount?u:n},executeOnMount:!0,executeOnUpdate:!0,setLoading:function(e){return u},setResult:function(e,t){return{status:"success",loading:!1,result:e,error:void 0}},setError:function(e,t){return{status:"error",loading:!1,result:void 0,error:e}},onSuccess:o,onError:o},c=function(r,n,u){var o,c=function(e){return t({},s,{},e)}(u),i=e.useState(null),a=i[0],l=i[1],f=function(r){var n=e.useState(function(){return r.initialState(r)}),u=n[0],o=n[1],s=e.useCallback(function(){return o(r.initialState(r))},[o,r]),c=e.useCallback(function(){return o(r.setLoading(u))},[u,o]),i=e.useCallback(function(e){return o(r.setResult(e,u))},[u,o]),a=e.useCallback(function(e){return o(r.setError(e,u))},[u,o]),l=o,f=e.useCallback(function(e){return l(t({},u,{},e))},[u,l]);return{value:u,set:l,merge:f,reset:s,setLoading:c,setResult:i,setError:a}}(c),d=(o=e.useRef(!1),e.useEffect(function(){return o.current=!0,function(){o.current=!1}},[]),function(){return o.current}),v=function(){var t=e.useRef(null);return{set:function(e){return t.current=e},get:function(){return t.current},is:function(e){return t.current===e}}}(),y=function(e){return d()&&v.is(e)},m=function(){for(var e=arguments.length,t=new Array(e),n=0;n<e;n++)t[n]=arguments[n];var u=r.apply(void 0,t);if(l(t),u instanceof Promise)return v.set(u),f.setLoading(),u.then(function(e){y(u)&&f.setResult(e),c.onSuccess(e,{isCurrent:function(){return v.is(u)}})},function(e){y(u)&&f.setError(e),c.onError(e,{isCurrent:function(){return v.is(u)}})}),u;var o=u;return f.setResult(o),Promise.resolve(o)},g=!d();return e.useEffect(function(){g?c.executeOnMount&&m.apply(void 0,n):c.executeOnUpdate&&m.apply(void 0,n)},n),t({},f.value,{set:f.set,merge:f.merge,reset:f.reset,execute:m,currentPromise:v.get(),currentParams:a})};function i(e,t,r){return c(e,t,r)}var a=function(e,r){return c(e,[],t({},r,{executeOnMount:!1,executeOnUpdate:!1}))};exports.useAsync=i,exports.useAsyncAbortable=function(t,r,n){var u=e.useRef();return i(function(){for(var e=arguments.length,r=new Array(e),n=0;n<e;n++)r[n]=arguments[n];try{u.current&&u.current.abort();var o=new AbortController;return u.current=o,Promise.resolve(function(e,n){try{var u=Promise.resolve(t.apply(void 0,[o.signal].concat(r)))}catch(e){return n(!0,e)}return u&&u.then?u.then(n.bind(null,!1),n.bind(null,!0)):n(!1,value)}(0,function(e,t){if(u.current===o&&(u.current=void 0),e)throw t;return t}))}catch(e){return Promise.reject(e)}},r,n)},exports.useAsyncCallback=a,exports.useAsyncFetchMore=function(t){var n,u,o=t.value,s=t.fetchMore,c=t.merge,i=(u=e.useRef(n=o),r(function(){u.current=n}),function(){return u.current}),l=a(function(){try{var e=i();if("success"!==e.status)throw new Error("Can't fetch more if the original fetch is not a success");if("loading"===l.status)throw new Error("Can't fetch more, because we are already fetching more!");return Promise.resolve(s(e.result)).then(function(t){return e.status===i().status&&e.result===i().result&&o.merge({result:c(o.result,t)}),t})}catch(e){return Promise.reject(e)}}),f="success"!==o.status;return e.useEffect(function(){f&&l.reset()},[f]),{canFetchMore:"success"===o.status&&"loading"!==l.status,loading:l.loading,status:l.status,fetchMore:l.execute}};
+"use strict";var e=require("react");function t(){return(t=Object.assign||function(e){for(var t=1;t<arguments.length;t++){var r=arguments[t];for(var n in r)Object.prototype.hasOwnProperty.call(r,n)&&(e[n]=r[n])}return e}).apply(this,arguments)}"undefined"!=typeof Symbol&&(Symbol.iterator||(Symbol.iterator=Symbol("Symbol.iterator"))),"undefined"!=typeof Symbol&&(Symbol.asyncIterator||(Symbol.asyncIterator=Symbol("Symbol.asyncIterator")));var r="undefined"!=typeof window&&void 0!==window.document&&void 0!==window.document.createElement?e.useLayoutEffect:e.useEffect,n={status:"not-requested",loading:!1,result:void 0,error:void 0},u={status:"loading",loading:!0,result:void 0,error:void 0},o=function(){},s={initialState:function(e){return e&&e.executeOnMount?u:n},executeOnMount:!0,executeOnUpdate:!0,setLoading:function(e){return u},setResult:function(e,t){return{status:"success",loading:!1,result:e,error:void 0}},setError:function(e,t){return{status:"error",loading:!1,result:void 0,error:e}},onSuccess:o,onError:o},c=function(r,n,u){var o,c=function(e){return t({},s,{},e)}(u),i=e.useState(null),a=i[0],l=i[1],f=function(r){var n=e.useState(function(){return r.initialState(r)}),u=n[0],o=n[1],s=e.useCallback(function(){return o(r.initialState(r))},[o,r]),c=e.useCallback(function(){return o(r.setLoading(u))},[u,o]),i=e.useCallback(function(e){return o(r.setResult(e,u))},[u,o]),a=e.useCallback(function(e){return o(r.setError(e,u))},[u,o]),l=o,f=e.useCallback(function(e){return l(t({},u,{},e))},[u,l]);return{value:u,set:l,merge:f,reset:s,setLoading:c,setResult:i,setError:a}}(c),d=(o=e.useRef(!1),e.useEffect(function(){return o.current=!0,function(){o.current=!1}},[]),function(){return o.current}),v=function(){var t=e.useRef(null);return{set:function(e){return t.current=e},get:function(){return t.current},is:function(e){return t.current===e}}}(),y=function(e){return d()&&v.is(e)},m=function(){for(var e=arguments.length,t=new Array(e),n=0;n<e;n++)t[n]=arguments[n];var u=r.apply(void 0,t);if(l(t),u instanceof Promise)return v.set(u),f.setLoading(),u.then(function(e){y(u)&&f.setResult(e),c.onSuccess(e,{isCurrent:function(){return v.is(u)}})},function(e){y(u)&&f.setError(e),c.onError(e,{isCurrent:function(){return v.is(u)}})}),u;var o=u;return f.setResult(o),Promise.resolve(o)},g=!d();return e.useEffect(function(){g?c.executeOnMount&&m.apply(void 0,n):c.executeOnUpdate&&m.apply(void 0,n)},n),t({},f.value,{set:f.set,merge:f.merge,reset:f.reset,execute:m,currentPromise:v.get(),currentParams:a})};function i(e,t,r){return c(e,t,r)}var a=function(e,r){return c(e,[],t({},r,{executeOnMount:!1,executeOnUpdate:!1}))};exports.useAsync=i,exports.useAsyncAbortable=function(t,r,n){var u=e.useRef();return i(function(){for(var e=arguments.length,r=new Array(e),n=0;n<e;n++)r[n]=arguments[n];try{u.current&&u.current.abort();var o=new AbortController;return u.current=o,Promise.resolve(function(e,n){try{var u=Promise.resolve(t.apply(void 0,[o.signal].concat(r)))}catch(e){return n(!0,e)}return u&&u.then?u.then(n.bind(null,!1),n.bind(null,!0)):n(!1,value)}(0,function(e,t){if(u.current===o&&(u.current=void 0),e)throw t;return t}))}catch(e){return Promise.reject(e)}},r,n)},exports.useAsyncCallback=a,exports.useAsyncFetchMore=function(t){var n,u,o=t.value,s=t.fetchMore,c=t.merge,i=t.isEnd,l=(u=e.useRef(n=o),r(function(){u.current=n}),function(){return u.current}),f=e.useState(!1),d=f[0],v=f[1],y=e.useRef(0),m=a(function(){try{var e=l();if("success"!==e.status)throw new Error("Can't fetch more if the original fetch is not a success");if("loading"===m.status)throw new Error("Can't fetch more, because we are already fetching more!");y.current=y.current+1;var t=y.current;return Promise.resolve(s(e.result)).then(function(r){return e.status===l().status&&e.result===l().result&&y.current===t&&(o.merge({result:c(o.result,r)}),i(r)&&v(!0)),r})}catch(e){return Promise.reject(e)}}),g="success"!==o.status;return e.useEffect(function(){g&&(m.reset(),v(!1))},[g]),{canFetchMore:"success"===o.status&&"loading"!==m.status,loading:m.loading,status:m.status,fetchMore:m.execute,isEnd:d}};
 //# sourceMappingURL=react-async-hook.cjs.production.min.js.map

dist/react-async-hook.esm.js

@@ -301,4 +301,12 @@ import { useLayoutEffect, useEffect, useRef, useState, useCallback } from 'react';
       fetchMore = _ref.fetchMore,
-      merge = _ref.merge;
+      merge = _ref.merge,
+      isEndFn = _ref.isEnd;
   var getAsyncValue = useGetter(value);
+
+  var _useState3 = useState(false),
+      isEnd = _useState3[0],
+      setIsEnd = _useState3[1]; // TODO not really fan of this id thing, we should find a way to support cancellation!
+
+
+  var fetchMoreId = useRef(0);
   var fetchMoreAsync = useAsyncCallback(function () {
@@ -316,7 +324,11 @@ try {
 
+      fetchMoreId.current = fetchMoreId.current + 1;
+      var currentId = fetchMoreId.current;
       return Promise.resolve(fetchMore(freshAsyncValue.result)).then(function (moreResult) {
-        // Handle race conditions: we only merge the fetchMore result if the initial async value is the same
         // TODO not satisfied with this, we should just use "freshAsyncValue === getAsyncValue()" but asyncValue is not "stable"
-        var canMerge = freshAsyncValue.status === getAsyncValue().status && freshAsyncValue.result === getAsyncValue().result;
+        var isStillSameValue = freshAsyncValue.status === getAsyncValue().status && freshAsyncValue.result === getAsyncValue().result;
+        var isStillSameId = fetchMoreId.current === currentId; // Handle race conditions: we only merge the fetchMore result if the initial async value is the same
 
+        var canMerge = isStillSameValue && isStillSameId;
+
         if (canMerge) {
@@ -326,2 +338,6 @@ value.merge({
           });
+
+          if (isEndFn(moreResult)) {
+            setIsEnd(true);
+          }
         } // return is useful for chaining, like fetchMore().then(result => {});
@@ -335,10 +351,16 @@
     }
-  }); // We only allow to fetch more on a stable async value
+  });
+
+  var reset = function reset() {
+    fetchMoreAsync.reset();
+    setIsEnd(false);
+  }; // We only allow to fetch more on a stable async value
   // If that value change for whatever reason, we reset the fetchmore too (which will make current pending requests to be ignored)
   // TODO value is not stable, we could just reset on value change otherwise
 
+
   var shouldReset = value.status !== 'success';
   useEffect(function () {
     if (shouldReset) {
-      fetchMoreAsync.reset();
+      reset();
     }
@@ -350,3 +372,4 @@ }, [shouldReset]);
     status: fetchMoreAsync.status,
-    fetchMore: fetchMoreAsync.execute
+    fetchMore: fetchMoreAsync.execute,
+    isEnd: isEnd
   };
@@ -353,0 +376,0 @@ };

package.json

 {
   "name": "react-async-hook",
-  "version": "3.6.0",
+  "version": "3.6.1",
   "description": "Async hook",
@@ -5,0 +5,0 @@ "author": "Sébastien Lorber",

No alert changes

Improved metrics

Total package byte prevSize

174557

2.71%

Lines of code

720

4.96%

No dependency changes