@arrai-innovations/reactive-helpers 20.0.1 → 20.1.0

package/config/listCrud.js

@@ -10,15 +10,16 @@ import { readonly } from "vue";
 
 /**
  * @typedef {object} PaginateInfo
- * @property {number} totalRecords - The total records.
- * @property {number} totalPages - The total pages.
- * @property {number} perPage - The per page.
+ * @property {number} [totalRecords] - The total records.
+ * @property {number} [totalPages] - The total pages.
+ * @property {number} [perPage] - The per page.
+ * @property {number} [page] - The page you are giving us results for.
  */
 
 /**
  * @typedef {(
  *     newObjects:import('../use/listInstance.js').ListObject,
- *     paginationInfo: PaginateInfo|undefined
+ *     paginationInfo?: PaginateInfo,
  * )=>void} PageCallback
  */
 

package/package.json

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

package/types/config/listCrud.d.ts

@@ -13,17 +13,21 @@ export type PaginateInfo = {
     /**
      * - The total records.
      */
-    totalRecords: number;
+    totalRecords?: number;
     /**
      * - The total pages.
      */
-    totalPages: number;
+    totalPages?: number;
     /**
      * - The per page.
      */
-    perPage: number;
+    perPage?: number;
+    /**
+     * - The page you are giving us results for.
+     */
+    page?: number;
 };
-export type PageCallback = (newObjects: import("../use/listInstance.js").ListObject, paginationInfo: PaginateInfo | undefined) => void;
+export type PageCallback = (newObjects: import("../use/listInstance.js").ListObject, paginationInfo?: PaginateInfo) => void;
 export type ListArgs = {
     /**
      * - The arguments to be passed to the crud handlers.

package/types/config/listCrud.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"listCrud.d.ts","sourceRoot":"","sources":["../../config/listCrud.js"],"names":[],"mappings":"AAkHA;;;;GAIG;AACH,8BAFU,QAAQ,CAAC,gBAAgB,CAAC,CAEkB;AAS/C,+CAJI,gBAAgB,GAAG,OAAO,CAAC,UAAU,CAAC,GAEpC,IAAI,CAUhB;AAWM,oCANI,OAAO,KAAK,EAAE,gBAAgB,CAAC,gBAAgB,GAAG,UAAU,CAAC,WAErE;IAAmE,KAAK,GAAhE,OAAO,KAAK,EAAE,gBAAgB,CAAC,gBAAgB,CAAC;IACrB,QAAQ,GAAnC,gBAAgB;CACxB,QAIF;;;;;kBAzIa,MAAM;;;;gBACN,MAAM;;;;aACN,MAAM;;2BAIP,CACN,UAAU,EAAC,OAAO,wBAAwB,EAAE,UAAU,EACtD,cAAc,EAAE,YAAY,GAAC,SAAS,KACvC,IAAI;;;;;YAKI,MAAM;;;;WACN,MAAM;;;;YACN,MAAM;;;;kBACN,YAAY;;;;;iBACZ,QAAQ,CAAC,OAAO,KAAK,EAAE,GAAG,CAAC,OAAO,CAAC,CAAC;;;;;;YAMpC,MAAM;;;;SACN,MAAM,EAAE;;;;WACR,MAAM;;;;;iBACN,QAAQ,CAAC,OAAO,KAAK,EAAE,GAAG,CAAC,OAAO,CAAC,CAAC;;wCAKrC,CACN,0BAA0B,EAAC,OAAO,wBAAwB,EAAE,UAAU,GAAC,MAAM,EAC7E,MAAM,EAAE,QAAQ,GAAC,QAAQ,GAAC,QAAQ,KACnC,IAAI;;;;;YAKI,MAAM;;;;WACN,MAAM;;;;YACN,MAAM;;;;+BACN,yBAAyB;;;;;iBACzB,QAAQ,CAAC,OAAO,KAAK,EAAE,GAAG,CAAC,OAAO,CAAC,CAAC;;;;;;YAMpC,MAAM;;;;SACN,MAAM,EAAE;;;;WACR,MAAM;;;;YACN,MAAM;;;;;iBACN,QAAQ,CAAC,OAAO,KAAK,EAAE,GAAG,CAAC,OAAO,CAAC,CAAC;;gCAMvC,QAAQ,KACN,OAAO,gCAAgC,EAAE,uBAAuB,CAAC,IAAI,CAAC;sCAKxE,cAAc,KACZ,OAAO,gCAAgC,EAAE,uBAAuB,CAAC,IAAI,CAAC;yCAKxE,iBAAiB,KACf,OAAO,gCAAgC,EAAE,kBAAkB,CAAC,IAAI,CAAC;yCAKnE,iBAAiB,KACf,OAAO,gCAAgC,EAAE,uBAAuB,CAAC,MAAM,GAAC,MAAM,GAAC,IAAI,CAAC;;;;;WAKnF,UAAU;;;;iBACV,gBAAgB;;;;oBAChB,mBAAmB;;;;gBACnB,mBAAmB;;;;;;UAKnB,MAAM;;;;;;aAKN,MAAM"}
+{"version":3,"file":"listCrud.d.ts","sourceRoot":"","sources":["../../config/listCrud.js"],"names":[],"mappings":"AAmHA;;;;GAIG;AACH,8BAFU,QAAQ,CAAC,gBAAgB,CAAC,CAEkB;AAS/C,+CAJI,gBAAgB,GAAG,OAAO,CAAC,UAAU,CAAC,GAEpC,IAAI,CAUhB;AAWM,oCANI,OAAO,KAAK,EAAE,gBAAgB,CAAC,gBAAgB,GAAG,UAAU,CAAC,WAErE;IAAmE,KAAK,GAAhE,OAAO,KAAK,EAAE,gBAAgB,CAAC,gBAAgB,CAAC;IACrB,QAAQ,GAAnC,gBAAgB;CACxB,QAIF;;;;;mBA1Ia,MAAM;;;;iBACN,MAAM;;;;cACN,MAAM;;;;WACN,MAAM;;2BAIP,CACN,UAAU,EAAC,OAAO,wBAAwB,EAAE,UAAU,EACtD,cAAc,CAAC,EAAE,YAAY,KAC9B,IAAI;;;;;YAKI,MAAM;;;;WACN,MAAM;;;;YACN,MAAM;;;;kBACN,YAAY;;;;;iBACZ,QAAQ,CAAC,OAAO,KAAK,EAAE,GAAG,CAAC,OAAO,CAAC,CAAC;;;;;;YAMpC,MAAM;;;;SACN,MAAM,EAAE;;;;WACR,MAAM;;;;;iBACN,QAAQ,CAAC,OAAO,KAAK,EAAE,GAAG,CAAC,OAAO,CAAC,CAAC;;wCAKrC,CACN,0BAA0B,EAAC,OAAO,wBAAwB,EAAE,UAAU,GAAC,MAAM,EAC7E,MAAM,EAAE,QAAQ,GAAC,QAAQ,GAAC,QAAQ,KACnC,IAAI;;;;;YAKI,MAAM;;;;WACN,MAAM;;;;YACN,MAAM;;;;+BACN,yBAAyB;;;;;iBACzB,QAAQ,CAAC,OAAO,KAAK,EAAE,GAAG,CAAC,OAAO,CAAC,CAAC;;;;;;YAMpC,MAAM;;;;SACN,MAAM,EAAE;;;;WACR,MAAM;;;;YACN,MAAM;;;;;iBACN,QAAQ,CAAC,OAAO,KAAK,EAAE,GAAG,CAAC,OAAO,CAAC,CAAC;;gCAMvC,QAAQ,KACN,OAAO,gCAAgC,EAAE,uBAAuB,CAAC,IAAI,CAAC;sCAKxE,cAAc,KACZ,OAAO,gCAAgC,EAAE,uBAAuB,CAAC,IAAI,CAAC;yCAKxE,iBAAiB,KACf,OAAO,gCAAgC,EAAE,kBAAkB,CAAC,IAAI,CAAC;yCAKnE,iBAAiB,KACf,OAAO,gCAAgC,EAAE,uBAAuB,CAAC,MAAM,GAAC,MAAM,GAAC,IAAI,CAAC;;;;;WAKnF,UAAU;;;;iBACV,gBAAgB;;;;oBAChB,mBAAmB;;;;gBACnB,mBAAmB;;;;;;UAKnB,MAAM;;;;;;aAKN,MAAM"}

package/types/use/paginatedListInstance.d.ts

@@ -1,21 +1,3 @@
-/**
- * @module use/paginatedListInstance.js
- *
- */
-/**
- * @typedef {object} PagedListListanceOptions
- * @property {boolean} keepOldPages - Whether to keep old pages.
- */
-/**
- * @typedef {object} PagedListInstanceState
- * @property {number} totalRecords - The total records.
- * @property {number} totalPages - The total pages.
- * @property {number} perPage - The per page.
- */
-/**
- * @typedef {object} PagedListInstance
- * @property {import('./listInstance.js').ListInstanceState & PagedListInstanceState} state - The state.
- */
 /**
  *
  * @param {PagedListListanceOptions & import('./listInstance.js').ListInstanceOptions} options - The options.
@@ -28,7 +10,7 @@ export type PagedListListanceOptions = {
      */
     keepOldPages: boolean;
 };
-export type PagedListInstanceState = {
+export type PaginatedRawState = {
     /**
      * - The total records.
      */
@@ -41,11 +23,37 @@ export type PagedListInstanceState = {
      * - The per page.
      */
     perPage: number;
+    /**
+     * - The page to ids map.
+     */
+    pageToIds: Map<number, string[]>;
+};
+export type PaginatedState = import("vue").UnwrapNestedRefs<PaginatedRawState>;
+export type PagedListInstanceStateExtension = {
+    /**
+     * - The total records.
+     */
+    totalRecords: import("vue").Ref<number>;
+    /**
+     * - The total pages.
+     */
+    totalPages: import("vue").Ref<number>;
+    /**
+     * - The per page.
+     */
+    perPage: import("vue").Ref<number>;
+    /**
+     * - The page to ids map.
+     */
+    pageToIds: import("vue").Ref<Map<number, string[]>>;
 };
-export type PagedListInstance = {
+export type PagedListInstanceState = typeof reactive;
+export type PagedListRawInstance = {
     /**
      * - The state.
      */
-    state: import("./listInstance.js").ListInstanceState & PagedListInstanceState;
+    state: PagedListInstanceState;
 };
+export type PagedListInstance = import("./listInstance.js").ListInstance & PagedListRawInstance;
+import { reactive } from "vue";
 //# sourceMappingURL=paginatedListInstance.d.ts.map

package/types/use/paginatedListInstance.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"paginatedListInstance.d.ts","sourceRoot":"","sources":["../../use/paginatedListInstance.js"],"names":[],"mappings":"AAEA;;;GAGG;AAEH;;;GAGG;AAEH;;;;;GAKG;AAEH;;;GAGG;AAEH;;;;GAIG;AACH,+EAHW,wBAAwB,GAAG,OAAO,mBAAmB,EAAE,mBAAmB,GACxE,iBAAiB,CA+C7B;;;;;kBAjEa,OAAO;;;;;;kBAKP,MAAM;;;;gBACN,MAAM;;;;aACN,MAAM;;;;;;WAKN,OAAO,mBAAmB,EAAE,iBAAiB,GAAG,sBAAsB"}
+{"version":3,"file":"paginatedListInstance.d.ts","sourceRoot":"","sources":["../../use/paginatedListInstance.js"],"names":[],"mappings":"AA2DA;;;;GAIG;AACH,+EAHW,wBAAwB,GAAG,OAAO,mBAAmB,EAAE,mBAAmB,GACxE,iBAAiB,CA6D7B;;;;;kBAjHa,OAAO;;;;;;kBAKP,MAAM;;;;gBACN,MAAM;;;;aACN,MAAM;;;;eACN,GAAG,CAAC,MAAM,EAAE,MAAM,EAAE,CAAC;;6BAItB,OAAO,KAAK,EAAE,gBAAgB,CAAC,iBAAiB,CAAC;;;;;kBAKhD,OAAO,KAAK,EAAE,GAAG,CAAC,MAAM,CAAC;;;;gBACzB,OAAO,KAAK,EAAE,GAAG,CAAC,MAAM,CAAC;;;;aACzB,OAAO,KAAK,EAAE,GAAG,CAAC,MAAM,CAAC;;;;eACzB,OAAO,KAAK,EAAE,GAAG,CAAC,GAAG,CAAC,MAAM,EAAE,MAAM,EAAE,CAAC,CAAC;;;;;;;WAYxC,sBAAsB;;gCAIvB,OAAO,mBAAmB,EAAE,YAAY,GAAG,oBAAoB;yBA7C3C,KAAK"}

package/use/paginatedListInstance.js

@@ -1,4 +1,5 @@
 import { useListInstance } from "./listInstance.js";
+import { reactive, toRefs } from "vue";
 
 /**
  * @module use/paginatedListInstance.js
@@ -11,65 +12,113 @@ import { useListInstance } from "./listInstance.js";
  */
 
 /**
- * @typedef {object} PagedListInstanceState
+ * @typedef {object} PaginatedRawState
  * @property {number} totalRecords - The total records.
  * @property {number} totalPages - The total pages.
  * @property {number} perPage - The per page.
+ * @property {Map<number, string[]>} pageToIds - The page to ids map.
  */
 
 /**
- * @typedef {object} PagedListInstance
- * @property {import('./listInstance.js').ListInstanceState & PagedListInstanceState} state - The state.
+ * @typedef {import('vue').UnwrapNestedRefs<PaginatedRawState>} PaginatedState
  */
 
+/**
+ * @typedef {object} PagedListInstanceStateExtension
+ * @property {import('vue').Ref<number>} totalRecords - The total records.
+ * @property {import('vue').Ref<number>} totalPages - The total pages.
+ * @property {import('vue').Ref<number>} perPage - The per page.
+ * @property {import('vue').Ref<Map<number, string[]>>} pageToIds - The page to ids map.
+ */
+
+/**
+ * @typedef {import('vue').reactive<(
+ *     import('./listInstance.js').ListInstanceRawState &
+ *     PagedListInstanceStateExtension
+ * )>} PagedListInstanceState
+ */
+
+/**
+ * @typedef {object} PagedListRawInstance
+ * @property {PagedListInstanceState} state - The state.
+ */
+
+/**
+ * @typedef {import('./listInstance.js').ListInstance & PagedListRawInstance} PagedListInstance
+ */
+
+/**
+ * @param {import('./listInstance.js').ListInstance} listInstance - The list instance.
+ * @param {PaginatedState} paginatedState - The paginated state.
+ * @returns {PagedListInstance} - The paged list instance.
+ */
+function makePagedListInstance(listInstance, paginatedState) {
+    Object.assign(listInstance.state, toRefs(paginatedState));
+    return /** @type {PagedListInstance} */ (listInstance);
+}
+
 /**
  *
  * @param {PagedListListanceOptions & import('./listInstance.js').ListInstanceOptions} options - The options.
  * @returns {PagedListInstance} - The paged list instance.
  */
 export function usePagedListInstance({ keepOldPages, ...useListInstanceArgs }) {
-    const listInstance = /** @type {PagedListInstance & import('./listInstance.js').ListInstance} */ (
-        /** @type {unknown} */ (useListInstance({ keepOldPages, ...useListInstanceArgs }))
-    );
+    /** @type {PaginatedState} */
+    const paginatedState = reactive({
+        totalRecords: 0,
+        totalPages: 0,
+        perPage: 0,
+        pageToIds: new Map(),
+    });
 
-    listInstance.state.totalRecords = 0;
-    listInstance.state.totalPages = 0;
-    listInstance.state.perPage = 0;
+    const paginatedListInstance = makePagedListInstance(
+        useListInstance({ keepOldPages, ...useListInstanceArgs }),
+        paginatedState
+    );
 
-    const superClearList = listInstance.clearList;
-    listInstance.clearList = () => {
+    const superClearList = paginatedListInstance.clearList;
+    paginatedListInstance.clearList = () => {
         superClearList();
-        listInstance.state.totalRecords = 0;
-        listInstance.state.totalPages = 0;
-        listInstance.state.perPage = 0;
+        paginatedState.totalRecords = 0;
+        paginatedState.totalPages = 0;
+        paginatedState.perPage = 0;
     };
     if (keepOldPages === undefined) {
         throw new Error("keepOldPages is required");
     }
 
-    listInstance.pageCallback = (newObjects, { totalRecords, totalPages, perPage }) => {
+    paginatedListInstance.pageCallback = (
+        /** @type {import('./listInstance.js').ListObject[]} */ newObjects,
+        /** @type {import('../config/listCrud.js').PaginateInfo} */ { page, totalRecords, totalPages, perPage }
+    ) => {
         // with keepOldPages, you are responsible for clearing the list as needed
         if (!keepOldPages) {
             // display one page at a time, clear the list
-            listInstance.clearList();
+            paginatedListInstance.clearList();
         }
         newObjects.forEach((newObject) => {
-            if (newObject[listInstance.state.pkKey] in listInstance.state.objects) {
-                listInstance.updateListObject(newObject);
+            if (newObject[paginatedListInstance.state.pkKey] in paginatedListInstance.state.objects) {
+                paginatedListInstance.updateListObject(newObject);
             } else {
-                listInstance.addListObject(newObject);
+                paginatedListInstance.addListObject(newObject);
             }
         });
+        if (keepOldPages && page !== undefined) {
+            const pageIds = newObjects.map((obj) => obj[paginatedListInstance.state.pkKey] + "");
+            // webstorm being crazy
+            // noinspection JSUnresolvedReference
+            paginatedState.pageToIds.set(page, pageIds);
+        }
         if (totalRecords !== undefined) {
-            listInstance.state.totalRecords = totalRecords;
+            paginatedState.totalRecords = totalRecords;
         }
         if (totalPages !== undefined) {
-            listInstance.state.totalPages = totalPages;
+            paginatedState.totalPages = totalPages;
         }
         if (perPage !== undefined) {
-            listInstance.state.perPage = perPage;
+            paginatedState.perPage = perPage;
         }
     };
 
-    return listInstance;
+    return paginatedListInstance;
 }