Fixed: pager appears to be broken #167

app/components/ving/Pager.vue

@@ -13,7 +13,7 @@
 const props = defineProps(['kind']);
 
 function changePage(page) {
-    props.kind.query.page = page.page + 1
+    props.kind.query = {...props.kind.query, page };
     props.kind.search();
 }
 </script>

app/composables/ving/useVingKind.mjs

@@ -20,7 +20,7 @@ class VingKind {
     })
 
     /**
-     * The object where new properties are stored awaiting being sent to the server to create the record for real.
+     * The object where new properties are stored awaiting being sent to the server to create the record for real. Note that this is generated `set`/`get` and thus you must set a full object if you set it.
      */
 
     get new() {
@@ -32,7 +32,7 @@ class VingKind {
     }
 
     /**
-     * The object containing paging data.
+     * The object containing paging data. Note that this is generated `set`/`get` and thus you must set a full object if you set it.
      */
     get paging() {
         return this.#state.paging;
@@ -43,7 +43,7 @@ class VingKind {
     }
 
     /**
-     * The object containing enumerated props options once `fetchPropsOptions` is called.
+     * The object containing enumerated props options once `fetchPropsOptions` is called. Note that this is generated `set`/`get` and thus you must set a full object if you set it.
      */
     get propsOptions() {
         return this.#state.propsOptions;
@@ -54,7 +54,7 @@ class VingKind {
     }
 
     /**
-     * An object containing the query parameters to send when interacting with endpoints for this kind.
+     * An object containing the query parameters to send when interacting with endpoints for this kind. Note that this is generated `set`/`get` and thus you must set a full object if you set it.
      */
 
     get query() {
@@ -66,7 +66,7 @@ class VingKind {
     }
 
     /**
-     * An array containing the list of records that have been fetched from the server.
+     * An array containing the list of records that have been fetched from the server. Note that this is generated `set`/`get` and thus you must set a full array if you set it.
      */
     get records() {
         return this.#state.records;

app/pages/user/settings/apikeys.vue

@@ -94,7 +94,7 @@ const apikeys = useVingKind({
     listApi: currentUser.links?.apikeys.href,
     createApi: `/api/${useRestVersion()}/apikey`,
     query: { includeMeta: true, sortBy: 'name', sortOrder: 'asc' },
-    newDefaults: { name: '', reason: '', url: 'http://', userId: currentUser.props?.id },
+    newDefaults: { name: 'My New API Key', reason: '', url: 'http://', userId: currentUser.props?.id },
 });
 await apikeys.search();
 onBeforeRouteLeave(() => apikeys.dispose());

ving/docs/change-log.md

@@ -5,6 +5,9 @@ outline: deep
 
 ## June 2024
 
+### 2024-06-24
+* Fixed: pager appears to be broken #167
+
 ### 2024-06-23
 * Fixed: examples in VingSchema need to differentiate between the able and the kind class #155
 * Implemented: add manifest.json file #162