Added the ability for useAsyncWatcher and useAsyncDeepState to unsubscribe from state updates;

Author: DigitalBrainJS

lib/use-async-effect.js

@@ -451,7 +451,7 @@ const useAsyncDeepState = (initialValue, {watch= true}= {}) => {
         Object.assign(current, {
             state,
             oldState: null,
-            callbacks: []
+            callbacks: new Map()
         })
     }
 
@@ -462,7 +462,7 @@ const useAsyncDeepState = (initialValue, {watch= true}= {}) => {
     watch && useEffect(()=>{
         const data= [state, current.oldState];
         current.callbacks.forEach(cb=> cb(data));
-        current.callbacks.length= 0;
+        current.callbacks.clear();
         current.oldState= Object.assign({}, current.state);
     }, [state]);
 
@@ -474,7 +474,7 @@ const useAsyncDeepState = (initialValue, {watch= true}= {}) => {
          * @returns {Promise<*>|undefined}
          */
         function (newState) {
-            const setter= (cb)=>{
+            const setter= (scope, cb)=>{
                 if (typeof newState === 'function') {
                     newState = newState(current.state);
                 }
@@ -485,11 +485,14 @@ const useAsyncDeepState = (initialValue, {watch= true}= {}) => {
 
                 setState((state)=>{
                     if(newState == null || isEqualObjects(Object.assign(current.state, newState), current.oldState)){
-                        cb && cb([state, current.oldState]);
+                        scope && cb([state, current.oldState]);
                         return state;
                     }
 
-                    cb && current.callbacks.push(cb);
+                    if (scope) {
+                        current.callbacks.set(scope, cb);
+                        scope.onDone(() => current.callbacks.delete(scope))
+                    }
 
                     return Object.create(current.state)
                 });
@@ -500,27 +503,30 @@ const useAsyncDeepState = (initialValue, {watch= true}= {}) => {
                 return;
             }
 
-            return new CPromise((resolve) => {
-                setter(resolve);
+            return new CPromise((resolve, reject, scope) => {
+                setter(scope, resolve);
             });
         }
     ]
 }
 
 const useAsyncWatcher = (...value) => {
     const ref = useRef({
-        callbacks: [],
         oldValue: value
     });
 
+    if (!ref.current.callbacks) {
+        ref.current.callbacks = new Map()
+    }
+
     const multiple= value.length > 1;
 
     useEffect(() => {
         const {current} = ref;
         const data = multiple ? value.map((value, index) => [value, current.oldValue[index]]) :
           [value[0], current.oldValue[0]];
         current.callbacks.forEach(cb => cb(data));
-        current.callbacks = [];
+        current.callbacks.clear();
         current.oldValue = value;
     }, value);
 
@@ -529,14 +535,18 @@ const useAsyncWatcher = (...value) => {
      * @returns {Promise}
      */
     return (grabPrevValue) => {
-        return new Promise((resolve) => {
-            ref.current.callbacks.push(entry => {
+        return new CPromise((resolve, reject, scope) => {
+            ref.current.callbacks.set(scope, entry => {
                 if (multiple) {
                     resolve(grabPrevValue ? entry : entry.map(values => values[0]))
                 }
 
                 resolve(grabPrevValue ? entry : entry[0]);
             });
+
+            scope.onDone(()=>{
+                ref.current.callbacks.delete(scope);
+            })
         });
     }
 }