Realtime

WebSocket/SSE/BroadcastChannel realtime extension for the dataProvider — live List/Edit/Show views, menu badges, record locks.

realtimeDataProvider wraps an existing DataProvider with pub-sub and (optionally) locking capabilities, producing a RealtimeDataProvider that all realtime hooks and components expect.

addEventsForMutations wraps a data provider so that its own write operations (create, update, updateMany, delete, deleteMany) automatically publish realtime events through a publisher (usually the same RealtimeDataProvider). This enables cross-tab data sync for apps where the backend does not broadcast writes itself.

broadcastChannelTransport creates a RealtimeTransport backed by the browser's BroadcastChannel API. Events are delivered to all tabs and frames in the same origin — no server required. This makes it useful for demos, intranet apps, and end-to-end tests that run in a single browser.

sseTransport creates a RealtimeTransport backed by a Server-Sent Events connection. The SSE stream carries server-to-client events; publishing is done via a separate HTTP POST to publishUrl. Use this transport for dashboards and read-mostly apps where bidirectional communication is not required.

webSocketTransport creates a RealtimeTransport backed by a WebSocket connection. It reconnects automatically on unclean close, re-subscribes all active topics after reconnect, and buffers pending publishes until the socket is open.

fakeTransport creates an in-memory RealtimeTransport designed for tests. It delivers events synchronously within the same process, exposes a log of all published events, and lets you trigger reconnect callbacks on demand.

<ListLive> is a drop-in replacement for <List> that subscribes to realtime events for the resource. When a created, updated, or deleted event arrives on the resource/<name> topic — or when the transport reconnects — the list is automatically refreshed.

<EditLive> is a drop-in replacement for <Edit> that subscribes to realtime events for the current record. When an updated or deleted event arrives on resource/<name>/<id> — or when the transport reconnects — the record is automatically re-fetched.

<ShowLive> is a drop-in replacement for <Show> that subscribes to realtime events for the displayed record. When an updated or deleted event arrives on resource/<name>/<id> — or when the transport reconnects — the record is automatically re-fetched.

<MenuLive> renders a navigation menu where each item shows a badge with the count of unread realtime events since the user last visited that route. The count resets automatically when the user navigates to the resource.

inMemoryLockProvider creates a LockProvider that stores locks in a JavaScript Map. It is intended for demos and tests — not for production use.

<LockOnMount> acquires a record lock when it mounts and releases it on unmount. It renders its children when the lock is held, a loading indicator while locking, and a "locked by" message when the record is already locked by someone else.

<LockStatus> fetches the live lock state for a record and renders a badge or custom content showing who holds the lock. It subscribes to lock events so the display updates in real time without polling.

useLock returns a lock function for acquiring a record lock via the LockProvider configured on the data provider.

useUnlock returns an unlock function for releasing a record lock.

useLockOnMount acquires a record lock when the component mounts and releases it automatically on unmount. It falls back to the current ResourceContext, RecordContext, and authProvider identity when explicit options are not provided.

useGetLock fetches the current lock for a single record. It is a one-time query — the result is not automatically refreshed when lock state changes. Use useGetLockLive for a live view.

useGetLockLive fetches the current lock for a single record and automatically re-fetches it whenever a locked or unlocked event arrives on lock/<resource>/<id>, or when the transport reconnects.

useGetLocks fetches all current locks for a resource. It is a one-time query — use useGetLocksLive for a live view.

useGetLocksLive fetches all locks for a resource and re-fetches automatically when any locked or unlocked event arrives on lock/<resource>, or when the transport reconnects.

useSubscribe subscribes to a pub-sub topic for the lifetime of the component. The subscription is cleaned up automatically on unmount or when topic / enabled changes.

useSubscribeCallback returns a stable subscribe function you can call imperatively to start a subscription and receive an Unsubscribe function back. Use it when you need to manage the subscription lifetime yourself (e.g. subscribing inside an event handler or effect).

useSubscribeToRecord subscribes to the resource/<name>/<id> topic for a single record. It is a thin wrapper around useSubscribe that builds the correct topic string.

useSubscribeToRecordList subscribes to the resource/<name> topic for a whole resource collection. It fires on created, updated, and deleted events for any record in the collection.

usePublish returns a stable publish function that sends an event to a topic via the realtime transport.

useRealtimeStatus returns the current connection status of the realtime transport. Use it to show a connectivity indicator in the UI.

useOnReconnect registers a callback that fires whenever the realtime transport reconnects after a dropped connection. Use it to re-fetch or invalidate queries so the UI recovers from any missed events.

useGetListLive is a drop-in replacement for useGetList that also subscribes to the resource topic and invalidates the query whenever a realtime event arrives or the transport reconnects.

useGetOneLive is a drop-in replacement for useGetOne that subscribes to the individual record topic and re-fetches whenever an event arrives for that record or the transport reconnects.

useGetManyLive is a drop-in replacement for useGetMany that subscribes to the individual record topic for every ID in params.ids and re-fetches when any of them changes.

Record-attached threaded discussion. Reads a comments sub-resource via useGetList, filtered by the parent record's id. Renders one card per comment plus a new-comment textarea.

<PresenceBar> shows a stack of avatars representing other users currently viewing or editing the same record. By default it uses the browser's BroadcastChannel API for same-origin cross-tab presence, so it works in dev/demo without backend setup. For production, plug in a WebSocket / Supabase Realtime / SSE transport via the transport prop.