feat (core, react): refactor useChat to use MessageStore
#5770
Conversation
| @@ -0,0 +1,237 @@ | |||
| import { LanguageModelV2FinishReason } from '@ai-sdk/provider'; | |||
There was a problem hiding this comment.
TODO: TESTS
packages/react/src/use-chat.ts
Outdated
| @@ -8,17 +8,24 @@ import type { | |||
| UseChatOptions, | |||
There was a problem hiding this comment.
review packages/react/src/use-chat.ui.test.tsx to see if there are additional test cases to add
iteratetograceness
changed the title
useSyncExternalStore useChat to use MessageStore
| * Internal class for managing UIMessages | ||
| */ | ||
| export class MessagesStore { | ||
| chatId: string; |
There was a problem hiding this comment.
what would it take to make messages store multi-chat ready? i.e. being able to switch between chats with different ids? (we have many bugs in that area)
this might mean storing additional information such as state here (and potentially renaming to ChatStore)
There was a problem hiding this comment.
Would love to chat about this further next week!
| this.subscribers = new Set(); | ||
| this.notify = throttleMs | ||
| ? throttle(() => this.emit(), throttleMs) | ||
| : () => this.emit(); |
There was a problem hiding this comment.
how are emit, subscribers, and notify related?
There was a problem hiding this comment.
subscribers holds all the callbacks we call when we want to notify of changes! notify is a wrapper around the internal emit method that is throttled if throttleMs is passed in!
|
Direction is great - might be good to explore how this could look like as a more complete chat store, and also check if this will work with Svelte and Vue. |
packages/ai/core/util/chat-store.ts
Outdated
| import { throttle } from './throttle'; | ||
|
|
||
| interface ChatStoreSubscriber { | ||
| onChatMessagesChanged(): void; |
There was a problem hiding this comment.
should this be async or not?
Open questions:
Things to note:
Background
Summary
Tasks
pnpm prettier-fixto fix any formatting issuesFuture Work