Skip to main content

useSignalsAlerts

Loads a cursor-paginated feed of Signals episodes or raw alerts.

When to use it​

Episodes are the default. loadMore appends a page, hasMore signals another cursor, and note-change events refresh the feed.

Setup​

Call it from a client-side React component below OvokProvider so it uses the client configured at that provider boundary.

Hook arguments​

ArgumentTypeDetails
queryoptional for episodesTyped filters; set episodes to false for raw alerts. See both overloads in the API reference.

The grain defaults to episodes. Set episodes: false when the workflow targets an individual raw alert.

TypeScript signature​

(query: SignalsRawAlertsHookQuery): SignalsAlertsHookState<SignalsRawAlert>
(query?: SignalsAlertsHookQuery): SignalsAlertsHookState<SignalsAlert>

Feed state​

FieldMeaning
itemsAlerts loaded so far, in page order.
loadingWhether the first page or a later page is loading.
errorThe latest request error, if one occurred.
hasMoreWhether a next cursor is available.
loadMoreLoads and appends the next cursor page.
reloadReplaces the feed with a fresh first page.

Request behavior​

The hook loads when its required inputs are available and reloads when those inputs change. Use reload for an explicit refresh; render loading, error, and successful no-result states separately.

Example​

Handle the hook's loading and error states before rendering the result.

import { useSignalsAlerts } from '@ovok/core';

export function SignalsFeed() {
  const { items, loading, error, hasMore, loadMore, reload } = useSignalsAlerts();
  if (loading && items.length === 0) return <p>Loading alerts…</p>;
  if (error) return <p role="alert">{error.message}</p>;
  return <section>
    <button onClick={reload}>Refresh</button>
    <ul>{items.map(item => <li key={item.id}>{item.id}</li>)}</ul>
    {hasMore && <button disabled={loading} onClick={() => void loadMore()}>Load more</button>}
  </section>;
}

Set episodes: false to list raw alerts. The returned items then have the SignalsRawAlert type:

import { useSignalsAlerts } from '@ovok/core';

export function RawSignalsFeed() {
  const { items, loading, error, hasMore, loadMore } = useSignalsAlerts({ episodes: false });
  if (loading && items.length === 0) return <p>Loading raw alerts…</p>;
  if (error) return <p role="alert">{error.message}</p>;
  return <section>
    <ul>{items.map(alert => <li key={alert.id}>{alert.id}</li>)}</ul>
    {hasMore && <button disabled={loading} onClick={() => void loadMore()}>Load more raw alerts</button>}
  </section>;
}