YATTA
Docs
API reference

yatta/react

React hooks over the same route table.

9 exported symbols and 9 members, read from src/react/universal-hooks.tsx.

Construct

callKey

function

A cache key that identifies a call by what it asked for.

Built from the method's name and a stable serialisation of the arguments, so two components asking the same question share one value and one request — and an argument object rebuilt on every render does not look like a different question.

callKey(method: unknown, args: unknown): string

CallStoreProvider

function

Provides a store to everything below it.

CallStoreProvider({ store, children, }: { store: CallStore; children?: React.ReactNode; }): React.ReactNode

methodName

function

The route a method came from.

Carried on the function rather than looked up, so a key cannot collide between two apps in one process and a client method is traceable to its route.

methodName(method: unknown): string

useCall

function

Calls a route and keeps the result.

The method and the arguments are the whole API — no wrapper function, no dependency array to get wrong, no name string to keep in step: ```tsx const { data, error, fetching, refetch } = useCall(api.getUser, { params: { id } }); ``` Adding a route adds nothing here. Changing a route's schema changes this signature, because the argument type is read off the route itself.

useCall<TArgs, TResult>(method: (args?: TArgs) => Promise<TResult>, args?: TArgs, options?: { enabled?: boolean; store?: CallStore | null; }): CallState<TResult> & { refetch: () => void; set: (updater: TResult | ((previous: TResult | undefined) => TResult)) => void; }
tsts
const { data, error, fetching, refetch } = useCall(api.getUser, { params: { id } });

useCallMutation

function

Calls a route that changes something, with an optional optimistic write.

The write happens before the request and is undone if it fails, because a form that does not respond until the server answers feels broken on a slow connection. A failure rolls the value back — leaving it would show a change that never happened.

useCallMutation<TArgs, TResult>(method: (args?: TArgs) => Promise<TResult>, options?: { store?: CallStore | null; optimistic?: { key: string; value: unknown | ((args: TArgs) => unknown); }; invalidates?: string[]; onSuccess?: (result: TResult, args: TArgs) => void; onError?: (error: Error, args: TArgs) => void; }): { call: (args?: TArgs) => Promise<TResult | undefined>; pending: boolean; error: Error | undefined; }

useRequiredStore

function

The store a call reads and writes.

Throws rather than returning null, because a component that quietly keeps no results is much harder to diagnose than one that says why.

useRequiredStore(): CallStore

useRoutes

function

The whole app's routes, ready to call.

Derived from the app, so this is the same set of methods whether it runs in a Server Component (calling in process) or in the browser (calling over HTTP).

useRoutes<R extends RouteTable>(app: App<R> & DirectMethods<R>): DirectMethods<R>

Types

CallState

interface
interface CallState<T>

4 members

  • dataproperty
    data: T | undefined
  • errorproperty
    error: Error | undefined
  • fetchingproperty
    fetching: boolean
  • staleproperty
    stale: boolean

CallStore

interface

Somewhere to keep a call's result between renders.

interface CallStore

5 members

  • get
    get<T>(key: string): CallState<T>
  • resolve
    resolve<T>(key: string, fetcher: () => Promise<T>, options?: { force?: boolean; }): Promise<T | undefined>
  • subscribe
    subscribe(onChange: (changedKey?: string) => void, key?: string): () => void
  • set
    set<T>(key: string, updater: T | ((previous: T | undefined) => T)): void
  • invalidate
    invalidate(key?: string, all?: boolean): void
Tip
Most of the types above are inferred. You rarely import AuthConfig or JobPayload — declaring your schema once is enough for the rest to follow. See Typed keys.