Skip to content

React

The React bindings live in tapedb/react and take the queries and rooms a createClient() client returns. Hooks and plain calls share the same connection, cache and outbox. React 19 is an optional peer dependency; the core entry stays React-free.

import { useBroadcast, useLive, useLivePage, usePresence } from "tapedb/react";
const { data, isLoading } = useLive(
db.task.findMany({ where: { columnId }, orderBy: { position: "asc" } })
);
const feed = useLivePage(db.task.findPage({ orderBy: { id: "desc" }, take: 50 }));
// feed.rows, feed.hasMore, feed.loadMore() — every loaded page stays live
const peers = usePresence(db, "board:" + boardId, { name, color });

A new query object every render is fine: the subscription follows the query’s key, so equal arguments keep one subscription. useLivePage keeps every loaded page live and survives reconnects.

Broadcast has its own hook:

const send = useBroadcast(db, "board:" + boardId, (message, from) =>
flash(from.userId, message)
);

The latest callback is always the one called, so it does not need to be memoised. send returns false while offline.

See Queries & live data for the query API and Files, presence & broadcast for the room APIs.