module@warp-drive/react

Interface RequestStates<RT, E>

interface RequestStates<RT, E> {
  cancelled?: FC<{
  error: StructuredErrorDocument<E>;
  features: RecoveryFeatures;
}>;
  content: FC<{
  features: ContentFeatures<RT>;
  result: RT;
}>;
  error: FC<{
  error: StructuredErrorDocument<E>;
  features: RecoveryFeatures;
}>;
  idle?: FC<object>;
  loading?: FC<{
  state: RequestLoadingState;
}>;
}

Defined in: -private/request.tsx:173

The components the `<Request />` component renders for each state of its request, passed as its states prop.

error and content are required. The rest are optional:

• idle: without it, the component throws while idle
• loading: without it, nothing renders while the request is in flight
• cancelled: without it, a cancelled request renders the error component

Example

import type { RequestStates } from "@warp-drive/react";
import type { User } from "./schemas/user";

const states: RequestStates<User, unknown> = {
  loading: () => <Spinner />,
  error: ({ error, features }) => <button onClick={features.retry}>{error.message}</button>,
  content: ({ result }) => <h1>{result.name}</h1>,
};

Type Parameters

RT

RT

E

E

Properties

cancelled?

optional cancelled?: FC<{
  error: StructuredErrorDocument<E>;
  features: RecoveryFeatures;
}>;

Defined in: -private/request.tsx:191

The component to render when the request was cancelled.

---

content

content: FC<{
  features: ContentFeatures<RT>;
  result: RT;
}>;

Defined in: -private/request.tsx:222

The component to render when the request succeeded. It receives the response as result, and the ContentFeatures used to refresh, reload, or abort the request.

---

error

error: FC<{
  error: StructuredErrorDocument<E>;
  features: RecoveryFeatures;
}>;

Defined in: -private/request.tsx:205

The component to render when the request failed.

---

idle?

optional idle?: FC<object>;

Defined in: -private/request.tsx:178

The component to render when the component is idle and waiting to be given a request.

---

loading?

optional loading?: FC<{
  state: RequestLoadingState;
}>;

Defined in: -private/request.tsx:185

The component to render when the request is loading. It receives the RequestLoadingState.