Skip to main content
Version: 5.2

HookableResource

HookableResource is just like Resource but its endpoints are hooks.

import { HookableResource } from '@rest-hooks/rest';

export default class ArticleResource extends HookableResource {
  readonly id: number | undefined = undefined;
  readonly title: string = '';
  readonly content: string = '';
  readonly author: number | null = null;
  readonly tags: string[] = [];

  pk() {
    return this.id?.toString();
  }

  static urlRoot = 'http://test.com/article/';
}
extends

Resource extends BaseResource

tip

See Resource for more information

Static network methods and properties​

These are the basic building blocks used to compile the Endpoint below.

static useFetchInit(init: RequestInit): RequestInit​

Allows simple overrides to extend RequestInit sent to fetch. This is called in endpoint methods (list(), detail()), which allows for hooks that use React context.

This is often useful for authentication

Endpoints​

These provide the standard CRUD endpointss common in REST APIs. Feel free to customize or add new endpoints based to match your API.

useDetail(): Endpoint​

A GET request using standard url() that receives a detail body. Mostly useful with useSuspense

  • Uses url()
  • Compatible with all hooks

Implementation:​

static useDetail<T extends typeof SimpleResource>(this: T) {
  return this.memo('#detail', () =>
    this.endpoint().extend({
      schema: this as SchemaDetail<Readonly<AbstractInstanceType<T>>>,
    }),
  );
}

useList(): Endpoint​

A GET request using listUrl() that receives a list of entities. Mostly useful with useSuspense

Implementation:​

static useList<T extends typeof SimpleResource>(this: T) {
  return this.memo('#list', () =>
    this.endpoint().extend({
      schema: [this] as SchemaList<Readonly<AbstractInstanceType<T>>>,
      url: this.listUrl.bind(this),
    }),
  );
}

useCreate(): Endpoint​

A POST request sending a payload to listUrl() with empty params, and expecting a detail body response. Mostly useful with Controller.fetch

Uses listUrl()

Not compatible with:

Implementation:​

static useCreate<T extends typeof SimpleResource>(this: T) {
  return this.memo('#create', () =>
    this.endpointMutate().extend({
      schema: this as SchemaDetail<Readonly<AbstractInstanceType<T>>>,
      url: this.listUrl.bind(this),
    }),
  );
}

useUpdate(): Endpoint​

A PUT request sending a payload to a url() expecting a detail body response. Mostly useful with Controller.fetch

Uses url()

Not compatible with:

Implementation:​

static useUpdate<T extends typeof SimpleResource>(this: T) {
  return this.memo('#update', () =>
    this.endpointMutate().extend({
      method: 'PUT',
      schema: this as SchemaDetail<Readonly<AbstractInstanceType<T>>>,
    }),
  );
}

usePartialUpdate(): Endpoint​

A PATCH request sending a partial payload to url() expecting a detail body response. Mostly useful with Controller.fetch

Uses url()

Not compatible with:

Implementation:​

static usePartialUpdate<T extends typeof SimpleResource>(this: T) {
  return this.memo('#partialUpdate', () =>
    this.endpointMutate().extend({
      method: 'PATCH',
      schema: this as SchemaDetail<Readonly<AbstractInstanceType<T>>>,
    }),
  );
}

useDelete(): Endpoint​

A DELETE request sent to url() Mostly useful with Controller.fetch

Uses url()

Not compatible with:

Implementation:​

static useDelete<T extends typeof SimpleResource>(this: T) {
  const endpoint = this.endpointMutate();
  return this.memo('#delete', () =>
    endpoint.extend({
      fetch(params: Readonly<object>) {
        return endpoint.fetch.call(this, params).then(() => params);
      },
      method: 'DELETE',
      schema: new schema.Delete(this),
    }),
  );
}