@arrai-innovations/reactive-helpers 1.2.3 → 2.0.0

package/.lintstagedrc

@@ -7,5 +7,8 @@
     ],
     "**/*.{js,cjs,mjs,ts,jsx,tsx,less,scss,css,vue,markdown,json,md,yml,yaml,html}": [
         "npx --no-install prettier --write"
+    ],
+    ".circleci/config.yml": [
+        "circleci config validate"
     ]
 }

package/README.md

@@ -68,17 +68,19 @@ setListInstanceCrud({
 });
 
 // then use in your component
+import { reactive } from "vue";
 import { useListInstance } from "@arrai-innovations/reactive-helpers";
+const listArgs = reactive({
+    has_organization: true,
+});
 const contacts = useListInstance({
     crudArgs: {
         stream: "contacts",
     },
-    defaultRetrieveArgs: {
+    retrieveArgs: {
         fields: ["id", "has_name", "lexical_name", "organization", "phone"],
     },
-    defaultListArgs: {
-        has_organization: true,
-    },
+    listArgs,
 });
 
 await contacts.list();
@@ -90,11 +92,14 @@ console.log(contacts.error);
 // null
 console.log(contacts.objects);
 // { contacts keyed by 'id' }
-contacts.defaultRetrieveArgs.fields.push("message_count");
+// change list or retrieve args directly
+contacts.state.retrieveArgs.fields.push("message_count");
 await contacts.list();
 console.log(contacts.objects);
 // { contacts keyed by 'id' with message_count  }
-await contacts.list({ listArgs: {} });
+// change list or retrieve args indirectly
+listArgs.has_organization = false;
+await contacts.list();
 console.log(contacts.objects);
 // { contacts keyed by 'id' with organizationless contacts  }
 ```
@@ -126,10 +131,10 @@ const contacts = useListInstance({
     crudArgs: {
         stream: "contacts",
     },
-    defaultRetrieveArgs: {
+    retrieveArgs: {
         fields: ["id", "has_name", "lexical_name", "organization", "phone"],
     },
-    defaultListArgs: {
+    listArgs: {
         has_organization: true,
     },
 });
@@ -144,15 +149,15 @@ const contactsSubscription = useListSubscription({
 });
 
 // only get new or updated contacts, not existing.
-contactsSubscription.subscribe({ list: false });
+contactsSubscription.subscribe();
 // or, subscribe and get the existing list.
 contactsSubscription.subscribe();
 // stop getting updates.
 contactsSubscription.unsubscribe();
 // re-retreive the list of existing contacts including another field.
-contacts.defaultRetrieveArgs.fields.push("message_count");
+contacts.retrieveArgs.fields.push("message_count");
 // re-retreive the list of all existing contacts.
-delete contacts.defaultListArgs.has_organization;
+delete contacts.listArgs.has_organization;
 ```
 
 #### Related
@@ -169,7 +174,7 @@ import { nextTick } from "vue";
 import { useListInstance, useListRelated } from "@arrai-innovations/reactive-helpers";
 const organizations = useListInstance({});
 const contacts = useListInstance({
-    defaultRetrieveArgs: {
+    retrieveArgs: {
         fields: ["id", "lexical_name", "organization"],
     },
 });
@@ -236,7 +241,7 @@ import { nextTick } from "vue";
 // use in your component
 import { useListInstance, useListSort } from "@arrai-innovations/reactive-helpers";
 const contacts = useListInstance({
-    defaultRetrieveArgs: {
+    retrieveArgs: {
         fields: ["id", "has_name", "lexical_name", "organization"],
     },
 });
@@ -269,7 +274,7 @@ import { nextTick } from "vue";
 // use in your component
 import { useListInstance, useListFilter } from "@arrai-innovations/reactive-helpers";
 const contacts = useListInstance({
-    defaultRetrieveArgs: {
+    retrieveArgs: {
         fields: ["id", "has_name", "lexical_name", "organization"],
     },
 });
@@ -313,10 +318,10 @@ const contacts = useListInstance({
     crudArgs: {
         stream: "contacts",
     },
-    defaultRetrieveArgs: {
+    retrieveArgs: {
         fields: ["id", "has_name", "lexical_name", "organization", "phone"],
     },
-    defaultListArgs: {
+    listArgs: {
         has_organization: true,
     },
 });

package/package.json

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

package/tests/unit/crudPromise.js

@@ -0,0 +1,23 @@
+export class Resolvable {
+    constructor() {
+        this.promise = new Promise((resolve, reject) => {
+            this.resolve = resolve;
+            this.reject = reject;
+        });
+    }
+}
+
+export class CancellableResolvable {
+    constructor() {
+        const newResolvable = new Resolvable();
+        const cancelResolvable = new Resolvable();
+        newResolvable.promise.cancel = jest
+            .fn()
+            .mockImplementationOnce(async () => {
+                return cancelResolvable.promise;
+            })
+            .mockRejectedValue(new Error("cancel already called"));
+        Object.assign(this, newResolvable);
+        this.cancel = cancelResolvable;
+    }
+}

package/tests/unit/poll.js

@@ -0,0 +1,50 @@
+import { Resolvable } from "./crudPromise";
+
+export async function poll(condition, interval = 100, timeout = 1000) {
+    let intervalId,
+        timeoutId,
+        resolvable = new Resolvable();
+
+    const calledStack = new Error().stack.split("\n").slice(2).join("\n");
+
+    function stop() {
+        if (intervalId) {
+            clearInterval(intervalId);
+            intervalId = null;
+        }
+        if (timeoutId) {
+            clearTimeout(timeoutId);
+            timeoutId = null;
+        }
+    }
+
+    function doInterval() {
+        if (condition()) {
+            stop();
+            if (resolvable) {
+                resolvable.resolve();
+                resolvable = null;
+            }
+        }
+    }
+
+    function doTimeout() {
+        stop();
+        let conditionValue = condition();
+        if (conditionValue) {
+            if (resolvable) {
+                resolvable.resolve();
+                resolvable = null;
+            }
+        } else if (resolvable) {
+            let timedOutError = new Error(`poll timeout: condition was never true (it was last ${conditionValue})`);
+            timedOutError.stack = timedOutError.stack.split("\n").slice(0, 1).join("\n") + "\n" + calledStack;
+            resolvable.reject(timedOutError);
+            resolvable = null;
+        }
+    }
+    intervalId = setInterval(doInterval, interval);
+    timeoutId = setTimeout(doTimeout, timeout);
+
+    return resolvable.promise;
+}

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

@@ -1,5 +1,5 @@
 import { expectErrorToBeNull } from "../expectHelpers";
-import { isReactive, nextTick } from "vue";
+import { isReactive, nextTick, reactive } from "vue";
 import { keyBy } from "lodash";
 import flushPromises from "flush-promises";
 import { inspect } from "util";
@@ -68,7 +68,16 @@ describe("use/listInstance.spec.js", function () {
     const crudListResolvedObjects = keyBy([...crudListResolvedPage1, ...crudListResolvedPage2], "id");
     describe("list", function () {
         it("success", async function () {
-            const listInstance = useListInstance({});
+            const listArgs = reactive({
+                user: 1,
+            });
+            const retrieveArgs = reactive({
+                fields,
+            });
+            const listInstance = useListInstance({
+                listArgs,
+                retrieveArgs,
+            });
             let crudListResolve;
             const crudListPromise = new Promise((resolve) => {
                 crudListResolve = resolve;
@@ -84,10 +93,7 @@ describe("use/listInstance.spec.js", function () {
             expect(listInstance.state.loading).toBeUndefined();
             expect({ ...listInstance.state.objects }).toEqual({});
 
-            const liListResolve = listInstance.list({
-                listArgs: { user: 1 },
-                retrieveArgs: { fields: fields },
-            });
+            const liListResolve = listInstance.list();
 
             expectErrorToBeNull(listInstance.state.error);
             expect(listInstance.state.errored).toBe(false);
@@ -128,23 +134,24 @@ describe("use/listInstance.spec.js", function () {
             expect(globalList).toHaveBeenCalledTimes(1);
         });
         it("already loading", async function () {
-            const listInstance = useListInstance({});
+            const listArgs = reactive({
+                user: 1,
+            });
+            const retrieveArgs = reactive({
+                fields,
+            });
+            const listInstance = useListInstance({
+                listArgs,
+                retrieveArgs,
+            });
             expectErrorToBeNull(listInstance.state.error);
             expect(listInstance.state.errored).toBe(false);
             expect(listInstance.state.loading).toBeUndefined();
             expect({ ...listInstance.state.objects }).toEqual({});
             globalList.mockImplementation(() => new Promise(() => {}));
 
-            listInstance.list({
-                listArgs: { user: 1 },
-                retrieveArgs: { fields: fields },
-            });
-            await expect(
-                listInstance.list({
-                    listArgs: { user: 1 },
-                    retrieveArgs: { fields: fields },
-                })
-            ).rejects.toThrow(ListError);
+            listInstance.list();
+            await expect(listInstance.list()).rejects.toThrow(ListError);
 
             expect(globalList).toHaveBeenCalledWith({
                 crudArgs: { stream: "test_stream" },
@@ -159,7 +166,16 @@ describe("use/listInstance.spec.js", function () {
             expect({ ...listInstance.state.objects }).toEqual({});
         });
         it("errored", async function () {
-            const listInstance = useListInstance({});
+            const listArgs = reactive({
+                user: 1,
+            });
+            const retrieveArgs = reactive({
+                fields,
+            });
+            const listInstance = useListInstance({
+                listArgs,
+                retrieveArgs,
+            });
             let crudListReject;
             const crudListPromise = new Promise((resolve, reject) => {
                 crudListReject = reject;
@@ -175,10 +191,7 @@ describe("use/listInstance.spec.js", function () {
             expect(listInstance.state.loading).toBeUndefined();
             expect({ ...listInstance.state.objects }).toEqual({});
 
-            const liListResolve = listInstance.list({
-                listArgs: { user: 1 },
-                retrieveArgs: { fields: fields },
-            });
+            const liListResolve = listInstance.list();
 
             expectErrorToBeNull(listInstance.state.error);
             expect(listInstance.state.errored).toBe(false);
@@ -205,68 +218,16 @@ describe("use/listInstance.spec.js", function () {
             });
             expect(globalList).toHaveBeenCalledTimes(1);
         });
-        it("success (default args)", async function () {
-            const listInstance = useListInstance({
-                defaultListArgs: { user: 1 },
-                defaultRetrieveArgs: { fields: fields },
-            });
-            let crudListResolve;
-            const crudListPromise = new Promise((resolve) => {
-                crudListResolve = resolve;
-            });
-            let passedPageCallback;
-            globalList.mockImplementation(({ pageCallback }) => {
-                passedPageCallback = pageCallback;
-                return crudListPromise;
+        it("success (custom stream)", async function () {
+            const listArgs = reactive({
+                user: 1,
             });
-
-            expectErrorToBeNull(listInstance.state.error);
-            expect(listInstance.state.errored).toBe(false);
-            expect(listInstance.state.loading).toBeUndefined();
-            expect({ ...listInstance.state.objects }).toEqual({});
-
-            const liListResolve = listInstance.list();
-
-            expectErrorToBeNull(listInstance.state.error);
-            expect(listInstance.state.errored).toBe(false);
-            expect(listInstance.state.loading).toBe(true);
-            expect({ ...listInstance.state.object }).toEqual({});
-
-            await nextTick();
-
-            passedPageCallback(crudListResolvedPage1);
-
-            expectErrorToBeNull(listInstance.state.error);
-            expect(listInstance.state.errored).toBe(false);
-            expect(listInstance.state.loading).toBe(true);
-            expect({ ...listInstance.state.objects }).toEqual(crudListResolvedObjectsMid);
-
-            passedPageCallback(crudListResolvedPage2);
-
-            expectErrorToBeNull(listInstance.state.error);
-            expect(listInstance.state.errored).toBe(false);
-            expect(listInstance.state.loading).toBe(true);
-            expect({ ...listInstance.state.objects }).toEqual(crudListResolvedObjects);
-
-            crudListResolve();
-            await flushPromises();
-
-            await expect(liListResolve).resolves.toBe(true);
-
-            expectErrorToBeNull(listInstance.state.error);
-            expect(listInstance.state.errored).toBe(false);
-            expect(listInstance.state.loading).toBe(false);
-            expect({ ...listInstance.state.objects }).toEqual(crudListResolvedObjects);
-            expect(globalList).toHaveBeenCalledWith({
-                crudArgs: { stream: "test_stream" },
-                listArgs: { user: 1 },
-                retrieveArgs: { fields: fields },
-                pageCallback: passedPageCallback,
+            const retrieveArgs = reactive({
+                fields,
             });
-            expect(globalList).toHaveBeenCalledTimes(1);
-        });
-        it("success (custom stream)", async function () {
             const listInstance = useListInstance({
+                listArgs,
+                retrieveArgs,
                 crudArgs: { stream: "custom_stream" },
             });
             let crudListResolve;
@@ -284,10 +245,7 @@ describe("use/listInstance.spec.js", function () {
             expect(listInstance.state.loading).toBeUndefined();
             expect({ ...listInstance.state.objects }).toEqual({});
 
-            const liListResolve = listInstance.list({
-                listArgs: { user: 1 },
-                retrieveArgs: { fields: fields },
-            });
+            const liListResolve = listInstance.list();
 
             expectErrorToBeNull(listInstance.state.error);
             expect(listInstance.state.errored).toBe(false);
@@ -390,8 +348,8 @@ describe("use/listInstance.spec.js", function () {
         });
         it("succeeds", async function () {
             const listInstance = useListInstance({
-                defaultListArgs: { user: 1 },
-                defaultRetrieveArgs: { fields: fields },
+                listArgs: { user: 1 },
+                retrieveArgs: { fields: fields },
             });
             let crudListResolve;
             const crudListPromise = new Promise((resolve) => {
@@ -445,8 +403,8 @@ describe("use/listInstance.spec.js", function () {
             name: "yiuo",
         };
         const listInstance = useListInstance({
-            defaultListArgs: { user: 1 },
-            defaultRetrieveArgs: { fields: fields },
+            listArgs: { user: 1 },
+            retrieveArgs: { fields: fields },
         });
         let crudListResolve;
         const crudListPromise = new Promise((resolve) => {

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

@@ -45,7 +45,7 @@ describe("use/useListSort", () => {
             { key: "lexical_name", desc: false, localeCompare: true },
         ];
         listInstance = useListInstance({
-            defaultRetrieveArgs: {
+            retrieveArgs: {
                 fields: ["id", "lexical_name", "organization", "relatedObjects"],
             },
         });