@data-client/rest 0.5.0 → 0.7.0

package/src/RestEndpoint.d.ts

@@ -46,6 +46,7 @@ export interface RestInstanceBase<
   /** @see https://resthooks.io/rest/api/RestEndpoint#method */
   readonly method: (O & { method: string })['method'];
   readonly signal: AbortSignal | undefined;
+  readonly paginationField?: string;
 
   /* fetch lifecycles */
   /* before-fetch */
@@ -77,10 +78,15 @@ export interface RestInstanceBase<
   /** Creates a child endpoint that inherits from this while overriding provided `options`.
    * @see https://dataclient.io/rest/api/RestEndpoint#extend
    */
-  extend<E extends RestInstanceBase, O extends PartialRestGenerics | {}>(
+  extend<
+    E extends RestInstanceBase,
+    ExtendOptions extends PartialRestGenerics | {},
+  >(
     this: E,
-    options: Readonly<RestEndpointExtendOptions<O, E, F> & O>,
-  ): RestExtendedEndpoint<O, E>;
+    options: Readonly<
+      RestEndpointExtendOptions<ExtendOptions, E, F> & ExtendOptions
+    >,
+  ): RestExtendedEndpoint<ExtendOptions, E>;
 }
 
 export interface RestInstance<
@@ -92,9 +98,10 @@ export interface RestInstance<
     body?: any;
     searchParams?: any;
     method?: string;
+    paginationField?: string;
   } = { path: string },
 > extends RestInstanceBase<F, S, M, O> {
-  /** Endpoint to append the next page extending a list for pagination
+  /** Creates an Endpoint to append the next page extending a list for pagination
    * @see https://dataclient.io/rest/api/RestEndpoint#paginated
    */
   paginated<
@@ -111,6 +118,17 @@ export interface RestInstance<
     this: E,
     cursorField: C,
   ): PaginationFieldEndpoint<E, C>;
+  /** Endpoint to append the next page extending a list for pagination
+   * @see https://dataclient.io/rest/api/RestEndpoint#getPage
+   */
+  getPage: 'paginationField' extends keyof O
+    ? O['paginationField'] extends string
+      ? PaginationFieldEndpoint<
+          F & { schema: S; sideEffect: M } & O,
+          O['paginationField']
+        >
+      : undefined
+    : undefined;
   /** Endpoint that pushes (place at end) a newly created entity to this Collection
    * @see https://dataclient.io/rest/api/RestEndpoint#push
    */
@@ -159,11 +177,16 @@ export type RestEndpointExtendOptions<
     ? Extract<O['schema'], Schema | undefined>
     : E['schema']
 > &
-  Partial<Omit<E, KeyofRestEndpoint | keyof PartialRestGenerics>>;
+  Partial<
+    Omit<
+      E,
+      KeyofRestEndpoint | keyof PartialRestGenerics | keyof RestEndpointOptions
+    >
+  >;
 
 type OptionsToRestEndpoint<
   O extends PartialRestGenerics,
-  E extends RestInstanceBase & { body?: any },
+  E extends RestInstanceBase & { body?: any; paginationField?: string },
   F extends FetchFunction,
 > = 'path' extends keyof O
   ? RestType<
@@ -186,6 +209,9 @@ type OptionsToRestEndpoint<
           ? O['searchParams']
           : E['searchParams'];
         method: 'method' extends keyof O ? O['method'] : E['method'];
+        paginationField: 'paginationField' extends keyof O
+          ? O['paginationField']
+          : E['paginationField'];
       }
     >
   : 'body' extends keyof O
@@ -209,6 +235,9 @@ type OptionsToRestEndpoint<
           ? O['searchParams']
           : E['searchParams'];
         method: 'method' extends keyof O ? O['method'] : E['method'];
+        paginationField: 'paginationField' extends keyof O
+          ? O['paginationField']
+          : Extract<E['paginationField'], string>;
       }
     >
   : 'searchParams' extends keyof O
@@ -228,6 +257,9 @@ type OptionsToRestEndpoint<
         body: E['body'];
         searchParams: O['searchParams'];
         method: 'method' extends keyof O ? O['method'] : E['method'];
+        paginationField: 'paginationField' extends keyof O
+          ? O['paginationField']
+          : Extract<E['paginationField'], string>;
       }
     >
   : RestInstance<
@@ -243,15 +275,21 @@ type OptionsToRestEndpoint<
           ? O['searchParams']
           : E['searchParams'];
         method: 'method' extends keyof O ? O['method'] : E['method'];
+        paginationField: 'paginationField' extends keyof O
+          ? O['paginationField']
+          : E['paginationField'];
       }
     >;
 
 export type RestExtendedEndpoint<
   O extends PartialRestGenerics,
-  E extends RestInstanceBase,
+  E extends RestInstanceBase & { getPage?: unknown },
 > = OptionsToRestEndpoint<
   O,
-  E,
+  E &
+    (E extends { getPage: { paginationField: string } }
+      ? { paginationField: E['getPage']['paginationField'] }
+      : unknown),
   RestInstance<
     (
       ...args: Parameters<E>
@@ -266,13 +304,20 @@ export type RestExtendedEndpoint<
   Omit<E, KeyofRestEndpoint | keyof O>;
 
 export interface PartialRestGenerics {
+  /** @see https://resthooks.io/rest/api/RestEndpoint#path */
   readonly path?: string;
+  /** @see https://resthooks.io/rest/api/RestEndpoint#schema */
   readonly schema?: Schema | undefined;
+  /** @see https://resthooks.io/rest/api/RestEndpoint#method */
   readonly method?: string;
   /** Only used for types */
+  /** @see https://dataclient.io/rest/api/RestEndpoint#body */
   body?: any;
   /** Only used for types */
+  /** @see https://dataclient.io/rest/api/RestEndpoint#searchParams */
   searchParams?: any;
+  /** @see https://dataclient.io/rest/api/RestEndpoint#paginationfield */
+  readonly paginationField?: string;
   /** @see https://resthooks.io/rest/api/RestEndpoint#process */
   process?(value: any, ...args: any): any;
 }
@@ -283,7 +328,7 @@ export interface RestGenerics extends PartialRestGenerics {
 export type PaginationEndpoint<
   E extends FetchFunction & RestGenerics & { sideEffect?: true | undefined },
   A extends any[],
-> = RestInstance<
+> = RestInstanceBase<
   ParamFetchNoBody<A[0], ResolveType<E>>,
   E['schema'],
   E['sideEffect'],
@@ -294,7 +339,7 @@ export type PaginationEndpoint<
 export type PaginationFieldEndpoint<
   E extends FetchFunction & RestGenerics & { sideEffect?: true | undefined },
   C extends string,
-> = RestInstance<
+> = RestInstanceBase<
   ParamFetchNoBody<
     { [K in C]: string | number | boolean } & E['searchParams'] &
       PathArgs<Exclude<E['path'], undefined>>,
@@ -305,7 +350,7 @@ export type PaginationFieldEndpoint<
   Pick<E, 'path' | 'searchParams' | 'body'> & {
     searchParams: { [K in C]: string | number | boolean } & E['searchParams'];
   }
->;
+> & { paginationField: C };
 export type AddEndpoint<
   F extends FetchFunction = FetchFunction,
   S extends Schema | undefined = any,
@@ -443,7 +488,8 @@ export type RestType<
     path: string;
     body?: any;
     searchParams?: any;
-  } = { path: string },
+    paginationField?: string;
+  } = { path: string; paginationField: string },
   // eslint-disable-next-line @typescript-eslint/ban-types
 > = IfTypeScriptLooseNull<
   RestInstance<
@@ -576,6 +622,7 @@ export type GetEndpoint<
     readonly schema: Schema;
     /** Only used for types */
     readonly searchParams?: any;
+    readonly paginationField?: string;
   } = {
     path: string;
     schema: Schema;

package/src/RestEndpoint.js

@@ -231,6 +231,10 @@ Response (first 300 characters): ${text.substring(0, 300)}`;
     return this.extend({ update: paginationUpdate(this, removeCursor) });
   }
 
+  get getPage() {
+    return this.paginated(this.paginationField);
+  }
+
   get push() {
     return this.extend({
       method: 'POST',

package/src/__tests__/RestEndpoint.ts

@@ -1,4 +1,4 @@
-import { Entity } from '@data-client/endpoint';
+import { Entity, schema } from '@data-client/endpoint';
 import { useController } from '@data-client/react';
 import { useSuspense } from '@data-client/react';
 import { CacheProvider } from '@data-client/react';
@@ -86,6 +86,62 @@ const getNextPage2 = getArticleList2.paginated(
   }) => [rest],
 );
 
+const getArticleList3 = new RestEndpoint({
+  urlPrefix: 'http://test.com',
+  path: '/article-paginated',
+  schema: {
+    nextPage: '',
+    data: { results: new schema.Collection([PaginatedArticle]) },
+  },
+  method: 'GET',
+  searchParams: {} as { group: string | number },
+  paginationField: 'cursor',
+}).extend({
+  dataExpiryLength: 10000,
+});
+const getNextPage3 = getArticleList3.getPage;
+
+// type tests
+() => {
+  const base = new RestEndpoint({
+    urlPrefix: 'http://test.com',
+    path: '/article-paginated',
+    schema: {
+      nextPage: '',
+      data: { results: new schema.Collection([PaginatedArticle]) },
+    },
+    method: 'GET',
+  });
+  // @ts-expect-error
+  () => base.getPage();
+  () =>
+    // @ts-expect-error
+    base
+      .extend({
+        path: '',
+        dataExpiryLength: 10000,
+      })
+      .getPage();
+  const a = new RestEndpoint({
+    urlPrefix: 'http://test.com',
+    path: '/article-paginated',
+    schema: {
+      nextPage: '',
+      data: { results: new schema.Collection([PaginatedArticle]) },
+    },
+    method: 'GET',
+    searchParams: {} as { group: string | number },
+  }).extend({
+    path: ':blob',
+    searchParams: {} as { isAdmin?: boolean },
+    method: 'GET',
+    paginationField: 'cursor',
+  });
+  a.getPage({ cursor: 'hi', blob: 'ho' });
+  // @ts-expect-error
+  a.getPage({ blob: 'ho' });
+};
+
 describe('RestEndpoint', () => {
   const renderRestHook: ReturnType<typeof makeRenderRestHook> =
     makeRenderRestHook(CacheProvider);
@@ -277,26 +333,56 @@ describe('RestEndpoint', () => {
       .get(`/article-paginated/happy?cursor=2`)
       .reply(200, paginatedSecondPage);
 
-    const { result, waitForNextUpdate } = renderRestHook(() => {
-      const { fetch } = useController();
+    const { result, waitForNextUpdate, controller } = renderRestHook(() => {
       const {
         data: { results: articles },
         nextPage,
       } = useSuspense(getArticleList2, {
         group: 'happy',
       });
-      return { articles, nextPage, fetch };
+      return { articles, nextPage };
+    });
+    await waitForNextUpdate();
+    // @ts-expect-error
+    () => controller.fetch(getNextPage2);
+    // @ts-expect-error
+    () => controller.fetch(getNextPage2, { fake: 5 });
+    // @ts-expect-error
+    () => controller.fetch(getNextPage2, { group: 'happy' });
+    // @ts-expect-error
+    () => controller.fetch(getNextPage2, { cursor: 2 });
+    await controller.fetch(getNextPage2, {
+      group: 'happy',
+      cursor: 2,
+    });
+    expect(result.current.articles.map(({ id }) => id)).toEqual([5, 3, 7, 8]);
+  });
+
+  it('getPage: should update on get for a paginated resource with parameter in path', async () => {
+    mynock.get(`/article-paginated?group=happy`).reply(200, paginatedFirstPage);
+    mynock
+      .get(`/article-paginated?cursor=2&group=happy`)
+      .reply(200, paginatedSecondPage);
+
+    const { result, waitForNextUpdate, controller } = renderRestHook(() => {
+      const {
+        data: { results: articles },
+        nextPage,
+      } = useSuspense(getArticleList3, {
+        group: 'happy',
+      });
+      return { articles, nextPage };
     });
     await waitForNextUpdate();
     // @ts-expect-error
-    () => result.current.fetch(getNextPage2);
+    () => controller.fetch(getNextPage3);
     // @ts-expect-error
-    () => result.current.fetch(getNextPage2, { fake: 5 });
+    () => controller.fetch(getNextPage3, { fake: 5 });
     // @ts-expect-error
-    () => result.current.fetch(getNextPage2, { group: 'happy' });
+    () => controller.fetch(getNextPage3, { group: 'happy' });
     // @ts-expect-error
-    () => result.current.fetch(getNextPage2, { cursor: 2 });
-    await result.current.fetch(getNextPage2, {
+    () => controller.fetch(getNextPage3, { cursor: 2 });
+    await controller.fetch(getNextPage3, {
       group: 'happy',
       cursor: 2,
     });

package/src/__tests__/createResource.test.ts

@@ -84,9 +84,12 @@ describe('createResource()', () => {
       path: 'http\\://test.com/groups/:group/users/:id',
       schema: User,
     });
+    // @ts-expect-error
+    UserResourceBase.getList.getPage.paginationField;
     const UserResource = UserResourceBase.extend('getList', {
       path: ':blob',
       searchParams: {} as { isAdmin?: boolean },
+      paginationField: 'cursor',
       getOptimisticResponse(snap, params) {
         params.isAdmin;
         params.blob;
@@ -94,9 +97,10 @@ describe('createResource()', () => {
         params.nothere;
         return [] as User[];
       },
-      /*process(users: User[]) {
-            return users.slice(0, 7);
-          }, TODO: why doesn't this work?*/
+      process(users: User[]) {
+        if (!Array.isArray(users)) return users;
+        return users.slice(0, 7);
+      },
     })
       .extend('partialUpdate', {
         getOptimisticResponse(snap, params, body) {
@@ -128,19 +132,18 @@ describe('createResource()', () => {
 
     () => UserResource.getList({ blob: '5', isAdmin: true });
     () =>
-      UserResource.getList.paginated('cursor')({
+      UserResource.getList.getPage({
         blob: '5',
         isAdmin: true,
         cursor: 'next',
       });
-    () =>
-      UserResource.getList.paginated('cursor')({ blob: '5', cursor: 'next' });
+    () => UserResource.getList.getPage({ blob: '5', cursor: 'next' });
     () =>
       // @ts-expect-error
-      UserResource.getList.paginated('cursor')({ blob: '5', isAdmin: true });
+      UserResource.getList.getPage({ blob: '5', isAdmin: true });
     () =>
       // @ts-expect-error
-      UserResource.getList.paginated('cursor')({
+      UserResource.getList.getPage({
         cursor: 'next',
         isAdmin: true,
       });
@@ -208,6 +211,7 @@ describe('createResource()', () => {
     const UserResourceBase = createResource({
       path: 'http\\://test.com/groups/:group/users/:id',
       schema: User,
+      paginationField: 'cursor',
     });
     const UserResource = UserResourceBase.extend({
       getList: {
@@ -263,17 +267,16 @@ describe('createResource()', () => {
 
     () => UserResource.getList({ blob: '5', isAdmin: true });
     () =>
-      UserResource.getList.paginated('cursor')({
+      UserResource.getList.getPage({
         blob: '5',
         isAdmin: true,
         cursor: 'next',
       });
-    () =>
-      UserResource.getList.paginated('cursor')({ blob: '5', cursor: 'next' });
+    () => UserResource.getList.getPage({ blob: '5', cursor: 'next' });
     // @ts-expect-error
-    () => UserResource.getNextPage({ blob: '5', isAdmin: true });
+    () => UserResource.getList.getPage({ blob: '5', isAdmin: true });
     // @ts-expect-error
-    () => UserResource.getNextPage({ cursor: 'next', isAdmin: true });
+    () => UserResource.getList.getPage({ cursor: 'next', isAdmin: true });
     () => UserResource.get({ group: '1', id: '5' });
     () => UserResource.getList.push({ blob: '5' }, { username: 'bob' });
     () =>
@@ -357,69 +360,71 @@ describe('createResource()', () => {
       path: 'http\\://test.com/groups/:group/users/:id',
       schema: User,
       paginationField: 'cursor',
-    })
-      .extend(resourceBase => ({
-        getList: resourceBase.getList.extend({
-          path: ':blob',
-          searchParams: {} as { isAdmin?: boolean },
-          getOptimisticResponse(snap, params) {
-            params.isAdmin;
-            params.blob;
-            // @ts-expect-error
-            params.nothere;
-            return [] as User[];
-          },
-          /*process(users: User[]) {
-              return users.slice(0, 7);
-            }, TODO: why doesn't this work?*/
-        }),
-        partialUpdate: resourceBase.partialUpdate.extend({
-          getOptimisticResponse(snap, params, body) {
-            params.id;
-            params.group;
-            // @ts-expect-error
-            params.nothere;
-            return {
-              id: params.id,
-              ...body,
-            };
-          },
-        }),
-        delete: resourceBase.delete.extend({
-          getOptimisticResponse(snap, params) {
-            return params;
-          },
-        }),
-        justget: resourceBase.get,
-        current: resourceBase.get.extend({
-          path: '/current',
-          searchParams: {} as { isAdmin?: boolean },
-        }),
-        toggleAdmin: resourceBase.get.extend({
-          path: '/toggle/:id',
-          method: 'POST',
-          body: undefined,
-          getOptimisticResponse(snap, params) {
-            params.id;
-            // @ts-expect-error
-            params.group;
-            return {
-              id: params.id,
-            };
-          },
-        }),
-      }))
-      .extend(resourceBase => ({
-        getNextPage: resourceBase.getList.paginated('cursor'),
-      }));
+    }).extend(resourceBase => ({
+      getList: resourceBase.getList.extend({
+        path: ':blob',
+        searchParams: {} as { isAdmin?: boolean },
+        getOptimisticResponse(snap, params) {
+          params.isAdmin;
+          params.blob;
+          // @ts-expect-error
+          params.nothere;
+          return [] as User[];
+        },
+        process(users: User[]) {
+          if (!Array.isArray(users)) return users;
+          return users.slice(0, 7);
+        },
+      }),
+      partialUpdate: resourceBase.partialUpdate.extend({
+        getOptimisticResponse(snap, params, body) {
+          params.id;
+          params.group;
+          // @ts-expect-error
+          params.nothere;
+          return {
+            id: params.id,
+            ...body,
+          };
+        },
+      }),
+      delete: resourceBase.delete.extend({
+        getOptimisticResponse(snap, params) {
+          return params;
+        },
+      }),
+      justget: resourceBase.get,
+      current: resourceBase.get.extend({
+        path: '/current',
+        searchParams: {} as { isAdmin?: boolean },
+      }),
+      toggleAdmin: resourceBase.get.extend({
+        path: '/toggle/:id',
+        method: 'POST',
+        body: undefined,
+        getOptimisticResponse(snap, params) {
+          params.id;
+          // @ts-expect-error
+          params.group;
+          return {
+            id: params.id,
+          };
+        },
+      }),
+    }));
+
     () => UserResource.getList({ blob: '5', isAdmin: true });
     () =>
-      UserResource.getNextPage({ blob: '5', isAdmin: true, cursor: 'next' });
-    () => UserResource.getNextPage({ blob: '5', cursor: 'next' });
+      UserResource.getList.getPage({
+        blob: '5',
+        isAdmin: true,
+        cursor: 'next',
+      });
+    () => UserResource.getList.getPage({ blob: '5', cursor: 'next' });
     // @ts-expect-error
-    () => UserResource.getNextPage({ blob: '5', isAdmin: true });
+    () => UserResource.getList.getPage({ blob: '5', isAdmin: true });
     // @ts-expect-error
-    () => UserResource.getNextPage({ cursor: 'next', isAdmin: true });
+    () => UserResource.getList.getPage({ cursor: 'next', isAdmin: true });
     () => UserResource.get({ group: '1', id: '5' });
     () => UserResource.getList.unshift({ blob: '5' }, { username: 'bob' });
     () =>

package/src/createResource.ts

@@ -30,6 +30,7 @@ export default function createResource<O extends ResourceGenerics>({
   schema,
   Endpoint = RestEndpoint,
   optimistic,
+  paginationField,
   ...extraOptions
 }: Readonly<O> & ResourceOptions): Resource<O> {
   const shortenedPath = shortenPath(path);
@@ -50,10 +51,13 @@ export default function createResource<O extends ResourceGenerics>({
     }) as any;
   if (optimistic) {
     (extraMutateOptions as any).getOptimisticResponse = optimisticUpdate;
-    (extraPartialOptions as any).getOptimisticResponse = optimisticPartial(get);
+    (extraPartialOptions as any).getOptimisticResponse = optimisticPartial(
+      get as any,
+    );
   }
   const getList = new Endpoint({
     ...extraMutateOptions,
+    paginationField: paginationField as string,
     path: shortenedPath,
     schema: new Collection([schema as any]),
     name: getName('getList'),
@@ -133,7 +137,7 @@ export default function createResource<O extends ResourceGenerics>({
 function optimisticUpdate(snap: SnapshotInterface, params: any, body: any) {
   return {
     ...params,
-    ...body,
+    ...ensureBodyPojo(body),
   };
 }
 function optimisticPartial(
@@ -146,10 +150,15 @@ function optimisticPartial(
       ...params,
       ...data,
       // even tho we don't always have two arguments, the extra one will simply be undefined which spreads fine
-      ...body,
+      ...ensureBodyPojo(body),
     };
   };
 }
 function optimisticDelete(snap: SnapshotInterface, params: any) {
   return params;
 }
+function ensureBodyPojo(body: any) {
+  return body instanceof FormData
+    ? Object.fromEntries((body as any).entries())
+    : body;
+}

package/src/paginatedCollections.ts

@@ -9,9 +9,9 @@ export function paginatedMerge(existing: any[], incoming: any[]) {
 export const paginatedFilter =
   <C extends (...args: readonly any[]) => readonly any[]>(removeCursor: C) =>
   (...args: Parameters<C>) => {
-    const noCursorArgs = removeCursor(...args);
+    const noCursorArgs = removeCursor(...args)[0] ?? {};
     return (collectionKey: Record<string, string>) =>
-      shallowEqual(collectionKey, noCursorArgs[0] ?? {});
+      shallowEqual(collectionKey, noCursorArgs);
   };
 
 function shallowEqual(
@@ -20,13 +20,17 @@ function shallowEqual(
 ) {
   const keys1 = Object.keys(object1);
   const keys2 = Object.keys(object2);
-  if (keys1.length !== keys2.length) {
-    return false;
-  }
-  for (const key of keys1) {
-    if (object1[key] != object2[key]) {
+  let length2 = 0;
+  for (const key of keys2) {
+    // we should ignore any members with value undefined
+    if (object2[key] === undefined) continue;
+    if (object1[key] !== `${object2[key]}`) {
       return false;
     }
+    length2++;
+  }
+  if (keys1.length !== length2) {
+    return false;
   }
   return true;
 }