Function useEmit

useEmit<K extends EventTopic>(topic: K): TopicEmitter<K>

Returns a stable function that emits a dashboard event topic.

The event is sent immediately. Ignore the lazy result for fire-and-forget delivery, await it inside useTransition to track a reply, or read it with React use to suspend. A reply that fails (NO_RESPONDER, TIMEOUT, ABORTED) rejects the result; when read with use that reaches the nearest error boundary, so pair the Suspense with one.

Type Parameters

K extends EventTopic

Parameters

topic: K

Returns TopicEmitter<K>

Example: Fire and forget

function ExpandPanel() {
  const setPanelMode = useEmit('panels.mode.set')
  return (
    <button onClick={() => setPanelMode({name: 'favorites', mode: 'full'})}>
      Expand
    </button>
  )
}

Example: Await a reply with Suspense

function Session({request}: {request: MessageBusEmitResult<string>}) {
  use(request)
  return <p>Ready</p>
}

function SessionAccordion() {
  const refreshToken = useEmit('auth.token.refresh')
  const [request, setRequest] = useState<MessageBusEmitResult<string> | null>(null)

  return (
    <details
      onToggle={(event) => setRequest(event.currentTarget.open ? refreshToken() : null)}
    >
      <summary>Session</summary>
      <ErrorBoundary fallback={<p>Could not refresh</p>}>
        <Suspense fallback={<p>Refreshing...</p>}>
          {request && <Session request={request} />}
        </Suspense>
      </ErrorBoundary>
    </details>
  )
}