feat: next-vercel-ai-sdk-v6-tool-calling update to v4

next-vercel-ai-sdk-v6-tool-calling/package.json

@@ -10,8 +10,8 @@
   },
   "dependencies": {
     "@ai-sdk/react": "^3.0.41",
-    "@browser-ai/transformers-js": "^2.0.0",
-    "@huggingface/transformers": "^3.8.1",
+    "@browser-ai/transformers-js": "^2.2.1",
+    "@huggingface/transformers": "^4.0.0",
     "@icons-pack/react-simple-icons": "^13.7.0",
     "@radix-ui/react-avatar": "^1.1.10",
     "@radix-ui/react-collapsible": "^1.1.12",

next-vercel-ai-sdk-v6-tool-calling/src/app/chat-transport.ts

@@ -16,6 +16,7 @@ import {
 } from "@browser-ai/transformers-js";
 import { useModelStore } from "../store/store";
 import { createTools } from "./tools/tools";
+import { MODELS } from "./models";
 
 /**
  * Client-side chat transport AI SDK implementation that handles AI model communication
@@ -45,6 +46,8 @@ export class TransformersChatTransport implements ChatTransport<TransformersUIMe
     const { messages, abortSignal } = options;
     const prompt = await convertToModelMessages(messages);
     const model = await this.getModel();
+    const selectedModelId = useModelStore.getState().selectedModel;
+    const modelConfig = MODELS.find((m) => m.id === selectedModelId);
 
     return createUIMessageStream<TransformersUIMessage>({
       execute: async ({ writer }) => {
@@ -53,55 +56,60 @@ export class TransformersChatTransport implements ChatTransport<TransformersUIMe
 
         // Only track progress if model needs downloading
         if (availability !== "available") {
-          await model.createSessionWithProgress(
-            (progress: { progress: number }) => {
-              const percent = Math.round(progress.progress * 100);
+          await model.createSessionWithProgress((progress) => {
+            const percent = Math.round(progress * 100);
 
-              if (progress.progress >= 1) {
-                if (downloadProgressId) {
-                  writer.write({
-                    type: "data-modelDownloadProgress",
-                    id: downloadProgressId,
-                    data: {
-                      status: "complete",
-                      progress: 100,
-                      message:
-                        "Model finished downloading! Getting ready for inference...",
-                    },
-                  });
-                }
-                return;
+            if (progress >= 1) {
+              if (downloadProgressId) {
+                writer.write({
+                  type: "data-modelDownloadProgress",
+                  id: downloadProgressId,
+                  data: {
+                    status: "complete",
+                    progress: 100,
+                    message:
+                      "Model finished downloading! Getting ready for inference...",
+                  },
+                });
               }
+              return;
+            }
 
-              if (!downloadProgressId) {
-                downloadProgressId = `download-${Date.now()}`;
-              }
+            if (!downloadProgressId) {
+              downloadProgressId = `download-${Date.now()}`;
+            }
 
-              writer.write({
-                type: "data-modelDownloadProgress",
-                id: downloadProgressId,
-                data: {
-                  status: "downloading",
-                  progress: percent,
-                  message: `Downloading browser AI model... ${percent}%`,
-                },
-                transient: !downloadProgressId,
-              });
-            },
-          );
+            writer.write({
+              type: "data-modelDownloadProgress",
+              id: downloadProgressId,
+              data: {
+                status: "downloading",
+                progress: percent,
+                message: `Downloading browser AI model... ${percent}%`,
+              },
+              transient: !downloadProgressId,
+            });
+          });
         }
 
         const result = streamText({
           model: wrapLanguageModel({
             model,
             middleware: extractReasoningMiddleware({
               tagName: "think",
+              startWithReasoning: modelConfig?.prependThinkTag ?? false,
             }),
           }),
-          tools: this.tools,
+          maxOutputTokens: 4092,
+          ...(modelConfig?.supportsTools ? { tools: this.tools } : {}),
           stopWhen: stepCountIs(5),
           messages: prompt,
           abortSignal,
+          providerOptions: {
+            "transformers-js": {
+              enableThinking: modelConfig?.enableThinking ?? false,
+            },
+          },
           onChunk: (event) => {
             if (event.chunk.type === "text-delta" && downloadProgressId) {
               writer.write({