@arrai-innovations/reactive-helpers 2.0.1 → 2.1.1

package/package.json

@@ -1,6 +1,6 @@
 {
     "name": "@arrai-innovations/reactive-helpers",
-    "version": "2.0.1",
+    "version": "2.1.1",
     "description": "VueJS 3 utility composition functions to help manipulate objects and lists.",
     "main": "index.js",
     "directories": {

package/tests/unit/use/objectInstance.spec.js

@@ -219,14 +219,45 @@ describe("use/objectInstance.js", function () {
                 id,
                 retrieveArgs,
             });
+            objectInstance.state.crud.create = jest.fn();
+            objectInstance.state.crud.create.mockImplementation(() => new Promise(() => {}));
             objectInstance.state.crud.retrieve = jest.fn();
             objectInstance.state.crud.retrieve.mockImplementation(() => new Promise(() => {}));
             expectErrorToBeNull(objectInstance.state.error);
             expect(objectInstance.state.errored).toBe(false);
             expect(objectInstance.state.loading).toBeUndefined();
             expect({ ...objectInstance.state.object }).toEqual({});
-            objectInstance.retrieve();
+            objectInstance.create({
+                fake: "object",
+            });
+            expectErrorToBeNull(objectInstance.state.error);
+            expect(objectInstance.state.errored).toBe(false);
+            expect(objectInstance.state.loading).toBe(true);
             await expect(() => objectInstance.retrieve()).rejects.toThrow(ObjectError);
+            expect(objectInstance.state.crud.retrieve).toHaveBeenCalledTimes(0);
+            expectErrorToBeNull(objectInstance.state.error);
+            expect(objectInstance.state.errored).toBe(false);
+            expect(objectInstance.state.loading).toBe(true);
+            expect({ ...objectInstance.state.object }).toEqual({});
+        });
+        it("double retrieve gets the same promise", async function () {
+            const id = ref(1);
+            const retrieveArgs = reactive({ fields });
+            const objectInstance = useObjectInstance({
+                crudArgs: { stream: "test_stream" },
+                id,
+                retrieveArgs,
+            });
+            objectInstance.state.crud.retrieve = jest.fn();
+            objectInstance.state.crud.retrieve.mockImplementation(() => new Promise(() => {}));
+            expectErrorToBeNull(objectInstance.state.error);
+            expect(objectInstance.state.errored).toBe(false);
+            expect(objectInstance.state.loading).toBeUndefined();
+            expect({ ...objectInstance.state.object }).toEqual({});
+            const firstPromise = objectInstance.retrieve();
+            const secondPromise = objectInstance.retrieve();
+            // await expect(() => objectInstance.retrieve()).rejects.toThrow(ObjectError);
+            expect(firstPromise).toBe(secondPromise);
             expect(objectInstance.state.crud.retrieve).toHaveBeenCalledWith({
                 crudArgs: { stream: "test_stream" },
                 id: 1,

package/use/listSubscription.js

@@ -4,6 +4,7 @@ import { cloneDeep, isEmpty, isObject } from "lodash";
 import { assignReactiveObject } from "../utils/assignReactiveObject";
 import inspect from "browser-util-inspect";
 import { useCancellableIntent } from "../utils/cancellableIntent";
+import loadingCombine from "../utils/loadingCombine";
 
 export class ListSubscriptionError extends Error {
     constructor(message) {
@@ -140,7 +141,7 @@ export function useListSubscription({ listInstance, crudArgs, listArgs, retrieve
     const es = effectScope();
 
     es.run(() => {
-        state.loading = computed(() => listInstance.state.loading || state.subscriptionLoading);
+        state.loading = computed(() => loadingCombine(listInstance.state.loading, state.subscriptionLoading));
         state.errored = computed(() => listInstance.state.errored || state.subscriptionErrored);
         state.error = computed(() => listInstance.state.error || state.subscriptionError);
 

package/use/objectInstance.js

@@ -59,15 +59,26 @@ export function useObjectInstance({ crudArgs, id, retrieveArgs }) {
         assignReactiveObject(state.crud.args, crudArgs);
     }
 
+    // due to retrieve being called by `useCancelleableIntent`, if called manually then by the watch,
+    //  it will run into the loading check. Instead, return the current retrieve promise if it exists.
+    const promises = {
+        retrieve: null,
+    };
+
     function retrieve() {
         // this function cannot be async, or the resulting promise will lose its .cancel() method
+        if (promises.retrieve) {
+            // if a retrieve is already in progress, return the existing promise
+            return promises.retrieve;
+        }
         if (state.loading) {
+            // if another operation is already in progress, return a rejected promise
             return Promise.reject(new ObjectError("already loading."));
         }
         state.loading = true;
         state.errored = false;
         state.error = null;
-        return state.crud
+        promises.retrieve = state.crud
             .retrieve({
                 crudArgs: state.crud.args,
                 id: state.id,
@@ -84,7 +95,9 @@ export function useObjectInstance({ crudArgs, id, retrieveArgs }) {
             })
             .finally(() => {
                 state.loading = false;
+                promises.retrieve = null;
             });
+        return promises.retrieve;
     }
 
     async function create({ object }) {

package/use/objectSubscription.js

@@ -3,6 +3,7 @@ import { computed, effectScope, reactive, toRef } from "vue";
 import { assignReactiveObject } from "../utils/assignReactiveObject";
 import { useObjectInstance } from "./objectInstance";
 import { useCancellableIntent } from "../utils/cancellableIntent";
+import loadingCombine from "../utils/loadingCombine";
 
 export class ObjectSubscriptionError extends Error {
     constructor(message) {
@@ -149,7 +150,7 @@ export function useObjectSubscription({ objectInstance, crudArgs, id, retrieveAr
     const es = effectScope();
 
     es.run(() => {
-        state.loading = computed(() => objectInstance.state.loading || state.subscriptionLoading);
+        state.loading = computed(() => loadingCombine(objectInstance.state.loading, state.subscriptionLoading));
         state.errored = computed(() => objectInstance.state.errored || state.subscriptionErrored);
         state.error = computed(() => objectInstance.state.error || state.subscriptionError);
 

package/utils/loadingCombine.js

@@ -0,0 +1,13 @@
+export default function (...loadingStates) {
+    // loadingStates is an array of booleans or undefined
+    // if any true, return true
+    // if all undefined, return undefined
+    // otherwise return false (all false)
+    if (loadingStates.some((loadingState) => loadingState === true)) {
+        return true;
+    }
+    if (loadingStates.every((loadingState) => loadingState === undefined)) {
+        return undefined;
+    }
+    return false;
+}