Function: useChat()

useChat(chat): ChatSnapshot

Defined in: hooks/useChat.ts:72

Subscribes a component to one chat.

Parameters

chat

Chat

The chat to observe

Returns

ChatSnapshot

A snapshot recomputed on every relevant change

Remarks

Reads go through the store entity's reactive proxy, which tracks property access - so a component watching one chat does not re-render when another chat receives a message. Game time is observed too, so moving the clock expires typing indicators. In "realtime" clock mode flowing time mutates nothing and therefore triggers no re-render: drive the view with useGameTime(tickMs) or a deliverDueAll() interval if indicators have to expire on their own.

Rendering never materializes state: a chat nothing has written to yet reports its initial values.

Example

function ChatView({ chat }: { chat: Chat }) {
  const { entries, unread, pendingChoice, canReply } = useChat(chat);

  return (
    <>
      <ul>{entries.map((entry) => <li key={entry.key}>{entry.from}</li>)}</ul>
      {canReply && pendingChoice?.options.map((option) => (
        <button key={option.index} type="button" onClick={() => chat.choose(option.index)}>
          {option.content}
        </button>
      ))}
    </>
  );
}