enhance: Entity.pk() default provided that uses id

README.md

@@ -45,10 +45,6 @@ For more details, see [the Installation docs page](https://dataclient.io/docs/ge
 class User extends Entity {
   id = '';
   username = '';
-
-  pk() {
-    return this.id;
-  }
 }
 
 class Article extends Entity {
@@ -58,10 +54,6 @@ class Article extends Entity {
   author = User.fromJS();
   createdAt = Temporal.Instant.fromEpochSeconds(0);
 
-  pk() {
-    return this.id;
-  }
-
   static schema = {
     author: User,
     createdAt: Temporal.Instant.from,

__tests__/new.ts

@@ -162,10 +162,6 @@ export class User extends Entity {
   readonly username: string = '';
   readonly email: string = '';
   readonly isAdmin: boolean = false;
-
-  pk() {
-    return this.id?.toString();
-  }
 }
 export const UserResource = resource({
   path: 'http\\://test.com/user/:id',
@@ -179,10 +175,6 @@ export class Article extends Entity {
   readonly author: User | null = null;
   readonly tags: string[] = [];
 
-  pk() {
-    return this.id?.toString();
-  }
-
   static schema = {
     author: User,
   };
@@ -621,10 +613,6 @@ export abstract class UnionBase extends Entity {
   readonly id: string = '';
   readonly body: string = '';
   readonly type: string = '';
-
-  pk() {
-    return this.id;
-  }
 }
 export class FirstUnion extends UnionBase {
   readonly type = 'first';

docs/core/api/useSubscription.md

@@ -91,7 +91,6 @@ function useSubscription<
 ### Only subscribe while element is visible
 
 ```tsx title="MasterPrice.tsx"
-import { useRef } from 'react';
 import { useSuspense, useSubscription } from '@data-client/react';
 import { getPrice } from 'api/Price';
 

docs/core/getting-started/data-dependency.md

@@ -40,9 +40,6 @@ export class User extends Entity {
     return `https://i.pravatar.cc/64?img=${this.id + 4}`;
   }
 
-  pk() {
-    return this.id;
-  }
   static key = 'User';
 }
 export const UserResource = resource({
@@ -57,9 +54,6 @@ export class Post extends Entity {
   title = '';
   body = '';
 
-  pk() {
-    return this.id;
-  }
   static key = 'Post';
 
   static schema = {
@@ -322,9 +316,6 @@ export class Profile extends Entity {
   fullName = '';
   bio = '';
 
-  pk() {
-    return this.id?.toString();
-  }
   static key = 'Profile';
 }
 

docs/core/getting-started/mutations.md

@@ -35,9 +35,7 @@ export class Todo extends Entity {
   userId = 0;
   title = '';
   completed = false;
-  pk() {
-    return `${this.id}`;
-  }
+
   static key = 'Todo';
 }
 export const TodoResource = resource({

docs/core/getting-started/resource.md

@@ -49,9 +49,6 @@ export class Todo extends Entity {
   title = '';
   completed = false;
 
-  pk() {
-    return `${this.id}`;
-  }
   static key = 'Todo';
 }
 

docs/core/shared/_VoteDemo.mdx

@@ -13,9 +13,6 @@ export class Post extends Entity {
   body = '';
   votes = 0;
 
-  pk() {
-    return this.id;
-  }
   static key = 'Post';
 
   static schema = {

docs/core/shared/_useLoading.mdx

@@ -13,9 +13,6 @@ export class Post extends Entity {
   body = '';
   votes = 0;
 
-  pk() {
-    return this.id;
-  }
   static key = 'Post';
 
   get img() {

docs/rest/guides/pagination.md

@@ -129,34 +129,50 @@ interface Props {
 }
 ```
 
-```tsx title="ValidatorList" {12-16}
+```tsx title="LoadMore" {8-11}
+import { useController, useLoading } from '@data-client/react';
+import { getValidators } from './Validator';
+
+export default function LoadMore({ next_key, limit }) {
+  const ctrl = useController();
+  const [handleLoadMore, isPending] = useLoading(
+    () =>
+      ctrl.fetch(getValidators.getPage, {
+        'pagination.limit': limit,
+        'pagination.key': next_key,
+      }),
+    [next_key, limit],
+  );
+  if (!next_key) return null;
+  return (
+    <center>
+      <button onClick={handleLoadMore} disabled={isPending}>
+        {isPending ? '...' : 'Load more'}
+      </button>
+    </center>
+  );
+}
+```
+
+```tsx title="ValidatorList" collapsed
 import { useSuspense } from '@data-client/react';
 import ValidatorItem from './ValidatorItem';
 import { getValidators } from './Validator';
+import LoadMore from './LoadMore';
 
 const PAGE_LIMIT = '3';
 
 export default function ValidatorList() {
   const { validators, pagination } = useSuspense(getValidators, {
     'pagination.limit': PAGE_LIMIT,
   });
-  const ctrl = useController();
-  const handleLoadMore = () =>
-    ctrl.fetch(getValidators.getPage, {
-      'pagination.limit': PAGE_LIMIT,
-      'pagination.key': pagination.next_key,
-    });
 
   return (
     <div>
       {validators.map(validator => (
         <ValidatorItem key={validator.pk()} validator={validator} />
       ))}
-      {pagination.next_key ? (
-        <center>
-          <button onClick={handleLoadMore}>Load more</button>
-        </center>
-      ) : null}
+      <LoadMore next_key={pagination.next_key} limit={PAGE_LIMIT} />
     </div>
   );
 }

docs/rest/guides/relational-data.md

@@ -100,21 +100,13 @@ import { Entity } from '@data-client/rest';
 export class User extends Entity {
   id = '';
   name = '';
-
-  pk() {
-    return this.id;
-  }
 }
 
 export class Comment extends Entity {
   id = '';
   content = '';
   commenter = User.fromJS();
 
-  pk() {
-    return this.id;
-  }
-
   static schema = {
     commenter: User,
   };
@@ -126,10 +118,6 @@ export class Post extends Entity {
   author = User.fromJS();
   comments: Comment[] = [];
 
-  pk() {
-    return this.id;
-  }
-
   static schema = {
     author: User,
     comments: [Comment],
@@ -193,9 +181,6 @@ export class User extends Entity {
   name = '';
   email = '';
   website = '';
-  pk() {
-    return this.id;
-  }
 }
 export const UserResource = resource({
   urlPrefix: 'https://jsonplaceholder.typicode.com',
@@ -213,9 +198,6 @@ export class Todo extends Entity {
   user? = User.fromJS({});
   title = '';
   completed = false;
-  pk() {
-    return this.id;
-  }
   static schema = {
     user: User,
   };
@@ -348,10 +330,6 @@ export class User extends Entity {
   posts: Post[] = [];
   comments: Comment[] = [];
 
-  pk() {
-    return this.id;
-  }
-
   static merge(existing, incoming) {
     return {
       ...existing,
@@ -382,10 +360,6 @@ export class Comment extends Entity {
   commenter = User.fromJS();
   post = Post.fromJS();
 
-  pk() {
-    return this.id;
-  }
-
   static schema: Record<string, Schema> = {
     commenter: User,
   };
@@ -400,10 +374,6 @@ export class Post extends Entity {
   author = User.fromJS();
   comments: Comment[] = [];
 
-  pk() {
-    return this.id;
-  }
-
   static schema = {
     author: User,
     comments: [Comment],
@@ -541,10 +511,6 @@ export class Post extends Entity {
   title = '';
   author = User.fromJS();
 
-  pk() {
-    return this.id;
-  }
-
   static schema = {
     author: User,
   };
@@ -572,10 +538,6 @@ export class User extends Entity {
   posts: Post[] = [];
   createdAt = Temporal.Instant.fromEpochSeconds(0);
 
-  pk() {
-    return this.id;
-  }
-
   static schema: Record<string, Schema | Date> = {
     createdAt: Temporal.Instant.from,
   };

packages/core/src/controller/__tests__/get.ts

@@ -7,9 +7,6 @@ describe('Controller.get()', () => {
   class Tacos extends Entity {
     type = '';
     id = '';
-    pk() {
-      return this.id;
-    }
   }
   const TacoList = new schema.Collection([Tacos]);
   const entities = {
@@ -54,10 +51,6 @@ describe('Controller.get()', () => {
       id = '';
       username = '';
 
-      pk() {
-        return this.id;
-      }
-
       static indexes = ['username'] as const;
     }
 
@@ -223,9 +216,6 @@ describe('Controller.get()', () => {
   it('Union based on args', () => {
     class IDEntity extends Entity {
       id: string = '';
-      pk() {
-        return this.id;
-      }
     }
     class User extends IDEntity {
       type = 'user';

packages/core/src/controller/__tests__/getResponse.ts

@@ -10,9 +10,6 @@ describe('Controller.getResponse()', () => {
     class Tacos extends Entity {
       type = '';
       id = '';
-      pk() {
-        return this.id;
-      }
     }
     const ep = new Endpoint(() => Promise.resolve(), {
       key() {
@@ -129,9 +126,6 @@ describe('Controller.getResponse()', () => {
     class Tacos extends Entity {
       type = '';
       id = '';
-      pk() {
-        return this.id;
-      }
     }
     const ep = new Endpoint(({ id }: { id: string }) => Promise.resolve(), {
       key({ id }) {

packages/core/src/state/__tests__/reducer.ts

@@ -211,9 +211,6 @@ describe('reducer', () => {
     class Counter extends Entity {
       id = 0;
       counter = 0;
-      pk() {
-        return this.id;
-      }
 
       static key = 'Counter';
     }
@@ -241,9 +238,6 @@ describe('reducer', () => {
     class Counter extends Entity {
       id = 0;
       counter = 0;
-      pk() {
-        return this.id;
-      }
 
       static key = 'Counter';
     }

packages/endpoint/src/__tests__/endpoint.ts

@@ -507,9 +507,6 @@ describe.each([true, false])(`Endpoint (CSP %s)`, mockCSP => {
       const url = ({ id }: { id: string }) => `/users/${id}`;
       class User extends Entity {
         readonly id: string = '';
-        pk() {
-          return this.id;
-        }
       }
       const UserDetail = new Endpoint(
         function ({ id }: { id: string }) {