useChatStore

useChatStore is the shared transcript and loading-state store.

It is the main store to use when you need to read history or add assistant messages programmatically.

What It Manages

• the current transcript as readonly Message[]
• the loading state
• message addition and replacement helpers
• transcript reset and cleanup helpers

Common Reads

Read Transcript History

import { useChatStore } from 'react-actions-chat';

const messages = useChatStore.getState().getMessages();
const latestMessage = useChatStore.getState().getPreviousMessage();

Useful methods:

• getMessages()
• getPreviousMessage()

Read the Latest User Submission

When building follow-up flows, you often want the most recent user-authored message:

const messages = useChatStore.getState().getMessages();

const lastSelfMessage = [...messages]
  .reverse()
  .find(message => message.type === 'self');

This pattern is used by the example apps when an assistant message needs to react to what the user just typed.

parts vs rawContent

Use rawContent when you need the actual submitted value.

That matters most for password flows:

• parts may contain masked visible text in the transcript
• rawContent still keeps the real submitted string

For ordinary text flows, rawContent usually matches the text shown by the first text part.

Read Message Metadata

Each stored Message includes:

• id
• parts
• timestamp
• type
• buttons

This is useful for analytics, debugging, or custom branching logic.

Common Writes

Useful methods:

• addMessage(message)
• addMessages(messages)
• setMessages(messages)
• clearMessages()
• clearButtons()
• clearPreviousMessageButtons()
• clearPreviousMessageCallback()

Loading State

The chat store also exposes loading state:

const { isLoading } = useChatStore.getState();

Useful methods:

• setLoading(true | false)
• clearLoading()

When isLoading is true, Chat renders a loading bubble at the bottom of the transcript.