@ai-sdk/react - npm Package Compare versions

Comparing version 4.0.58 to 4.0.59

dist/index.js

@@ -330,17 +330,58 @@ var __accessCheck = (obj, member, msg) => {
   }
+  const chat = chatRef.current;
+  const messagesSnapshotRef = useRef2({
+    chat,
+    messages: chat.messages
+  });
+  if (messagesSnapshotRef.current.chat !== chat) {
+    messagesSnapshotRef.current = { chat, messages: chat.messages };
+  }
   const subscribeToMessages = useCallback2(
-    (update) => chatRef.current["~registerMessagesCallback"](update, throttleWaitMs),
-    // `chatRef.current.id` is required to trigger re-subscription when the chat ID changes
-    // eslint-disable-next-line react-hooks/exhaustive-deps
-    [throttleWaitMs, chatRef.current.id]
+    (update) => {
+      let isSubscribed = true;
+      const updateMessages = () => {
+        if (!isSubscribed || messagesSnapshotRef.current.chat !== chat) {
+          return;
+        }
+        messagesSnapshotRef.current = { chat, messages: chat.messages };
+        update();
+      };
+      const unsubscribe = chat["~registerMessagesCallback"](
+        updateMessages,
+        throttleWaitMs
+      );
+      messagesSnapshotRef.current = { chat, messages: chat.messages };
+      return () => {
+        isSubscribed = false;
+        unsubscribe();
+      };
+    },
+    [chat, throttleWaitMs]
   );
+  const getMessagesSnapshot = useCallback2(
+    () => messagesSnapshotRef.current.messages,
+    []
+  );
   const messages = useSyncExternalStore(
     subscribeToMessages,
-    () => chatRef.current.messages,
-    () => chatRef.current.messages
+    getMessagesSnapshot,
+    getMessagesSnapshot
   );
+  const subscribeToStatus = useCallback2(
+    (update) => chat["~registerStatusCallback"](() => {
+      if (messagesSnapshotRef.current.chat !== chat) {
+        return;
+      }
+      if (chat.status === "ready" || chat.status === "error") {
+        messagesSnapshotRef.current = { chat, messages: chat.messages };
+      }
+      update();
+    }),
+    [chat]
+  );
+  const getStatusSnapshot = useCallback2(() => chat.status, [chat]);
   const status = useSyncExternalStore(
-    chatRef.current["~registerStatusCallback"],
-    () => chatRef.current.status,
-    () => chatRef.current.status
+    subscribeToStatus,
+    getStatusSnapshot,
+    getStatusSnapshot
   );
@@ -347,0 +388,0 @@ const error = useSyncExternalStore(

package.json

 {
   "name": "@ai-sdk/react",
-  "version": "4.0.58",
+  "version": "4.0.59",
   "type": "module",
@@ -34,3 +34,3 @@ "license": "Apache-2.0",
     "@ai-sdk/provider-utils": "5.0.23",
-    "ai": "7.0.55"
+    "ai": "7.0.56"
   },
@@ -37,0 +37,0 @@ "devDependencies": {

src/use-chat.ts

@@ -138,20 +138,77 @@ import {
 
+  const chat = chatRef.current;
+  const messagesSnapshotRef = useRef({
+    chat,
+    messages: chat.messages,
+  });
+
+  if (messagesSnapshotRef.current.chat !== chat) {
+    messagesSnapshotRef.current = { chat, messages: chat.messages };
+  }
+
   const subscribeToMessages = useCallback(
-    (update: () => void) =>
-      chatRef.current['~registerMessagesCallback'](update, throttleWaitMs),
-    // `chatRef.current.id` is required to trigger re-subscription when the chat ID changes
-    // eslint-disable-next-line react-hooks/exhaustive-deps
-    [throttleWaitMs, chatRef.current.id],
+    (update: () => void) => {
+      let isSubscribed = true;
+
+      const updateMessages = () => {
+        if (!isSubscribed || messagesSnapshotRef.current.chat !== chat) {
+          return;
+        }
+
+        messagesSnapshotRef.current = { chat, messages: chat.messages };
+        update();
+      };
+
+      const unsubscribe = chat['~registerMessagesCallback'](
+        updateMessages,
+        throttleWaitMs,
+      );
+
+      // Synchronize changes that may have happened between render and
+      // subscription. useSyncExternalStore checks the snapshot after
+      // subscribing and schedules a render when it changed.
+      messagesSnapshotRef.current = { chat, messages: chat.messages };
+
+      return () => {
+        isSubscribed = false;
+        unsubscribe();
+      };
+    },
+    [chat, throttleWaitMs],
   );
 
+  const getMessagesSnapshot = useCallback(
+    () => messagesSnapshotRef.current.messages,
+    [],
+  );
+
   const messages = useSyncExternalStore(
     subscribeToMessages,
-    () => chatRef.current.messages,
-    () => chatRef.current.messages,
+    getMessagesSnapshot,
+    getMessagesSnapshot,
   );
 
+  const subscribeToStatus = useCallback(
+    (update: () => void) =>
+      chat['~registerStatusCallback'](() => {
+        if (messagesSnapshotRef.current.chat !== chat) {
+          return;
+        }
+
+        if (chat.status === 'ready' || chat.status === 'error') {
+          // Publish the latest messages before the terminal status can render.
+          messagesSnapshotRef.current = { chat, messages: chat.messages };
+        }
+
+        update();
+      }),
+    [chat],
+  );
+
+  const getStatusSnapshot = useCallback(() => chat.status, [chat]);
+
   const status = useSyncExternalStore(
-    chatRef.current['~registerStatusCallback'],
-    () => chatRef.current.status,
-    () => chatRef.current.status,
+    subscribeToStatus,
+    getStatusSnapshot,
+    getStatusSnapshot,
   );
@@ -158,0 +215,0 @@

No alert changes

Improved metrics

Total package byte prevSize

303763

1.6%

Lines of code

3747

2.35%

Dependency changes

• + Added

  @ai-sdk/gateway@4.0.44
  (transitive)

• + Added

  ai@7.0.56
  (transitive)

• - Removed

  @ai-sdk/gateway@4.0.43
  (transitive)

• - Removed

  ai@7.0.55
  (transitive)

• Updated

  ai@7.0.56