useLiveQueryEffect

function useLiveQueryEffect<TRow, TKey>(config, deps): void;

Defined in: useLiveQueryEffect.ts:30

React hook for creating a reactive effect that fires handlers when rows enter, exit, or update within a query result.

The effect is created on mount and disposed on unmount. If deps change, the previous effect is disposed and a new one is created.

Type Parameters

TRow

TRow extends object = Record<string, unknown>

TKey

TKey extends string | number = string | number

Parameters

config

EffectConfig<TRow, TKey>

deps

DependencyList = []

Returns

void

Example

function ChatComponent() {
  useLiveQueryEffect(
    {
      query: (q) => q.from({ msg: messages }).where(({ msg }) => eq(msg.role, 'user')),
      skipInitial: true,
      onEnter: async (event) => {
        await generateResponse(event.value)
      },
    },
    []
  )

  return <div>...</div>
}