@arrai-innovations/reactive-helpers 1.0.1 → 1.0.2

package/package.json

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

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

@@ -421,4 +421,53 @@ describe("use/listInstance.spec.js", function () {
             expect(fakeId).toBeTruthy();
         });
     });
+    it("computes objectsInOrder and maintains state", () => {
+        const crudListResolvedPage3 = [
+            {
+                id: 3,
+                __str__: "qwer",
+                name: "qwer",
+            },
+            {
+                id: 8,
+                __str__: "asfd",
+                name: "asdf",
+            },
+            {
+                id: 2,
+                __str__: "zxcv",
+                name: "zxcv",
+            },
+        ];
+        const addObject = {
+            id: 4,
+            __str__: "yuio",
+            name: "yiuo",
+        };
+        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;
+        });
+
+        listInstance.list();
+
+        passedPageCallback(crudListResolvedPage3);
+        crudListResolve();
+        expect(listInstance.state.objectsInOrder).toEqual(crudListResolvedPage3);
+        listInstance.addListObject(addObject);
+        crudListResolvedPage3.push(addObject);
+        expect(listInstance.state.objectsInOrder).toEqual(crudListResolvedPage3);
+        listInstance.deleteListObject(8);
+        crudListResolvedPage3.splice(1, 1);
+        expect(listInstance.state.objectsInOrder).toEqual(crudListResolvedPage3);
+    });
 });

package/use/listInstance.js

@@ -1,6 +1,6 @@
-import { isEmpty, keyBy } from "lodash";
-import { effectScope, reactive, unref } from "vue";
-import { addOrUpdateReactiveObject, assignReactiveObject } from "../utils/assignReactiveObject";
+import { isEmpty } from "lodash";
+import { computed, effectScope, reactive, unref } from "vue";
+import { assignReactiveObject } from "../utils/assignReactiveObject";
 import inspect from "browser-util-inspect";
 
 export class ListError extends Error {
@@ -67,7 +67,13 @@ export function useListInstance({ crudArgs, defaultListArgs = {}, defaultRetriev
                 retrieveArgs,
                 listArgs,
                 pageCallback: (newObjects) => {
-                    addOrUpdateReactiveObject(state.objects, keyBy(newObjects, "id"));
+                    newObjects.forEach((newObject) => {
+                        if (newObject.id in state.objects) {
+                            updateListObject(newObject);
+                        } else {
+                            addListObject(newObject);
+                        }
+                    });
                 },
             })
             .then(() => {
@@ -129,8 +135,9 @@ export function useListInstance({ crudArgs, defaultListArgs = {}, defaultRetriev
 
     const es = effectScope();
 
-    // we could have effects? let's keep the interface to keep our options open to add without major changes.
-    es.run(() => {});
+    es.run(() => {
+        state.objectsInOrder = computed(() => state.addedOrder.map((id) => state.objects[id]));
+    });
 
     return {
         state,