diff --git a/.env.example b/.env.example
index d33a6400..0d3c7340 100644
--- a/.env.example
+++ b/.env.example
@@ -1,5 +1,6 @@
 # Application
 NEXT_PUBLIC_APP_URL=http://localhost:3000
+NEXT_PUBLIC_USE_NEW_CHAT=false
 
 # Better Auth (Authentication)
 BETTER_AUTH_SECRET=your-better-auth-secret
diff --git a/package.json b/package.json
index 92ea88fa..c4afca71 100644
--- a/package.json
+++ b/package.json
@@ -8,6 +8,7 @@
     "start": "next start",
     "lint": "oxlint",
     "lint:fix": "oxlint --fix",
+    "typecheck": "pnpm tc",
     "tc": "tsgo --noEmit",
     "tc:tsc": "tsc --noEmit",
     "clean": "rm -rf .next out dist",
@@ -32,6 +33,7 @@
   "dependencies": {
     "@ai-sdk/devtools": "^0.0.15",
     "@ai-sdk/google": "^3.0.62",
+    "@ai-sdk/react": "^3.0.170",
     "@assistant-ui/react": "^0.12.24",
     "@assistant-ui/react-ai-sdk": "^1.3.18",
     "@assistant-ui/react-devtools": "^1.0.5",
@@ -163,6 +165,7 @@
     "tailwind-merge": "^3.5.0",
     "tw-shimmer": "^0.4.9",
     "unicodeit": "^0.7.5",
+    "virtua": "^0.49.1",
     "workflow": "4.2.1",
     "zod": "^4.3.6",
     "zustand": "^5.0.11"
diff --git a/src/app/api/chat-v2/edit/route.ts b/src/app/api/chat-v2/edit/route.ts
new file mode 100644
index 00000000..34614acb
--- /dev/null
+++ b/src/app/api/chat-v2/edit/route.ts
@@ -0,0 +1,64 @@
+import { NextRequest, NextResponse } from "next/server";
+import { and, eq } from "drizzle-orm";
+import { withServerObservability } from "@/lib/with-server-observability";
+import { db } from "@/lib/db/client";
+import { chatMessages, chatThreads } from "@/lib/db/schema";
+import { requireAuth, verifyThreadOwnership, verifyWorkspaceAccess } from "@/lib/api/workspace-helpers";
+import type { UIMessage } from "ai";
+
+export const POST = withServerObservability(async function POST(req: NextRequest) {
+  try {
+    const userId = await requireAuth();
+    const body = await req.json().catch(() => ({})) as { threadId?: string; messageId?: string; text?: string };
+    if (!body.threadId || !body.messageId || typeof body.text !== "string") {
+      return NextResponse.json({ error: "threadId, messageId, and text are required" }, { status: 400 });
+    }
+
+    const [thread] = await db.select().from(chatThreads).where(eq(chatThreads.id, body.threadId)).limit(1);
+    if (!thread) return NextResponse.json({ error: "Thread not found" }, { status: 404 });
+    await verifyWorkspaceAccess(thread.workspaceId, userId);
+    verifyThreadOwnership(thread, userId);
+
+    const [stored] = await db.select().from(chatMessages).where(and(eq(chatMessages.threadId, body.threadId), eq(chatMessages.messageId, body.messageId))).limit(1);
+    if (!stored) return NextResponse.json({ error: "Message not found" }, { status: 404 });
+
+    const content = stored.content as UIMessage;
+    if (content.role !== "user") {
+      return NextResponse.json({ error: "Only user messages can be edited" }, { status: 400 });
+    }
+
+    const newMessageId = crypto.randomUUID();
+    const nextMessage: UIMessage = {
+      ...content,
+      id: newMessageId,
+      parts: (
+        content.parts.some((part) => part.type === "text")
+          ? content.parts.map((part) =>
+              part.type === "text"
+                ? { ...part, text: body.text }
+                : part,
+            )
+          : [...content.parts, { type: "text", text: body.text }]
+      ) as UIMessage["parts"],
+    };
+
+    await db.insert(chatMessages).values({
+      threadId: body.threadId,
+      messageId: newMessageId,
+      parentId: stored.parentId,
+      format: "ai-sdk/v6",
+      content: nextMessage,
+    });
+
+    await db.update(chatThreads).set({
+      headMessageId: newMessageId,
+      updatedAt: new Date().toISOString(),
+      lastMessageAt: new Date().toISOString(),
+    }).where(eq(chatThreads.id, body.threadId));
+
+    return NextResponse.json({ newMessageId });
+  } catch (error) {
+    if (error instanceof Response) return error;
+    return NextResponse.json({ error: "Internal server error" }, { status: 500 });
+  }
+}, { routeName: "POST /api/chat-v2/edit" });
diff --git a/src/app/api/chat-v2/route.ts b/src/app/api/chat-v2/route.ts
new file mode 100644
index 00000000..eb5ef659
--- /dev/null
+++ b/src/app/api/chat-v2/route.ts
@@ -0,0 +1,317 @@
+import {
+  convertToModelMessages,
+  createUIMessageStream,
+  createUIMessageStreamResponse,
+  pruneMessages,
+  safeValidateUIMessages,
+  smoothStream,
+  stepCountIs,
+  streamText,
+  wrapLanguageModel,
+  type UIMessage,
+} from "ai";
+import { devToolsMiddleware } from "@ai-sdk/devtools";
+import { withTracing } from "@posthog/ai";
+import { headers } from "next/headers";
+import { and, eq } from "drizzle-orm";
+import { auth } from "@/lib/auth";
+import { createChatTools } from "@/lib/ai/tools";
+import { getDefaultChatModelId, resolveGatewayModelId } from "@/lib/ai/models";
+import { normalizeLegacyToolMessages } from "@/lib/ai/legacy-tool-message-compat";
+import { maybeWithSupermemory } from "@/lib/ai/supermemory";
+import { buildGatewayProviderOptions, createGatewayLanguageModel, getGatewayAttributionHeaders } from "@/lib/ai/gateway-provider-options";
+import { capturePostHogServerException, getPostHogServerClient } from "@/lib/posthog-server";
+import { withServerObservability } from "@/lib/with-server-observability";
+import { db } from "@/lib/db/client";
+import { chatMessages, chatThreads } from "@/lib/db/schema";
+import { logger } from "@/lib/utils/logger";
+import type { ReplySelection } from "@/lib/stores/ui-store";
+import { verifyThreadOwnership, verifyWorkspaceAccess } from "@/lib/api/workspace-helpers";
+import { getNewFinishedMessages, resolveInitialParentId } from "@/lib/chat-v2/stream-persistence";
+
+function getSelectedCardsContext(body: Record<string, unknown>): string {
+  return typeof body.selectedCardsContext === "string" ? body.selectedCardsContext : "";
+}
+
+function injectSelectionContext(
+  messages: Awaited<ReturnType<typeof convertToModelMessages>>,
+  metadata?: { replySelections?: ReplySelection[] },
+  selectedCardsContext?: string,
+): void {
+  const parts: string[] = [];
+  if (selectedCardsContext?.trim()) {
+    parts.push(`[Selected cards context:\n${selectedCardsContext.trim()}]`);
+  }
+  if (metadata?.replySelections?.length) {
+    const quoted = metadata.replySelections
+      .map((selection) => selection.title ? `> From: ${selection.title}\n> ${selection.text}` : `> ${selection.text}`)
+      .join("\n\n");
+    parts.push(`[Referring to:\n${quoted}]`);
+  }
+  if (parts.length === 0) return;
+  const prefix = `${parts.join("\n")}\n\n`;
+
+  for (let index = messages.length - 1; index >= 0; index -= 1) {
+    const message = messages[index];
+    if (message.role !== "user") continue;
+    for (const part of message.content) {
+      if (typeof part !== "string" && part.type === "text") {
+        part.text = prefix + part.text;
+        return;
+      }
+    }
+  }
+}
+
+async function saveMessage({
+  threadId,
+  message,
+  parentId,
+}: {
+  threadId: string;
+  message: UIMessage;
+  parentId: string | null;
+}) {
+  await db.insert(chatMessages).values({
+    threadId,
+    messageId: message.id,
+    parentId,
+    format: "ai-sdk/v6",
+    content: message,
+  }).onConflictDoUpdate({
+    target: [chatMessages.threadId, chatMessages.messageId],
+    set: {
+      parentId,
+      format: "ai-sdk/v6",
+      content: message,
+    },
+  });
+}
+
+async function updateThreadHead(threadId: string, headMessageId: string | null) {
+  await db.update(chatThreads).set({
+    headMessageId,
+    lastMessageAt: new Date().toISOString(),
+    updatedAt: new Date().toISOString(),
+  }).where(eq(chatThreads.id, threadId));
+}
+
+async function handlePOST(req: Request) {
+  let workspaceId: string | null = null;
+  let userId: string | null = null;
+
+  try {
+    const [headersObj, body] = await Promise.all([headers(), req.json() as Promise<Record<string, unknown>>]);
+    const session = await auth.api.getSession({ headers: headersObj });
+    userId = session?.user?.id ?? null;
+
+    const threadId = typeof body.id === "string" ? body.id : null;
+    const trigger =
+      body.trigger === "regenerate-message"
+        ? "regenerate-message"
+        : "submit-message";
+    const regenerateMessageId =
+      typeof body.messageId === "string" ? body.messageId : null;
+    const activeFolderId = typeof body.activeFolderId === "string" ? body.activeFolderId : undefined;
+    const memoryEnabled = body.memoryEnabled === true;
+    const system = typeof body.system === "string" ? body.system : "";
+    const selectedCardsContext = getSelectedCardsContext(body);
+    const messages = Array.isArray(body.messages) ? (body.messages as UIMessage[]) : [];
+
+    if (!threadId) {
+      return new Response(JSON.stringify({ error: "Thread id is required" }), { status: 400, headers: { "Content-Type": "application/json" } });
+    }
+
+    const [thread] = await db.select().from(chatThreads).where(eq(chatThreads.id, threadId)).limit(1);
+    if (!thread) {
+      return new Response(JSON.stringify({ error: "Thread not found" }), { status: 404, headers: { "Content-Type": "application/json" } });
+    }
+    if (!userId) {
+      return new Response(JSON.stringify({ error: "Unauthorized" }), { status: 401, headers: { "Content-Type": "application/json" } });
+    }
+    await verifyWorkspaceAccess(thread.workspaceId, userId);
+    verifyThreadOwnership(thread, userId);
+    workspaceId = thread.workspaceId;
+
+    const tools = createChatTools({
+      workspaceId,
+      userId,
+      activeFolderId,
+      threadId,
+    });
+
+    const compatibleMessages = normalizeLegacyToolMessages(messages, {
+      availableToolNames: Object.keys(tools),
+    });
+    const validation = await safeValidateUIMessages({ messages: compatibleMessages, tools });
+    if (!validation.success) {
+      throw validation.error;
+    }
+
+    const validatedMessages = validation.data;
+    const lastMessage = validatedMessages.at(-1);
+    const previousMessageId = validatedMessages.at(-2)?.id ?? null;
+    if (trigger === "submit-message" && lastMessage?.role === "user") {
+      await saveMessage({ threadId, message: lastMessage, parentId: previousMessageId });
+      await updateThreadHead(threadId, lastMessage.id);
+    }
+
+    const initialParentId = await resolveInitialParentId({
+      trigger,
+      regenerateMessageId,
+      lastMessage,
+      getStoredMessageParentId: async (messageId) => {
+        const [siblingRow] = await db
+          .select({ parentId: chatMessages.parentId })
+          .from(chatMessages)
+          .where(and(eq(chatMessages.threadId, threadId), eq(chatMessages.messageId, messageId)))
+          .limit(1);
+        return siblingRow?.parentId ?? null;
+      },
+    });
+
+    let convertedMessages = await convertToModelMessages(validatedMessages, { tools });
+    convertedMessages = pruneMessages({
+      messages: convertedMessages,
+      reasoning: "before-last-message",
+      toolCalls: "before-last-5-messages",
+      emptyMessages: "remove",
+    });
+    const lastMetadata =
+      lastMessage?.metadata &&
+      typeof lastMessage.metadata === "object" &&
+      "replySelections" in lastMessage.metadata
+        ? (lastMessage.metadata as { replySelections?: ReplySelection[] })
+        : undefined;
+    injectSelectionContext(convertedMessages, lastMetadata, selectedCardsContext);
+
+    const modelId = resolveGatewayModelId(typeof body.modelId === "string" ? body.modelId : getDefaultChatModelId());
+    const posthogClient = getPostHogServerClient();
+    const baseGatewayModel = createGatewayLanguageModel(modelId);
+    const tracedModel = posthogClient
+      ? withTracing(baseGatewayModel, posthogClient, {
+          posthogDistinctId: userId || "anonymous",
+          posthogProperties: {
+            workspaceId,
+            activeFolderId,
+            modelId,
+            memoryEnabled,
+          },
+        })
+      : baseGatewayModel;
+
+    const memoryWrappedModel = maybeWithSupermemory(tracedModel, {
+      userId: userId ?? "",
+      threadId,
+      memoryEnabled,
+    });
+
+    const model = wrapLanguageModel({
+      model: memoryWrappedModel,
+      middleware: process.env.NODE_ENV === "development" ? devToolsMiddleware() : [],
+    });
+
+    const providerOptions = buildGatewayProviderOptions(modelId, { userId });
+
+    const result = streamText({
+      model,
+      temperature: 1,
+      system,
+      messages: convertedMessages,
+      stopWhen: stepCountIs(25),
+      tools,
+      providerOptions: providerOptions as Parameters<typeof streamText>[0]["providerOptions"],
+      headers: getGatewayAttributionHeaders(),
+      experimental_telemetry: {
+        isEnabled: true,
+        metadata: {
+          "tcc.conversational": "true",
+          ...(threadId ? { "tcc.sessionId": String(threadId) } : {}),
+          ...(userId ? { userId } : {}),
+        },
+      },
+      experimental_transform: smoothStream({ chunking: "word", delayInMs: 15 }),
+      onFinish: ({ usage, finishReason }) => {
+        logger.info("📊 [CHAT-V2] Final Token Usage:", {
+          inputTokens: usage?.inputTokens,
+          outputTokens: usage?.outputTokens,
+          totalTokens: usage?.totalTokens,
+          cachedInputTokens: usage?.cachedInputTokens,
+          reasoningTokens: usage?.reasoningTokens,
+          finishReason,
+        });
+      },
+    });
+
+    const stream = createUIMessageStream<UIMessage>({
+      originalMessages: validatedMessages,
+      execute: ({ writer }) => {
+        // TODO: emit data-chat-title here if chat-v2 gets a shared title-generation utility.
+        writer.merge(result.toUIMessageStream({
+          sendReasoning: true,
+          sendSources: true,
+        }));
+      },
+      onFinish: async ({ messages: finishedMessages }) => {
+        let parentId = initialParentId;
+        const newMessages = getNewFinishedMessages({
+          finishedMessages,
+          validatedMessages,
+        });
+        for (const message of newMessages) {
+          await saveMessage({ threadId, message, parentId });
+          parentId = message.id;
+        }
+        await updateThreadHead(threadId, parentId);
+      },
+    });
+
+    return createUIMessageStreamResponse({ stream });
+  } catch (error) {
+    if (error instanceof Response) {
+      return error;
+    }
+
+    const errorMessage = error instanceof Error ? error.message : String(error);
+    const isTimeout =
+      errorMessage.includes("timeout") ||
+      errorMessage.includes("TIMEOUT") ||
+      errorMessage.includes("Function execution exceeded") ||
+      errorMessage.includes("Execution timeout") ||
+      (error && typeof error === "object" && "code" in error && error.code === "TIMEOUT");
+
+    if (isTimeout) {
+      capturePostHogServerException(error, {
+        distinctId: userId ?? undefined,
+        properties: {
+          route_name: "POST /api/chat-v2",
+          workspaceId: workspaceId ?? undefined,
+          chat_error_kind: "timeout",
+        },
+      });
+      return new Response(JSON.stringify({
+        error: "Request timeout",
+        message: "The request took too long to process.",
+        code: "TIMEOUT",
+      }), { status: 504, headers: { "Content-Type": "application/json" } });
+    }
+
+    capturePostHogServerException(error, {
+      distinctId: userId ?? undefined,
+      properties: {
+        route_name: "POST /api/chat-v2",
+        workspaceId: workspaceId ?? undefined,
+        chat_error_kind: "internal",
+      },
+    });
+
+    return new Response(JSON.stringify({
+      error: "Internal server error",
+      message: "An unexpected error occurred while processing your request.",
+      details: process.env.NODE_ENV === "development" ? errorMessage : undefined,
+      code: "INTERNAL_ERROR",
+    }), { status: 500, headers: { "Content-Type": "application/json" } });
+  }
+}
+
+export const POST = withServerObservability(handlePOST, { routeName: "POST /api/chat-v2" });
diff --git a/src/app/api/threads/[id]/messages/[messageId]/branches/route.ts b/src/app/api/threads/[id]/messages/[messageId]/branches/route.ts
new file mode 100644
index 00000000..84888408
--- /dev/null
+++ b/src/app/api/threads/[id]/messages/[messageId]/branches/route.ts
@@ -0,0 +1,88 @@
+import { NextRequest, NextResponse } from "next/server";
+import { and, asc, eq, isNull } from "drizzle-orm";
+import { db } from "@/lib/db/client";
+import { chatMessages, chatThreads } from "@/lib/db/schema";
+import { requireAuth, verifyThreadOwnership, verifyWorkspaceAccess } from "@/lib/api/workspace-helpers";
+import { withServerObservability } from "@/lib/with-server-observability";
+
+async function getThreadAndMessage(threadId: string, messageId: string, userId: string) {
+  const [thread] = await db.select().from(chatThreads).where(eq(chatThreads.id, threadId)).limit(1);
+  if (!thread) throw NextResponse.json({ error: "Thread not found" }, { status: 404 });
+  await verifyWorkspaceAccess(thread.workspaceId, userId);
+  verifyThreadOwnership(thread, userId);
+
+  const [message] = await db.select().from(chatMessages).where(and(eq(chatMessages.threadId, threadId), eq(chatMessages.messageId, messageId))).limit(1);
+  if (!message) throw NextResponse.json({ error: "Message not found" }, { status: 404 });
+
+  return { thread, message };
+}
+
+async function findLeaf(threadId: string, messageId: string): Promise<string> {
+  let currentId = messageId;
+  while (true) {
+    const [child] = await db.select({ messageId: chatMessages.messageId }).from(chatMessages).where(and(eq(chatMessages.threadId, threadId), eq(chatMessages.parentId, currentId))).orderBy(asc(chatMessages.createdAt)).limit(1);
+    if (!child) return currentId;
+    currentId = child.messageId;
+  }
+}
+
+export const GET = withServerObservability(async function GET(_req: NextRequest, { params }: { params: Promise<{ id: string; messageId: string }> }) {
+  try {
+    const userId = await requireAuth();
+    const { id, messageId } = await params;
+    const { message } = await getThreadAndMessage(id, messageId, userId);
+    const siblings = await db
+      .select({ id: chatMessages.messageId, parentId: chatMessages.parentId, createdAt: chatMessages.createdAt })
+      .from(chatMessages)
+      .where(
+        and(
+          eq(chatMessages.threadId, id),
+          message.parentId == null
+            ? isNull(chatMessages.parentId)
+            : eq(chatMessages.parentId, message.parentId),
+        ),
+      )
+      .orderBy(asc(chatMessages.createdAt));
+    return NextResponse.json({
+      siblings,
+      currentIndex: siblings.findIndex((candidate) => candidate.id === messageId),
+    });
+  } catch (error) {
+    if (error instanceof Response) return error;
+    return NextResponse.json({ error: "Internal server error" }, { status: 500 });
+  }
+}, { routeName: "GET /api/threads/[id]/messages/[messageId]/branches" });
+
+export const POST = withServerObservability(async function POST(req: NextRequest, { params }: { params: Promise<{ id: string; messageId: string }> }) {
+  try {
+    const userId = await requireAuth();
+    const { id, messageId } = await params;
+    const body = await req.json().catch(() => ({})) as { targetBranchId?: string };
+    if (!body.targetBranchId) {
+      return NextResponse.json({ error: "targetBranchId is required" }, { status: 400 });
+    }
+
+    const { message } = await getThreadAndMessage(id, messageId, userId);
+    const [target] = await db
+      .select()
+      .from(chatMessages)
+      .where(and(eq(chatMessages.threadId, id), eq(chatMessages.messageId, body.targetBranchId)))
+      .limit(1);
+    if (!target) {
+      return NextResponse.json({ error: "Target branch not found" }, { status: 404 });
+    }
+    if (target.parentId !== message.parentId) {
+      return NextResponse.json(
+        { error: "Target is not a sibling of the anchor message" },
+        { status: 400 },
+      );
+    }
+
+    const leafId = await findLeaf(id, body.targetBranchId);
+    await db.update(chatThreads).set({ headMessageId: leafId, updatedAt: new Date().toISOString() }).where(eq(chatThreads.id, id));
+    return NextResponse.json({ headMessageId: leafId });
+  } catch (error) {
+    if (error instanceof Response) return error;
+    return NextResponse.json({ error: "Internal server error" }, { status: 500 });
+  }
+}, { routeName: "POST /api/threads/[id]/messages/[messageId]/branches" });
diff --git a/src/app/api/threads/[id]/messages/route.ts b/src/app/api/threads/[id]/messages/route.ts
index cf9a2113..83cb5dad 100644
--- a/src/app/api/threads/[id]/messages/route.ts
+++ b/src/app/api/threads/[id]/messages/route.ts
@@ -6,7 +6,7 @@ import {
   verifyWorkspaceAccess,
   verifyThreadOwnership,
 } from "@/lib/api/workspace-helpers";
-import { eq, and, desc } from "drizzle-orm";
+import { eq, and } from "drizzle-orm";
 import { withServerObservability } from "@/lib/with-server-observability";
 
 async function getThreadAndVerify(id: string, userId: string) {
@@ -45,16 +45,41 @@ export const GET = withServerObservability(async function GET(
     const rows = await db
       .select()
       .from(chatMessages)
-      .where(and(eq(chatMessages.threadId, id), eq(chatMessages.format, format)))
-      .orderBy(desc(chatMessages.createdAt));
-
-    const messages = rows.map((r) => ({
-        id: r.messageId,
-        parent_id: r.parentId,
-        format: r.format,
-        content: r.content,
-        created_at: r.createdAt,
-      }));
+      .where(and(eq(chatMessages.threadId, id), eq(chatMessages.format, format)));
+
+    const byId = new Map(rows.map((row) => [row.messageId, row]));
+    const ordered: typeof rows = [];
+
+    if (thread.headMessageId) {
+      let cursor: string | null = thread.headMessageId;
+      const seen = new Set<string>();
+
+      while (cursor && !seen.has(cursor)) {
+        seen.add(cursor);
+        const row = byId.get(cursor);
+        if (!row) break;
+        ordered.push(row);
+        cursor = row.parentId;
+      }
+
+      ordered.reverse();
+    } else {
+      ordered.push(
+        ...rows.sort((a, b) => {
+          const at = a.createdAt ? new Date(a.createdAt).getTime() : 0;
+          const bt = b.createdAt ? new Date(b.createdAt).getTime() : 0;
+          return at - bt;
+        }),
+      );
+    }
+
+    const messages = ordered.map((r) => ({
+      id: r.messageId,
+      parent_id: r.parentId,
+      format: r.format,
+      content: r.content,
+      created_at: r.createdAt,
+    }));
 
     return NextResponse.json({
       messages,
diff --git a/src/components/assistant-ui/AssistantPanel.tsx b/src/components/assistant-ui/AssistantPanel.tsx
index deacaf6d..434bed2e 100644
--- a/src/components/assistant-ui/AssistantPanel.tsx
+++ b/src/components/assistant-ui/AssistantPanel.tsx
@@ -9,6 +9,8 @@ import AppChatHeader from "@/components/chat/AppChatHeader";
 import { cn } from "@/lib/utils";
 import AssistantTextSelectionManager from "@/components/assistant-ui/AssistantTextSelectionManager";
 import { useEffect } from "react";
+import { USE_NEW_CHAT } from "@/lib/chat-v2/feature-flag";
+import { ChatV2Panel } from "@/components/chat-v2/ChatV2Panel";
 
 interface AssistantPanelProps {
   workspaceId?: string | null;
@@ -108,9 +110,22 @@ function WorkspaceContextWrapperContent({
   // Workspace name comes from canonical workspace metadata.
   const { currentWorkspace } = useWorkspaceContext();
 
-  // Inject minimal workspace context (metadata and system instructions only)
-  // Cards register their own context individually
-  useWorkspaceContextProvider(workspaceId || null, state, currentWorkspace?.name);
+  if (!USE_NEW_CHAT) {
+    useWorkspaceContextProvider(workspaceId || null, state, currentWorkspace?.name);
+  }
+
+  if (USE_NEW_CHAT) {
+    return (
+      <ChatV2Panel
+        workspaceId={workspaceId || ""}
+        items={items}
+        setIsChatExpanded={setIsChatExpanded}
+        isChatMaximized={isChatMaximized}
+        setIsChatMaximized={setIsChatMaximized}
+        onReady={onReady}
+      />
+    );
+  }
 
 
 
diff --git a/src/components/assistant-ui/WorkspaceRuntimeProvider.tsx b/src/components/assistant-ui/WorkspaceRuntimeProvider.tsx
index dbaffa5b..45ea007e 100644
--- a/src/components/assistant-ui/WorkspaceRuntimeProvider.tsx
+++ b/src/components/assistant-ui/WorkspaceRuntimeProvider.tsx
@@ -24,43 +24,17 @@ import { chatToolToolkit } from "@/components/assistant-ui/chat-toolkit";
 
 interface WorkspaceRuntimeProviderProps {
   workspaceId: string;
+  disableChatRuntime?: boolean;
   children: React.ReactNode;
 }
 
-function createWorkspaceChatRuntimeHook(
-  transport: AssistantChatTransport<UIMessage>,
-  onError: (error: Error) => void,
-) {
-  return function useWorkspaceChatRuntimeHook() {
-    return useChatRuntime({
-      transport,
-      onError,
-      toCreateMessage: toCreateMessageWithContext,
-    });
-  };
-}
-
-/**
- * Bridges the outer RemoteThreadListRuntime's initialize() into a ref
- * so the transport's prepareSendMessagesRequest can eagerly resolve the
- * real thread remoteId before each chat request.
- *
- * Workaround for https://github.com/assistant-ui/assistant-ui/issues/3578
- */
-function ThreadInitBridge({
-  initRef,
-}: {
-  initRef: React.MutableRefObject<(() => Promise<{ remoteId: string }>) | null>;
-}) {
-  const aui = useAui();
-  initRef.current = () => aui.threadListItem().initialize();
-  return null;
-}
-
-export function WorkspaceRuntimeProvider({
+function WorkspaceRuntimeWithChatRuntime({
   workspaceId,
   children,
-}: WorkspaceRuntimeProviderProps) {
+}: {
+  workspaceId: string;
+  children: React.ReactNode;
+}) {
   const selectedModelId = useUIStore((state) => state.selectedModelId);
   const memoryEnabled = useUIStore((state) => state.memoryEnabled);
   const activeFolderId = useUIStore((state) => state.activeFolderId);
@@ -71,7 +45,6 @@ export function WorkspaceRuntimeProvider({
   const { state: workspaceState } = useWorkspaceState(workspaceId);
   const viewingItemIds = useViewingItemIds();
 
-  /** Union of selected cards and items open in the workspace viewer (primary and/or secondary). */
   const contextCardIds = useMemo(() => {
     const ids = new Set<string>(selectedCardIdsSet);
     viewingItemIds.forEach((id) => ids.add(id));
@@ -99,13 +72,6 @@ export function WorkspaceRuntimeProvider({
     );
   }, [workspaceState, contextCardIds, activePdfPageByItemId, viewingItemIds]);
 
-  // Per AI SDK, transport `body` is `Resolvable<object>` — if it is a function, `resolve()`
-  // calls it on every sendMessages (see @ai-sdk/provider-utils resolve()). That gives
-  // fresh metadata without recreating AssistantChatTransport (which would change the
-  // transport passed into useChatRuntime and stress useRemoteThreadListRuntime).
-  // @assistant-ui/react-ai-sdk also wraps the transport in useDynamicChatTransport (Proxy
-  // + ref) so the chat layer can follow transport updates; keeping one transport instance
-  // is still the least surprising option for our custom runtimeHook wrapper.
   const chatApiPayloadRef = useRef({
     workspaceId,
     modelId: selectedModelId,
@@ -125,7 +91,6 @@ export function WorkspaceRuntimeProvider({
   const handleChatError = useCallback((error: Error) => {
     console.error("[Chat Error]", error);
 
-    // Extract error message from various sources (error.message, responseBody, data, etc.)
     const errorMessage = error.message?.toLowerCase() || "";
     const responseBody = (error as any).responseBody?.toLowerCase() || "";
     const errorData = (error as any).data?.error?.message?.toLowerCase() || "";
@@ -184,7 +149,6 @@ export function WorkspaceRuntimeProvider({
           "Please check your GOOGLE_GENERATIVE_AI_API_KEY in your environment variables.",
       });
     } else {
-      // Generic error fallback
       toast.error("Something went wrong", {
         description:
           error.message || "An unexpected error occurred. Please try again.",
@@ -231,8 +195,6 @@ export function WorkspaceRuntimeProvider({
           };
         },
       }),
-    // Body snapshot comes from the ref via Resolvable function above.
-    // eslint-disable-next-line react-hooks/exhaustive-deps -- stable transport instance
     [],
   );
 
@@ -257,3 +219,50 @@ export function WorkspaceRuntimeProvider({
     </AssistantRuntimeProvider>
   );
 }
+
+function createWorkspaceChatRuntimeHook(
+  transport: AssistantChatTransport<UIMessage>,
+  onError: (error: Error) => void,
+) {
+  return function useWorkspaceChatRuntimeHook() {
+    return useChatRuntime({
+      transport,
+      onError,
+      toCreateMessage: toCreateMessageWithContext,
+    });
+  };
+}
+
+/**
+ * Bridges the outer RemoteThreadListRuntime's initialize() into a ref
+ * so the transport's prepareSendMessagesRequest can eagerly resolve the
+ * real thread remoteId before each chat request.
+ *
+ * Workaround for https://github.com/assistant-ui/assistant-ui/issues/3578
+ */
+function ThreadInitBridge({
+  initRef,
+}: {
+  initRef: React.MutableRefObject<(() => Promise<{ remoteId: string }>) | null>;
+}) {
+  const aui = useAui();
+  initRef.current = () => aui.threadListItem().initialize();
+  return null;
+}
+
+export function WorkspaceRuntimeProvider({
+  workspaceId,
+  disableChatRuntime = false,
+  children,
+}: WorkspaceRuntimeProviderProps) {
+  if (disableChatRuntime) {
+    // Keep assistant availability context for the dashboard, but skip assistant-ui's thread/runtime wiring when chat-v2 is enabled.
+    return <AssistantAvailableProvider>{children}</AssistantAvailableProvider>;
+  }
+
+  return (
+    <WorkspaceRuntimeWithChatRuntime workspaceId={workspaceId}>
+      {children}
+    </WorkspaceRuntimeWithChatRuntime>
+  );
+}
diff --git a/src/components/chat-v2/AssistantActionBar.tsx b/src/components/chat-v2/AssistantActionBar.tsx
new file mode 100644
index 00000000..48d70da6
--- /dev/null
+++ b/src/components/chat-v2/AssistantActionBar.tsx
@@ -0,0 +1,35 @@
+"use client";
+
+import { CheckIcon, CopyIcon, RefreshCwIcon } from "lucide-react";
+import { useEffect, useState } from "react";
+import { Button } from "@/components/ui/button";
+
+interface AssistantActionBarProps {
+  textContent: string;
+  onRefresh: () => void;
+}
+
+export function AssistantActionBar({ textContent, onRefresh }: AssistantActionBarProps) {
+  const [copied, setCopied] = useState(false);
+
+  useEffect(() => {
+    if (!copied) return;
+    const timeout = window.setTimeout(() => setCopied(false), 2000);
+    return () => window.clearTimeout(timeout);
+  }, [copied]);
+
+  return (
+    <div className="flex gap-0.5 text-muted-foreground">
+      <Button variant="ghost" size="icon" className="size-6 p-1" onClick={() => {
+        if (!textContent) return;
+        void navigator.clipboard.writeText(textContent);
+        setCopied(true);
+      }}>
+        {copied ? <CheckIcon className="size-4" /> : <CopyIcon className="size-4" />}
+      </Button>
+      <Button variant="ghost" size="icon" className="size-6 p-1" onClick={onRefresh}>
+        <RefreshCwIcon className="size-4" />
+      </Button>
+    </div>
+  );
+}
diff --git a/src/components/chat-v2/AssistantMessage.tsx b/src/components/chat-v2/AssistantMessage.tsx
new file mode 100644
index 00000000..79d9d036
--- /dev/null
+++ b/src/components/chat-v2/AssistantMessage.tsx
@@ -0,0 +1,70 @@
+"use client";
+
+import { Loader2 } from "lucide-react";
+import { useMemo } from "react";
+import { AssistantActionBar } from "./AssistantActionBar";
+import { BranchNav } from "./BranchNav";
+import { TextPart } from "./parts/TextPart";
+import { ToolGroup } from "./parts/ToolGroup";
+import { ReasoningPart } from "./parts/ReasoningPart";
+import { groupParts } from "./parts/group-parts";
+import type { ChatMessage } from "@/lib/chat-v2/types";
+
+interface AssistantMessageProps {
+  threadId?: string | null;
+  message: ChatMessage;
+  isStreaming: boolean;
+  blankSize?: number;
+  onRefresh: (messageId: string) => void;
+  onReloadThread: () => Promise<void>;
+}
+
+export function AssistantMessage({ threadId, message, isStreaming, blankSize, onRefresh, onReloadThread }: AssistantMessageProps) {
+  const grouped = useMemo(() => groupParts(message.parts), [message.parts]);
+  const textContent = useMemo(
+    () => message.parts.filter((part) => part.type === "text").map((part) => part.text).join("\n\n"),
+    [message.parts],
+  );
+
+  return (
+    <div className="chat-v2-assistant-message relative mx-auto w-full max-w-[50rem] pb-4 last:mb-4" data-role="assistant">
+      <div className="chat-v2-assistant-message-content mx-2 leading-7 break-words text-foreground" style={blankSize ? { minHeight: blankSize } : undefined}>
+        {isStreaming && message.parts.length === 0 ? <Loader2 className="size-4 animate-spin text-muted-foreground" /> : null}
+        {grouped.map((segment, index) => {
+          if (segment.kind === "reasoning") {
+            return (
+              <ReasoningPart
+                key={`${message.id}-reasoning-${index}`}
+                parts={segment.parts}
+                isStreaming={isStreaming && grouped.at(-1) === segment}
+                threadId={threadId}
+                messageId={message.id}
+              />
+            );
+          }
+          if (segment.kind === "tools") {
+            return <ToolGroup key={`${message.id}-tools-${index}`} parts={segment.parts} isStreaming={isStreaming && grouped.at(-1) === segment} />;
+          }
+          if (segment.part.type === "text") {
+            return <TextPart key={`${message.id}-text-${index}`} text={segment.part.text} isStreaming={isStreaming && index === grouped.length - 1} threadId={threadId} messageId={message.id} />;
+          }
+          if (segment.part.type === "file") {
+            return <a key={`${message.id}-file-${index}`} href={segment.part.url} target="_blank" rel="noreferrer" className="mt-2 flex text-sm text-primary underline-offset-4 hover:underline">{segment.part.filename ?? segment.part.url}</a>;
+          }
+          if (segment.part.type === "source-url") {
+            return <a key={`${message.id}-source-${index}`} href={segment.part.url} target="_blank" rel="noreferrer" className="mt-2 flex text-xs text-muted-foreground underline-offset-4 hover:underline">{segment.part.title ?? segment.part.url}</a>;
+          }
+          if (segment.part.type === "source-document") {
+            return <div key={`${message.id}-document-${index}`} className="mt-2 text-xs text-muted-foreground">{segment.part.title}</div>;
+          }
+          return null;
+        })}
+      </div>
+
+      <div className="mt-2 ml-2 flex items-center gap-2">
+        <BranchNav threadId={threadId} messageId={message.id} />
+        <AssistantActionBar textContent={textContent} onRefresh={() => onRefresh(message.id)} />
+      </div>
+    </div>
+  );
+}
diff --git a/src/components/chat-v2/BranchNav.tsx b/src/components/chat-v2/BranchNav.tsx
new file mode 100644
index 00000000..b87d5550
--- /dev/null
+++ b/src/components/chat-v2/BranchNav.tsx
@@ -0,0 +1,77 @@
+"use client";
+
+import { ChevronLeftIcon, ChevronRightIcon } from "lucide-react";
+import { useEffect, useState } from "react";
+import { Button } from "@/components/ui/button";
+import { fetchBranches, switchBranch } from "@/lib/chat-v2/branches";
+import { useChatRuntime } from "@/lib/chat-v2/use-chat-runtime";
+
+interface BranchNavProps {
+  threadId?: string | null;
+  messageId: string;
+  className?: string;
+}
+
+export function BranchNav({ threadId, messageId, className }: BranchNavProps) {
+  const [count, setCount] = useState(0);
+  const [currentIndex, setCurrentIndex] = useState(0);
+  const [siblings, setSiblings] = useState<Array<{ id: string }>>([]);
+  const [loading, setLoading] = useState(false);
+  const { status, stop, refreshMessagesIfSafe } = useChatRuntime();
+  const isBusy = status === "streaming" || status === "submitted";
+
+  useEffect(() => {
+    if (!threadId) return;
+    let cancelled = false;
+    void (async () => {
+      try {
+        const data = await fetchBranches(threadId, messageId);
+        if (cancelled) return;
+        setSiblings(data.siblings);
+        setCount(data.siblings.length);
+        setCurrentIndex(data.currentIndex);
+      } catch {
+        if (!cancelled) {
+          setSiblings([]);
+          setCount(0);
+          setCurrentIndex(0);
+        }
+      }
+    })();
+
+    return () => {
+      cancelled = true;
+    };
+  }, [messageId, threadId]);
+
+  if (!threadId || count <= 1) return null;
+
+  const handleSwitch = async (delta: -1 | 1) => {
+    const nextIndex = (currentIndex + delta + siblings.length) % siblings.length;
+    const target = siblings[nextIndex];
+    if (!target) return;
+    setLoading(true);
+    try {
+      if (isBusy) {
+        await stop();
+      }
+      await switchBranch(threadId, messageId, target.id);
+      await refreshMessagesIfSafe();
+      setCurrentIndex(nextIndex);
+    } finally {
+      setLoading(false);
+    }
+  };
+
+  return (
+    <div className={className ?? "inline-flex items-center text-xs text-muted-foreground"}>
+      <Button variant="ghost" size="icon" className="size-6 p-1" disabled={isBusy || loading} onClick={() => void handleSwitch(-1)}>
+        <ChevronLeftIcon className="size-4" />
+      </Button>
+      <span className="font-medium">{currentIndex + 1} / {count}</span>
+      <Button variant="ghost" size="icon" className="size-6 p-1" disabled={isBusy || loading} onClick={() => void handleSwitch(1)}>
+        <ChevronRightIcon className="size-4" />
+      </Button>
+    </div>
+  );
+}
diff --git a/src/components/chat-v2/ChatHeader.tsx b/src/components/chat-v2/ChatHeader.tsx
new file mode 100644
index 00000000..d9b9a790
--- /dev/null
+++ b/src/components/chat-v2/ChatHeader.tsx
@@ -0,0 +1,99 @@
+"use client";
+
+import { ChevronDown, Check, Edit2, X } from "lucide-react";
+import { LuMaximize2, LuMinimize2, LuPanelRightClose } from "react-icons/lu";
+import { useEffect, useMemo, useState } from "react";
+import { toast } from "sonner";
+import { Button } from "@/components/ui/button";
+import { Textarea } from "@/components/ui/textarea";
+import { ThreadListDropdown } from "./ThreadListDropdown";
+
+interface ChatHeaderProps {
+  workspaceId: string;
+  threadId?: string | null;
+  onSelectThread: (threadId: string | null) => void;
+  onCollapse?: () => void;
+  isMaximized?: boolean;
+  onToggleMaximize?: () => void;
+}
+
+export function ChatHeader({ workspaceId, threadId, onSelectThread, onCollapse, isMaximized, onToggleMaximize }: ChatHeaderProps) {
+  const [threadTitle, setThreadTitle] = useState("New Chat");
+  const [editing, setEditing] = useState(false);
+  const [draft, setDraft] = useState("New Chat");
+
+  useEffect(() => {
+    if (!threadId) {
+      setThreadTitle("New Chat");
+      setDraft("New Chat");
+      return;
+    }
+
+    let cancelled = false;
+
+    void (async () => {
+      try {
+        const response = await fetch(`/api/threads/${threadId}`, { cache: "no-store" });
+        if (!response.ok || cancelled) return;
+        const data = (await response.json()) as { title?: string };
+        if (cancelled) return;
+        setThreadTitle(data.title ?? "New Chat");
+        setDraft(data.title ?? "New Chat");
+      } catch {
+        return;
+      }
+    })();
+
+    return () => {
+      cancelled = true;
+    };
+  }, [threadId]);
+
+  const title = useMemo(() => threadTitle || "New Chat", [threadTitle]);
+
+  const save = async () => {
+    if (!threadId) return;
+    const nextTitle = draft.trim() || "New Chat";
+    const response = await fetch(`/api/threads/${threadId}`, {
+      method: "PATCH",
+      headers: { "Content-Type": "application/json" },
+      body: JSON.stringify({ title: nextTitle }),
+    });
+    if (!response.ok) {
+      toast.error("Failed to rename chat");
+      return;
+    }
+    setThreadTitle(nextTitle);
+    setEditing(false);
+  };
+
+  return (
+    <div className="flex items-center justify-between border-b border-sidebar-border px-3 py-2">
+      <div className="flex min-w-0 items-center gap-2">
+        <ThreadListDropdown
+          workspaceId={workspaceId}
+          activeThreadId={threadId}
+          onSelectThread={onSelectThread}
+          trigger={<Button variant="ghost" size="sm" className="gap-1"><span className="truncate">{title}</span><ChevronDown className="size-4" /></Button>}
+        />
+        {editing ? (
+          <div className="flex items-center gap-1">
+            <Textarea value={draft} onChange={(event) => setDraft(event.target.value)} className="min-h-8 w-56 resize-none py-1" rows={1} />
+            <Button variant="ghost" size="icon" className="size-7" onClick={() => void save()}><Check className="size-4" /></Button>
+            <Button variant="ghost" size="icon" className="size-7" onClick={() => { setEditing(false); setDraft(threadTitle); }}><X className="size-4" /></Button>
+          </div>
+        ) : threadId ? (
+          <Button variant="ghost" size="icon" className="size-7" onClick={() => setEditing(true)}><Edit2 className="size-4" /></Button>
+        ) : null}
+      </div>
+      <div className="flex items-center gap-1">
+        <Button variant="ghost" size="icon" className="size-8" onClick={onToggleMaximize}>
+          {isMaximized ? <LuMinimize2 className="size-4" /> : <LuMaximize2 className="size-4" />}
+        </Button>
+        <Button variant="ghost" size="icon" className="size-8" onClick={onCollapse}>
+          <LuPanelRightClose className="size-4" />
+        </Button>
+      </div>
+    </div>
+  );
+}
diff --git a/src/components/chat-v2/ChatV2Panel.tsx b/src/components/chat-v2/ChatV2Panel.tsx
new file mode 100644
index 00000000..1bdbc878
--- /dev/null
+++ b/src/components/chat-v2/ChatV2Panel.tsx
@@ -0,0 +1,93 @@
+"use client";
+
+import { AssistantAvailableProvider } from "@/contexts/AssistantAvailabilityContext";
+import { useSearchParams } from "next/navigation";
+import { useEffect, useRef, useState } from "react";
+import { cn } from "@/lib/utils";
+import type { Item } from "@/lib/workspace-state/types";
+import { DataStreamProvider } from "@/lib/chat-v2/data-stream-provider";
+import { ChatRuntimeProvider, useChatRuntime } from "@/lib/chat-v2/use-chat-runtime";
+import { ChatHeader } from "./ChatHeader";
+import { MessageList } from "./MessageList";
+import { Composer } from "./Composer";
+import { TextSelectionManager } from "./TextSelectionManager";
+
+interface ChatV2PanelProps {
+  workspaceId: string;
+  items: Item[];
+  setIsChatExpanded?: (expanded: boolean) => void;
+  isChatMaximized?: boolean;
+  setIsChatMaximized?: (maximized: boolean) => void;
+  onReady?: () => void;
+}
+
+function ChatV2PanelContent({ workspaceId, setIsChatExpanded, isChatMaximized, setIsChatMaximized }: Omit<ChatV2PanelProps, "items" | "onReady">) {
+  const { threadId, setThreadId, messages, status, isLoading, refreshMessagesIfSafe, regenerate, focusComposer } = useChatRuntime();
+
+  return (
+    <div className={cn("flex h-full flex-col bg-sidebar", isChatMaximized && "shadow-2xl")} data-tour="chat-panel">
+      <ChatHeader
+        workspaceId={workspaceId}
+        threadId={threadId}
+        onSelectThread={setThreadId}
+        onCollapse={() => {
+          if (isChatMaximized) setIsChatMaximized?.(false);
+          setIsChatExpanded?.(false);
+        }}
+        isMaximized={isChatMaximized}
+        onToggleMaximize={() => setIsChatMaximized?.(!isChatMaximized)}
+      />
+      <MessageList
+        threadId={threadId}
+        messages={messages}
+        status={status}
+        isLoading={isLoading}
+        onReloadThread={refreshMessagesIfSafe}
+        onRegenerate={(messageId) => regenerate({ messageId })}
+      />
+      <div className="mx-auto flex w-full max-w-[50rem] flex-shrink-0 flex-col gap-4 px-4 pb-3 md:pb-4">
+        <Composer />
+      </div>
+      <TextSelectionManager className="absolute inset-0 pointer-events-none" currentThreadId={threadId} onFocusComposer={focusComposer} />
+    </div>
+  );
+}
+
+export function ChatV2Panel({ workspaceId, items, onReady, ...rest }: ChatV2PanelProps) {
+  const searchParams = useSearchParams();
+  const urlThreadId = searchParams.get("thread");
+  const [providerThreadId, setProviderThreadId] = useState<string | null>(urlThreadId);
+  const persistedThreadIdRef = useRef<string | null>(null);
+  const providerKey = providerThreadId ?? "new";
+
+  useEffect(() => {
+    if (urlThreadId === persistedThreadIdRef.current) {
+      persistedThreadIdRef.current = null;
+      return;
+    }
+    if (urlThreadId !== providerThreadId) {
+      setProviderThreadId(urlThreadId);
+    }
+  }, [providerThreadId, urlThreadId]);
+
+  return (
+    <AssistantAvailableProvider>
+      <DataStreamProvider key={providerKey}>
+        {/* Remount on explicit thread switches like route-driven chat UIs, but keep new-chat streams alive when the server persists a thread id. */}
+        <ChatRuntimeProvider
+          key={providerKey}
+          workspaceId={workspaceId}
+          items={items}
+          initialThreadId={providerThreadId}
+          onThreadSelectionChange={setProviderThreadId}
+          onThreadResolved={(threadId) => {
+            persistedThreadIdRef.current = threadId;
+          }}
+          onReady={onReady}
+        >
+          <ChatV2PanelContent workspaceId={workspaceId} {...rest} />
+        </ChatRuntimeProvider>
+      </DataStreamProvider>
+    </AssistantAvailableProvider>
+  );
+}
diff --git a/src/components/chat-v2/Composer.tsx b/src/components/chat-v2/Composer.tsx
new file mode 100644
index 00000000..99071bcb
--- /dev/null
+++ b/src/components/chat-v2/Composer.tsx
@@ -0,0 +1,200 @@
+"use client";
+
+import { CheckCircle2, X } from "lucide-react";
+import { useCallback } from "react";
+import { toast } from "sonner";
+import { CardContextDisplay } from "@/components/chat/CardContextDisplay";
+import { ReplyContextDisplay } from "@/components/chat/ReplyContextDisplay";
+import { MentionMenu } from "@/components/chat/MentionMenu";
+import { useSelectedCardIds } from "@/hooks/ui/use-selected-card-ids";
+import { useUIStore } from "@/lib/stores/ui-store";
+import { useAttachmentUploadStore } from "@/lib/stores/attachment-upload-store";
+import { uploadFileDirect } from "@/lib/uploads/client-upload";
+import { filterPasswordProtectedPdfs } from "@/lib/uploads/pdf-validation";
+import { emitPasswordProtectedPdf } from "@/components/modals/PasswordProtectedPdfDialog";
+import { useChatRuntime, type ComposerAttachment } from "@/lib/chat-v2/use-chat-runtime";
+import { useMentionMenu } from "./hooks/use-mention-menu";
+import { usePromptInputPaste } from "./hooks/use-prompt-input-paste";
+import { ComposerToolbar } from "./ComposerToolbar";
+import { useShallow } from "zustand/react/shallow";
+
+export function Composer() {
+  const {
+    items,
+    input,
+    setInput,
+    attachments,
+    setAttachments,
+    composerRef,
+    sendMessage,
+    status,
+    stop,
+    focusComposer,
+  } = useChatRuntime();
+  const toggleCardSelection = useUIStore((state) => state.toggleCardSelection);
+  const replySelections = useUIStore(useShallow((state) => state.replySelections));
+  const { selectedCardIds } = useSelectedCardIds();
+
+  const addFiles = useCallback(async (files: File[]) => {
+    const pdfFiles = files.filter(
+      (file) =>
+        file.type === "application/pdf" || file.name.toLowerCase().endsWith(".pdf"),
+    );
+    const { rejected: protectedNames } = await filterPasswordProtectedPdfs(pdfFiles);
+
+    if (protectedNames.length > 0) {
+      emitPasswordProtectedPdf(protectedNames);
+    }
+
+    const protectedSet = new Set(protectedNames);
+    const allowedFiles = files.filter((file) => !protectedSet.has(file.name));
+    if (allowedFiles.length === 0) return;
+
+    const nextAttachments: ComposerAttachment[] = allowedFiles.map((file) => {
+      const id = crypto.randomUUID();
+      useAttachmentUploadStore.getState().addUploading(id);
+      const attachment: ComposerAttachment = {
+        id,
+        file,
+        filename: file.name,
+        mediaType: file.type || "application/octet-stream",
+        isUploading: true,
+      };
+      attachment.uploadPromise = uploadFileDirect(file)
+        .then((result) => {
+          setAttachments((current) =>
+            current.map((candidate) =>
+              candidate.id === id
+                ? {
+                    ...candidate,
+                    url: result.url,
+                    filename: result.displayName,
+                    mediaType: result.contentType,
+                    isUploading: false,
+                  }
+                : candidate,
+            ),
+          );
+        })
+        .catch(() => {
+          toast.error(`Failed to upload ${file.name}`);
+          setAttachments((current) =>
+            current.filter((candidate) => candidate.id !== id),
+          );
+        })
+        .finally(() => {
+          useAttachmentUploadStore.getState().removeUploading(id);
+        });
+      return attachment;
+    });
+
+    setAttachments((current) => [...current, ...nextAttachments]);
+  }, [setAttachments]);
+
+  const mention = useMentionMenu({
+    inputRef: composerRef,
+    setInput,
+    onSelectItem: (item) => toggleCardSelection(item.id),
+  });
+
+  const handlePaste = usePromptInputPaste({ addFiles });
+
+  const handleSend = useCallback(async () => {
+    if (useAttachmentUploadStore.getState().uploadingIds.size > 0) {
+      toast.info("Please wait for uploads to finish before sending");
+      return;
+    }
+
+    await Promise.all(attachments.map((attachment) => attachment.uploadPromise).filter(Boolean));
+
+    const text = input.trim();
+    if (!text && attachments.length === 0 && replySelections.length === 0) {
+      return;
+    }
+
+    await sendMessage({
+      role: "user",
+      parts: [
+        ...attachments.filter((attachment) => attachment.url).map((attachment) => ({
+          type: "file" as const,
+          url: attachment.url!,
+          mediaType: attachment.mediaType,
+          filename: attachment.filename,
+        })),
+        ...(text || replySelections.length > 0 ? [{ type: "text" as const, text: text || "Empty message" }] : []),
+      ],
+    });
+  }, [attachments, input, replySelections.length, sendMessage]);
+
+  return (
+    <form
+      className="relative flex w-full flex-col rounded-lg border border-sidebar-border bg-sidebar-accent px-3.5 pt-2 pb-1 shadow-[0_9px_9px_0px_rgba(0,0,0,0.01),0_2px_5px_0px_rgba(0,0,0,0.06)]"
+      onClick={() => focusComposer()}
+      onSubmit={(event) => {
+        event.preventDefault();
+        void handleSend();
+      }}
+    >
+      {attachments.length > 0 ? (
+        <div className="mb-2 flex flex-wrap gap-2">
+          {attachments.map((attachment) => (
+            <div key={attachment.id} className="inline-flex items-center gap-1 rounded-md border bg-background px-2 py-1 text-xs">
+              <span>{attachment.filename}</span>
+              {attachment.isUploading ? <span className="text-muted-foreground">Uploading…</span> : null}
+              <button type="button" onClick={(event) => {
+                event.preventDefault();
+                setAttachments((current) => current.filter((candidate) => candidate.id !== attachment.id));
+              }}>
+                <X className="size-3" />
+              </button>
+            </div>
+          ))}
+        </div>
+      ) : null}
+      <CardContextDisplay items={items} />
+      <ReplyContextDisplay />
+      <div className="relative">
+        <textarea
+          ref={composerRef}
+          value={input}
+          onChange={(event) => setInput(event.target.value)}
+          onPaste={handlePaste}
+          onKeyDown={(event) => {
+            mention.handleKeyDown(event);
+            if (event.key === "Enter" && !event.shiftKey) {
+              event.preventDefault();
+              void handleSend();
+            }
+            if ((event.metaKey || event.ctrlKey) && event.key === "Enter") {
+              event.preventDefault();
+              void handleSend();
+            }
+          }}
+          onInput={mention.handleInput}
+          placeholder="Ask anything or @mention items"
+          className="max-h-32 min-h-20 w-full resize-none bg-transparent py-1.5 text-base text-sidebar-foreground outline-none placeholder:text-sidebar-foreground/60"
+          rows={1}
+          maxLength={10000}
+        />
+        <MentionMenu
+          open={mention.mentionMenuOpen}
+          onOpenChange={mention.handleMentionMenuClose}
+          query={mention.mentionQuery}
+          items={items}
+          onSelect={mention.handleMentionSelect}
+          selectedCardIds={selectedCardIds}
+          selectedIndicator={(isSelected) => isSelected ? <CheckCircle2 className="size-4 text-primary" /> : undefined}
+        />
+      </div>
+      <ComposerToolbar
+        onFilesSelected={addFiles}
+        canSend={Boolean(input.trim()) || attachments.length > 0 || replySelections.length > 0}
+        onSend={handleSend}
+        onStop={stop}
+        isRunning={status === "submitted" || status === "streaming"}
+        input={input}
+        setInput={setInput}
+      />
+    </form>
+  );
+}
diff --git a/src/components/chat-v2/ComposerToolbar.tsx b/src/components/chat-v2/ComposerToolbar.tsx
new file mode 100644
index 00000000..b06fe67f
--- /dev/null
+++ b/src/components/chat-v2/ComposerToolbar.tsx
@@ -0,0 +1,94 @@
+"use client";
+
+import "regenerator-runtime/runtime";
+import { Loader2, Mic, MicOff, Paperclip, Square, ArrowUpIcon } from "lucide-react";
+import { useEffect, useRef, useState, type ChangeEvent } from "react";
+import SpeechRecognition, { useSpeechRecognition } from "react-speech-recognition";
+import { Button } from "@/components/ui/button";
+import { ModelPicker } from "@/components/assistant-ui/ModelPicker";
+import { ModelSettingsMenu } from "@/components/assistant-ui/ModelSettingsMenu";
+import { useAttachmentUploadStore } from "@/lib/stores/attachment-upload-store";
+
+interface ComposerToolbarProps {
+  onFilesSelected: (files: File[]) => Promise<void>;
+  canSend: boolean;
+  onSend: () => Promise<void>;
+  onStop: () => Promise<void>;
+  isRunning: boolean;
+  input: string;
+  setInput: (value: string) => void;
+}
+
+function SpeechToTextButtonV2({ input, setInput }: Pick<ComposerToolbarProps, "input" | "setInput">) {
+  const { transcript, listening, resetTranscript, browserSupportsSpeechRecognition } = useSpeechRecognition();
+  const [originalText, setOriginalText] = useState("");
+
+  useEffect(() => {
+    if (listening && transcript) {
+      const separator = originalText && !originalText.endsWith(" ") ? " " : "";
+      setInput(originalText + separator + transcript);
+    }
+  }, [listening, originalText, setInput, transcript]);
+
+  if (!browserSupportsSpeechRecognition) return null;
+
+  return (
+    <Button
+      type="button"
+      variant="ghost"
+      size="icon"
+      className="size-8 rounded-full p-1.5"
+      onClick={() => {
+        if (listening) {
+          SpeechRecognition.stopListening();
+          return;
+        }
+        resetTranscript();
+        setOriginalText(input);
+        SpeechRecognition.startListening({ continuous: true });
+      }}
+    >
+      {listening ? <MicOff className="size-4" /> : <Mic className="size-4" />}
+    </Button>
+  );
+}
+
+export function ComposerToolbar({ onFilesSelected, canSend, onSend, onStop, isRunning, input, setInput }: ComposerToolbarProps) {
+  const fileInputRef = useRef<HTMLInputElement | null>(null);
+  const hasUploading = useAttachmentUploadStore((state) => state.uploadingIds.size > 0);
+
+  return (
+    <div className="relative mb-2 flex items-center justify-between">
+      <div className="flex items-center gap-1">
+        <input
+          ref={fileInputRef}
+          type="file"
+          className="hidden"
+          multiple
+          onChange={(event: ChangeEvent<HTMLInputElement>) => {
+            const files = Array.from(event.target.files ?? []);
+            event.target.value = "";
+            void onFilesSelected(files);
+          }}
+        />
+        <Button type="button" variant="ghost" size="icon" className="size-8 rounded-full" onClick={() => fileInputRef.current?.click()}>
+          <Paperclip className="size-4" />
+        </Button>
+        <ModelSettingsMenu />
+        <ModelPicker />
+      </div>
+      <div className="flex items-center gap-2">
+        <SpeechToTextButtonV2 input={input} setInput={setInput} />
+        {isRunning ? (
+          <Button type="button" size="icon" className="size-[34px] rounded-full" onClick={() => void onStop()}>
+            <Square className="size-3 fill-current" />
+          </Button>
+        ) : (
+          <Button type="button" size="icon" className="size-[34px] rounded-full" disabled={!canSend || hasUploading} onClick={() => void onSend()}>
+            {hasUploading ? <Loader2 className="size-4 animate-spin" /> : <ArrowUpIcon className="size-4" />}
+          </Button>
+        )}
+      </div>
+    </div>
+  );
+}
diff --git a/src/components/chat-v2/MessageList.tsx b/src/components/chat-v2/MessageList.tsx
new file mode 100644
index 00000000..d2c73ea7
--- /dev/null
+++ b/src/components/chat-v2/MessageList.tsx
@@ -0,0 +1,134 @@
+"use client";
+
+import { useCallback, useEffect, useLayoutEffect, useRef, useState, type ReactNode } from "react";
+import { VList, type VListHandle } from "virtua";
+import type { ChatStatus } from "ai";
+import type { ChatMessage } from "@/lib/chat-v2/types";
+import { AssistantMessage } from "./AssistantMessage";
+import { UserMessage } from "./UserMessage";
+
+interface MessageListProps {
+  threadId?: string | null;
+  messages: ChatMessage[];
+  status: ChatStatus;
+  isLoading: boolean;
+  onReloadThread: () => Promise<void>;
+  onRegenerate: (messageId: string) => Promise<void>;
+}
+
+function LastUserMeasurer({
+  children,
+  onMeasure,
+}: {
+  children: ReactNode;
+  onMeasure: (height: number) => void;
+}) {
+  const ref = useRef<HTMLDivElement | null>(null);
+
+  useLayoutEffect(() => {
+    if (!ref.current) return;
+
+    const measure = () => {
+      if (ref.current) {
+        onMeasure(ref.current.getBoundingClientRect().height);
+      }
+    };
+
+    measure();
+
+    const resizeObserver = new ResizeObserver(measure);
+    resizeObserver.observe(ref.current);
+
+    return () => resizeObserver.disconnect();
+  }, [onMeasure]);
+
+  return <div ref={ref}>{children}</div>;
+}
+
+function ThinkingMessage() {
+  return (
+    <div className="mx-auto w-full max-w-[50rem] px-2 pb-4">
+      <div className="chat-v2-assistant-message-content mx-2 flex items-center gap-2 leading-7 break-words text-muted-foreground">
+        <div className="size-2 animate-pulse rounded-full bg-current" />
+        <span className="text-sm">Thinking…</span>
+      </div>
+    </div>
+  );
+}
+
+export function MessageList({ threadId, messages, status, isLoading, onReloadThread, onRegenerate }: MessageListProps) {
+  const ref = useRef<VListHandle>(null);
+  const [lastUserSize, setLastUserSize] = useState(0);
+  const [blankSize, setBlankSize] = useState(0);
+  const prevStatusRef = useRef(status);
+  const handleMeasure = useCallback((height: number) => {
+    setLastUserSize(height);
+  }, []);
+
+  useEffect(() => {
+    const wasIdle = prevStatusRef.current === "ready" || prevStatusRef.current === "error";
+    const isNowRunning = status === "submitted" || status === "streaming";
+    if (wasIdle && isNowRunning && ref.current) {
+      const handle = ref.current;
+      setBlankSize(handle.viewportSize);
+      const targetIndex = messages.length - 1;
+      requestAnimationFrame(() => {
+        handle.scrollToIndex(targetIndex, { smooth: true, align: "start" });
+      });
+    }
+    if ((status === "ready" || status === "error") && prevStatusRef.current !== status) {
+      setBlankSize(0);
+    }
+    prevStatusRef.current = status;
+  }, [messages.length, status]);
+
+  if (isLoading) {
+    return <div className="flex flex-1 items-center justify-center text-sm text-muted-foreground">Loading chat…</div>;
+  }
+
+  if (messages.length === 0) {
+    return <div className="flex flex-1 items-center justify-center text-sm text-muted-foreground">Start a conversation.</div>;
+  }
+
+  return (
+    <div className="chat-v2-thread-viewport flex min-h-0 flex-1 overflow-hidden px-4">
+      <VList ref={ref} style={{ flex: 1 }}>
+        {messages.map((message, index) => {
+          const isLast = index === messages.length - 1;
+          const isSecondToLast = index === messages.length - 2;
+
+          if (message.role === "assistant") {
+            return (
+              <AssistantMessage
+                key={message.id}
+                threadId={threadId}
+                message={message}
+                isStreaming={isLast && (status === "submitted" || status === "streaming")}
+                blankSize={isLast ? Math.max(0, blankSize - lastUserSize) : undefined}
+                onRefresh={onRegenerate}
+                onReloadThread={onReloadThread}
+              />
+            );
+          }
+
+          if (isSecondToLast) {
+            return (
+              <LastUserMeasurer key={message.id} onMeasure={handleMeasure}>
+                <UserMessage threadId={threadId} message={message} onReloadThread={onReloadThread} onRegenerate={onRegenerate} />
+              </LastUserMeasurer>
+            );
+          }
+
+          return (
+            <div key={message.id}>
+              <UserMessage threadId={threadId} message={message} onReloadThread={onReloadThread} onRegenerate={onRegenerate} />
+            </div>
+          );
+        })}
+        {status === "submitted" && messages.at(-1)?.role !== "assistant" ? (
+          <ThinkingMessage key="thinking-message" />
+        ) : null}
+      </VList>
+    </div>
+  );
+}
diff --git a/src/components/chat-v2/TextSelectionManager.tsx b/src/components/chat-v2/TextSelectionManager.tsx
new file mode 100644
index 00000000..a9b7d04f
--- /dev/null
+++ b/src/components/chat-v2/TextSelectionManager.tsx
@@ -0,0 +1,130 @@
+"use client";
+
+import { useCallback, useEffect, useRef, useState } from "react";
+import { cn } from "@/lib/utils";
+import { useUIStore } from "@/lib/stores/ui-store";
+import { SelectionTooltip } from "@/components/ui/selection-tooltip";
+import type { SelectionInfo } from "@/components/assistant-ui/assistant-thread-selection";
+
+function extractSelectionTextForReply(selection: Selection) {
+  return selection.toString().trim();
+}
+
+function calculateTooltipPosition(range: Range) {
+  const rect = range.getBoundingClientRect();
+  return { y: rect.top, x: rect.left + rect.width / 2 };
+}
+
+function ChatV2ThreadSelection({ onSelectionChange, containerSelector, className }: { onSelectionChange?: (selection: SelectionInfo | null) => void; containerSelector: string; className?: string }) {
+  const currentSelectionRef = useRef<SelectionInfo | null>(null);
+  const mouseUpPositionRef = useRef<{ x: number; y: number } | null>(null);
+
+  const clear = useCallback(() => {
+    mouseUpPositionRef.current = null;
+    currentSelectionRef.current = null;
+    onSelectionChange?.(null);
+  }, [onSelectionChange]);
+
+  const commitSelection = useCallback(() => {
+    requestAnimationFrame(() => {
+      const selection = window.getSelection();
+      if (!selection || selection.isCollapsed || selection.rangeCount === 0) {
+        clear();
+        return;
+      }
+      const text = extractSelectionTextForReply(selection);
+      if (!text) {
+        clear();
+        return;
+      }
+      const container = document.querySelector(containerSelector);
+      if (!container) {
+        clear();
+        return;
+      }
+      const range = selection.getRangeAt(0);
+      const startEl = range.startContainer.nodeType === Node.TEXT_NODE ? range.startContainer.parentElement : (range.startContainer as Element);
+      const endEl = range.endContainer.nodeType === Node.TEXT_NODE ? range.endContainer.parentElement : (range.endContainer as Element);
+      if (!container.contains(range.startContainer) || !container.contains(range.endContainer) || !startEl?.closest(".chat-v2-assistant-message-content") || !endEl?.closest(".chat-v2-assistant-message-content")) {
+        clear();
+        return;
+      }
+      const position = mouseUpPositionRef.current ?? calculateTooltipPosition(range);
+      const info: SelectionInfo = { text, position, range: range.cloneRange() };
+      currentSelectionRef.current = info;
+      onSelectionChange?.(info);
+    });
+  }, [clear, containerSelector, onSelectionChange]);
+
+  useEffect(() => {
+    const handleMouseUp = (event: MouseEvent) => {
+      mouseUpPositionRef.current = { x: event.clientX, y: event.clientY };
+      commitSelection();
+    };
+    const handleKeyUp = () => commitSelection();
+    const handleSelectionChange = () => {
+      const selection = window.getSelection();
+      if (!selection || selection.isCollapsed) clear();
+    };
+    document.addEventListener("mouseup", handleMouseUp);
+    document.addEventListener("keyup", handleKeyUp);
+    document.addEventListener("selectionchange", handleSelectionChange);
+    return () => {
+      document.removeEventListener("mouseup", handleMouseUp);
+      document.removeEventListener("keyup", handleKeyUp);
+      document.removeEventListener("selectionchange", handleSelectionChange);
+    };
+  }, [clear, commitSelection]);
+
+  return <div className={className} />;
+}
+
+export function TextSelectionManager({ className, currentThreadId, onFocusComposer }: { className?: string; currentThreadId?: string | null; onFocusComposer: () => void }) {
+  const addReplySelection = useUIStore((state) => state.addReplySelection);
+  const clearReplySelections = useUIStore((state) => state.clearReplySelections);
+  const [tooltipPosition, setTooltipPosition] = useState({ x: 0, y: 0 });
+  const [currentSelection, setCurrentSelection] = useState<SelectionInfo | null>(null);
+  const previousThreadIdRef = useRef<string | null | undefined>(currentThreadId);
+
+  useEffect(() => {
+    if (previousThreadIdRef.current && previousThreadIdRef.current !== currentThreadId) {
+      window.getSelection()?.removeAllRanges();
+      setCurrentSelection(null);
+      clearReplySelections();
+    }
+    previousThreadIdRef.current = currentThreadId;
+  }, [clearReplySelections, currentThreadId]);
+
+  return (
+    <>
+      <ChatV2ThreadSelection
+        className={cn("fixed inset-0 pointer-events-none", className)}
+        containerSelector=".chat-v2-thread-viewport"
+        onSelectionChange={(selection) => {
+          if (!selection) {
+            setCurrentSelection(null);
+            return;
+          }
+          setCurrentSelection(selection);
+          setTooltipPosition(selection.position);
+        }}
+      />
+      <SelectionTooltip
+        visible={Boolean(currentSelection)}
+        position={tooltipPosition}
+        referenceElement={currentSelection?.range ?? null}
+        onClick={() => {
+          if (!currentSelection) return;
+          addReplySelection({ text: currentSelection.text, title: "Assistant message" });
+          setCurrentSelection(null);
+          window.getSelection()?.removeAllRanges();
+          onFocusComposer();
+        }}
+        onHide={() => {
+          setCurrentSelection(null);
+          window.getSelection()?.removeAllRanges();
+        }}
+      />
+    </>
+  );
+}
diff --git a/src/components/chat-v2/ThreadListDropdown.tsx b/src/components/chat-v2/ThreadListDropdown.tsx
new file mode 100644
index 00000000..fd815442
--- /dev/null
+++ b/src/components/chat-v2/ThreadListDropdown.tsx
@@ -0,0 +1,141 @@
+"use client";
+
+import { useEffect, useState } from "react";
+import { Trash2Icon, PencilIcon, MessageSquarePlus } from "lucide-react";
+import { toast } from "sonner";
+import { Button } from "@/components/ui/button";
+import { Input } from "@/components/ui/input";
+import { DropdownMenu, DropdownMenuContent, DropdownMenuTrigger, DropdownMenuSeparator } from "@/components/ui/dropdown-menu";
+import { AlertDialog, AlertDialogAction, AlertDialogCancel, AlertDialogContent, AlertDialogDescription, AlertDialogFooter, AlertDialogHeader, AlertDialogTitle } from "@/components/ui/alert-dialog";
+
+interface ThreadListDropdownProps {
+  workspaceId: string;
+  activeThreadId?: string | null;
+  onSelectThread: (threadId: string | null) => void;
+  trigger: React.ReactNode;
+}
+
+type ThreadListItem = {
+  remoteId: string;
+  title?: string;
+  status: string;
+};
+
+export function ThreadListDropdown({ workspaceId, activeThreadId, onSelectThread, trigger }: ThreadListDropdownProps) {
+  const [threads, setThreads] = useState<ThreadListItem[]>([]);
+  const [open, setOpen] = useState(false);
+  const [editingId, setEditingId] = useState<string | null>(null);
+  const [editValue, setEditValue] = useState("");
+  const [deleteId, setDeleteId] = useState<string | null>(null);
+
+  const loadThreads = async () => {
+    const response = await fetch(`/api/threads?workspaceId=${workspaceId}`, { cache: "no-store" });
+    if (!response.ok) throw new Error(await response.text());
+    const data = (await response.json()) as { threads: ThreadListItem[] };
+    setThreads(data.threads.filter((thread) => thread.status !== "archived"));
+  };
+
+  useEffect(() => {
+    if (!open) return;
+    void loadThreads();
+  }, [open, workspaceId]);
+
+  return (
+    <>
+      <DropdownMenu open={open} onOpenChange={setOpen}>
+        <DropdownMenuTrigger asChild>{trigger}</DropdownMenuTrigger>
+        <DropdownMenuContent align="end" className="w-80 max-h-[500px] overflow-hidden border-sidebar-border bg-sidebar p-0">
+          <Button variant="ghost" className="flex w-full items-center justify-start gap-2 rounded-none px-4 py-3 text-start font-medium" onClick={() => {
+            onSelectThread(null);
+            setOpen(false);
+          }}>
+            <MessageSquarePlus className="size-4 text-primary" />
+            New Chat
+          </Button>
+          <DropdownMenuSeparator className="m-0 bg-sidebar-border" />
+          <div className="max-h-[400px] overflow-y-auto p-1">
+            {threads.map((thread) => (
+              <div key={thread.remoteId} className={`group flex items-center gap-2 rounded-lg px-3 py-2 ${thread.remoteId === activeThreadId ? "bg-muted" : "hover:bg-muted"}`}>
+                {editingId === thread.remoteId ? (
+                  <Input
+                    value={editValue}
+                    onChange={(event) => setEditValue(event.target.value)}
+                    onBlur={() => {
+                      void (async () => {
+                        try {
+                          const response = await fetch(`/api/threads/${thread.remoteId}`, {
+                            method: "PATCH",
+                            headers: { "Content-Type": "application/json" },
+                            body: JSON.stringify({ title: editValue.trim() || "New Chat" }),
+                          });
+                          if (!response.ok) {
+                            throw new Error("Failed to rename chat");
+                          }
+                          await loadThreads();
+                        } catch {
+                          toast.error("Failed to rename chat");
+                        } finally {
+                          setEditingId(null);
+                        }
+                      })();
+                    }}
+                    onKeyDown={(event) => {
+                      if (event.key === "Enter") {
+                        event.currentTarget.blur();
+                      }
+                      if (event.key === "Escape") {
+                        setEditingId(null);
+                      }
+                    }}
+                    className="h-8"
+                  />
+                ) : (
+                  <button type="button" className="min-w-0 flex-1 text-left text-sm" onClick={() => {
+                    onSelectThread(thread.remoteId);
+                    setOpen(false);
+                  }}>
+                    {thread.title ?? "New Chat"}
+                  </button>
+                )}
+                <Button variant="ghost" size="icon" className="size-6 p-1 opacity-0 group-hover:opacity-100" onClick={() => {
+                  setEditingId(thread.remoteId);
+                  setEditValue(thread.title ?? "New Chat");
+                }}>
+                  <PencilIcon className="size-4" />
+                </Button>
+                <Button variant="ghost" size="icon" className="size-6 p-1 opacity-0 group-hover:opacity-100" onClick={() => setDeleteId(thread.remoteId)}>
+                  <Trash2Icon className="size-4" />
+                </Button>
+              </div>
+            ))}
+          </div>
+        </DropdownMenuContent>
+      </DropdownMenu>
+      <AlertDialog open={deleteId != null} onOpenChange={(nextOpen) => !nextOpen && setDeleteId(null)}>
+        <AlertDialogContent>
+          <AlertDialogHeader>
+            <AlertDialogTitle>Delete Chat</AlertDialogTitle>
+            <AlertDialogDescription>Are you sure you want to delete this chat? This action cannot be undone.</AlertDialogDescription>
+          </AlertDialogHeader>
+          <AlertDialogFooter>
+            <AlertDialogCancel>Cancel</AlertDialogCancel>
+            <AlertDialogAction className="bg-destructive text-destructive-foreground hover:bg-destructive/90" onClick={() => {
+              void (async () => {
+                if (!deleteId) return;
+                const response = await fetch(`/api/threads/${deleteId}`, { method: "DELETE" });
+                if (!response.ok) {
+                  toast.error("Failed to delete chat");
+                  setDeleteId(null);
+                  return;
+                }
+                if (deleteId === activeThreadId) onSelectThread(null);
+                setDeleteId(null);
+                await loadThreads();
+              })();
+            }}>Delete</AlertDialogAction>
+          </AlertDialogFooter>
+        </AlertDialogContent>
+      </AlertDialog>
+    </>
+  );
+}
diff --git a/src/components/chat-v2/UserActionBar.tsx b/src/components/chat-v2/UserActionBar.tsx
new file mode 100644
index 00000000..104d9acb
--- /dev/null
+++ b/src/components/chat-v2/UserActionBar.tsx
@@ -0,0 +1,35 @@
+"use client";
+
+import { CheckIcon, CopyIcon, PencilIcon } from "lucide-react";
+import { useEffect, useState } from "react";
+import { Button } from "@/components/ui/button";
+
+interface UserActionBarProps {
+  textContent: string;
+  onEdit: () => void;
+}
+
+export function UserActionBar({ textContent, onEdit }: UserActionBarProps) {
+  const [copied, setCopied] = useState(false);
+
+  useEffect(() => {
+    if (!copied) return;
+    const timeout = window.setTimeout(() => setCopied(false), 2000);
+    return () => window.clearTimeout(timeout);
+  }, [copied]);
+
+  return (
+    <div className="flex gap-1 text-muted-foreground">
+      <Button variant="ghost" size="icon" className="size-6 p-1" onClick={() => {
+        if (!textContent) return;
+        void navigator.clipboard.writeText(textContent);
+        setCopied(true);
+      }}>
+        {copied ? <CheckIcon className="size-4" /> : <CopyIcon className="size-4" />}
+      </Button>
+      <Button variant="ghost" size="icon" className="size-6 p-1" onClick={onEdit}>
+        <PencilIcon className="size-4" />
+      </Button>
+    </div>
+  );
+}
diff --git a/src/components/chat-v2/UserMessage.tsx b/src/components/chat-v2/UserMessage.tsx
new file mode 100644
index 00000000..2f4d2b97
--- /dev/null
+++ b/src/components/chat-v2/UserMessage.tsx
@@ -0,0 +1,105 @@
+"use client";
+
+import { ChevronDown, ChevronUp } from "lucide-react";
+import { useMemo, useState, type Dispatch, type SetStateAction } from "react";
+import { toast } from "sonner";
+import { Textarea } from "@/components/ui/textarea";
+import { Button } from "@/components/ui/button";
+import { ReplySelectionRichText } from "@/components/chat/ReplySelectionRichText";
+import { BranchNav } from "./BranchNav";
+import { UserActionBar } from "./UserActionBar";
+import type { ChatMessage } from "@/lib/chat-v2/types";
+import { editBranchMessage } from "@/lib/chat-v2/branches";
+
+const USER_MESSAGE_MAX_CHARS = 2500;
+
+interface UserMessageProps {
+  threadId?: string | null;
+  message: ChatMessage;
+  onReloadThread: () => Promise<void>;
+  onRegenerate: (messageId: string) => Promise<void>;
+}
+
+function ReplyContextBadges({ message }: { message: ChatMessage }) {
+  const replySelections = message.metadata?.replySelections;
+  if (!replySelections?.length) return null;
+
+  return (
+    <div className="mb-2 flex flex-wrap gap-1.5">
+      {replySelections.map((selection, index) => (
+        <div key={`${message.id}-reply-${index}`} className="inline-flex items-center gap-1.5 rounded-md border border-blue-600/25 bg-blue-600/10 px-2 py-0.5 text-xs text-blue-800 dark:text-blue-200">
+          <ReplySelectionRichText text={selection.text} />
+        </div>
+      ))}
+    </div>
+  );
+}
+
+export function UserMessage({ threadId, message, onReloadThread, onRegenerate }: UserMessageProps) {
+  const [expanded, setExpanded] = useState(false);
+  const [editing, setEditing] = useState(false);
+  const [draft, setDraft] = useState(() => message.parts.filter((part) => part.type === "text").map((part) => part.text).join("\n\n"));
+  const textContent = useMemo(() => message.parts.filter((part) => part.type === "text").map((part) => part.text).join("\n\n"), [message.parts]);
+  const showExpand = textContent.length > USER_MESSAGE_MAX_CHARS;
+  const visibleText = showExpand && !expanded ? `${textContent.slice(0, USER_MESSAGE_MAX_CHARS)}…` : textContent;
+  const fileParts = message.parts.filter((part) => part.type === "file");
+
+  const saveEdit = async () => {
+    if (!threadId) return;
+    try {
+      const { newMessageId } = await editBranchMessage(threadId, message.id, draft);
+      setEditing(false);
+      await onReloadThread();
+      await onRegenerate(newMessageId);
+    } catch (error) {
+      toast.error(error instanceof Error ? error.message : "Failed to edit message");
+    }
+  };
+
+  return (
+    <div className="mx-auto grid w-full max-w-[50rem] auto-rows-auto grid-cols-[minmax(72px,1fr)_auto] gap-y-2 px-2 pt-4 pb-1 last:mb-5 [&:where(>*)]:col-start-2" data-role="user">
+      {fileParts.length > 0 ? (
+        <div className="col-start-2 flex flex-wrap justify-end gap-2">
+          {fileParts.map((part) => (
+            <a key={part.url} href={part.url} target="_blank" rel="noreferrer" className="rounded-md border bg-background px-2 py-1 text-xs text-foreground">
+              {part.filename ?? part.url}
+            </a>
+          ))}
+        </div>
+      ) : null}
+
+      <div className="relative col-start-2 min-w-0">
+        <ReplyContextBadges message={message} />
+        <div className="rounded-lg bg-muted px-3 py-2 text-sm text-foreground">
+          {editing ? (
+            <div className="space-y-3">
+              <Textarea value={draft} onChange={(event) => setDraft(event.target.value)} className="min-h-28 resize-y bg-background" />
+              <div className="flex justify-end gap-2">
+                <Button variant="ghost" size="sm" onClick={() => { setEditing(false); setDraft(textContent); }}>Cancel</Button>
+                <Button size="sm" onClick={() => void saveEdit()}>Save</Button>
+              </div>
+            </div>
+          ) : (
+            <>
+              <div className="whitespace-pre-wrap break-words">{visibleText}</div>
+              {showExpand ? (
+                <div className="mt-2 flex justify-end">
+                  <button type="button" onClick={() => setExpanded((value) => !value)} className="flex items-center gap-1 text-xs text-muted-foreground transition-colors hover:text-foreground">
+                    {expanded ? <ChevronUp className="size-3.5" /> : <ChevronDown className="size-3.5" />}
+                    {expanded ? "Show less" : "Show more"}
+                  </button>
+                </div>
+              ) : null}
+            </>
+          )}
+        </div>
+      </div>
+
+      <div className="relative col-start-2 min-h-[20px]">
+        {!editing ? <div className="absolute right-0"><UserActionBar textContent={textContent} onEdit={() => setEditing(true)} /></div> : null}
+      </div>
+
+      <BranchNav threadId={threadId} messageId={message.id} className="col-span-full col-start-1 justify-end text-xs text-muted-foreground" />
+    </div>
+  );
+}
diff --git a/src/components/chat-v2/hooks/use-mention-menu.ts b/src/components/chat-v2/hooks/use-mention-menu.ts
new file mode 100644
index 00000000..43f5dab2
--- /dev/null
+++ b/src/components/chat-v2/hooks/use-mention-menu.ts
@@ -0,0 +1,89 @@
+"use client";
+
+import { useCallback, useState, type FormEvent, type KeyboardEvent, type RefObject } from "react";
+import type { Item } from "@/lib/workspace-state/types";
+
+interface UseMentionMenuArgs {
+  inputRef: RefObject<HTMLTextAreaElement | null>;
+  setInput: (value: string) => void;
+  onSelectItem: (item: Item) => void;
+}
+
+export function useMentionMenu({ inputRef, setInput, onSelectItem }: UseMentionMenuArgs) {
+  const [mentionMenuOpen, setMentionMenuOpen] = useState(false);
+  const [mentionQuery, setMentionQuery] = useState("");
+  const [mentionStartIndex, setMentionStartIndex] = useState<number | null>(null);
+
+  const handleInput = useCallback((event: FormEvent<HTMLTextAreaElement>) => {
+    const textarea = event.currentTarget;
+    const value = textarea.value;
+    const cursorPos = textarea.selectionStart ?? 0;
+    if (mentionStartIndex === null) return;
+    const query = value.slice(mentionStartIndex + 1, cursorPos);
+    if (cursorPos <= mentionStartIndex || query.includes(" ") || query.includes("\n")) {
+      setMentionMenuOpen(false);
+      setMentionStartIndex(null);
+      setMentionQuery("");
+      return;
+    }
+    setMentionQuery(query);
+  }, [mentionStartIndex]);
+
+  const handleKeyDown = useCallback((event: KeyboardEvent<HTMLTextAreaElement>) => {
+    const textarea = event.currentTarget;
+    if (event.key === "@" && !mentionMenuOpen) {
+      const cursorPos = textarea.selectionStart ?? 0;
+      const charBefore = cursorPos > 0 ? textarea.value[cursorPos - 1] : " ";
+      if (charBefore === " " || charBefore === "\n" || cursorPos === 0) {
+        setMentionMenuOpen(true);
+        setMentionStartIndex(cursorPos);
+        setMentionQuery("");
+      }
+    }
+
+    if (event.key === "Escape" && mentionMenuOpen) {
+      event.preventDefault();
+      setMentionMenuOpen(false);
+      setMentionStartIndex(null);
+      setMentionQuery("");
+    }
+
+    if (mentionMenuOpen && ["ArrowUp", "ArrowDown", "Enter"].includes(event.key)) {
+      event.preventDefault();
+    }
+  }, [mentionMenuOpen]);
+
+  const clearMentionQuery = useCallback(() => {
+    if (mentionStartIndex === null || !inputRef.current) return;
+    const textarea = inputRef.current;
+    const currentValue = textarea.value;
+    let queryEndIndex = mentionStartIndex;
+    while (queryEndIndex < currentValue.length && currentValue[queryEndIndex] !== " " && currentValue[queryEndIndex] !== "\n") {
+      queryEndIndex += 1;
+    }
+    const textBefore = currentValue.substring(0, mentionStartIndex);
+    const textAfter = currentValue.substring(queryEndIndex);
+    setInput(textBefore + textAfter);
+    setMentionMenuOpen(false);
+    setMentionStartIndex(null);
+    setMentionQuery("");
+    queueMicrotask(() => {
+      const next = inputRef.current;
+      if (!next) return;
+      next.focus();
+      next.setSelectionRange(textBefore.length, textBefore.length);
+    });
+  }, [inputRef, mentionStartIndex, setInput]);
+
+  return {
+    mentionMenuOpen,
+    mentionQuery,
+    handleInput,
+    handleKeyDown,
+    handleMentionMenuClose: (open: boolean) => {
+      if (!open) clearMentionQuery();
+      setMentionMenuOpen(open);
+    },
+    handleMentionSelect: (item: Item) => onSelectItem(item),
+  };
+}
diff --git a/src/components/chat-v2/hooks/use-prompt-input-paste.ts b/src/components/chat-v2/hooks/use-prompt-input-paste.ts
new file mode 100644
index 00000000..61815e9e
--- /dev/null
+++ b/src/components/chat-v2/hooks/use-prompt-input-paste.ts
@@ -0,0 +1,29 @@
+"use client";
+
+import { useCallback, type ClipboardEvent } from "react";
+
+interface UsePromptInputPasteArgs {
+  addFiles: (files: File[]) => Promise<void>;
+}
+
+export function usePromptInputPaste({ addFiles }: UsePromptInputPasteArgs) {
+  return useCallback(async (event: ClipboardEvent<HTMLTextAreaElement>) => {
+    const clipboardData = event.clipboardData;
+    if (!clipboardData) return;
+
+    const files = Array.from(clipboardData.files);
+    if (files.length > 0) {
+      event.preventDefault();
+      await addFiles(files);
+      return;
+    }
+
+    const imageItem = Array.from(clipboardData.items).find((item) => item.type.startsWith("image/"));
+    if (!imageItem) return;
+    event.preventDefault();
+    const file = imageItem.getAsFile();
+    if (file) {
+      await addFiles([file]);
+    }
+  }, [addFiles]);
+}
diff --git a/src/components/chat-v2/parts/ReasoningPart.tsx b/src/components/chat-v2/parts/ReasoningPart.tsx
new file mode 100644
index 00000000..289ebdc9
--- /dev/null
+++ b/src/components/chat-v2/parts/ReasoningPart.tsx
@@ -0,0 +1,61 @@
+"use client";
+
+import { memo, useEffect, useLayoutEffect, useMemo, useRef, useState } from "react";
+import { ChevronDownIcon } from "lucide-react";
+import { Collapsible, CollapsibleContent, CollapsibleTrigger } from "@/components/ui/collapsible";
+import { TextPart } from "./TextPart";
+
+interface ReasoningPartProps {
+  parts: Array<{ type: "reasoning"; text: string }>;
+  isStreaming: boolean;
+  threadId?: string | null;
+  messageId: string;
+}
+
+function ReasoningPartImpl({ parts, isStreaming, threadId, messageId }: ReasoningPartProps) {
+  const [open, setOpen] = useState(isStreaming);
+  const textRef = useRef<HTMLDivElement>(null);
+  const textSnapshot = useMemo(() => parts.map((part) => part.text).join("\n\n"), [parts]);
+
+  useLayoutEffect(() => {
+    if (!isStreaming || !textRef.current) return;
+    const element = textRef.current;
+    const fromBottom = element.scrollHeight - element.scrollTop - element.clientHeight;
+    if (fromBottom <= 80) {
+      element.scrollTop = element.scrollHeight;
+    }
+  }, [isStreaming, textSnapshot.length]);
+
+  useEffect(() => {
+    if (isStreaming) {
+      setOpen(true);
+      return;
+    }
+    setOpen(false);
+  }, [isStreaming]);
+
+  return (
+    <Collapsible open={open} onOpenChange={(nextOpen) => !isStreaming && setOpen(nextOpen)} className="group/reasoning mb-4 w-full">
+      <CollapsibleTrigger className="flex max-w-[75%] items-center gap-2 py-1 text-sm text-muted-foreground transition-colors hover:text-foreground">
+        <span>Reasoning</span>
+        <ChevronDownIcon className="size-4 transition-transform group-data-[state=closed]/reasoning:-rotate-90" />
+      </CollapsibleTrigger>
+      <CollapsibleContent className="overflow-hidden text-sm text-muted-foreground data-[state=closed]:animate-collapsible-up data-[state=open]:animate-collapsible-down">
+        <div ref={textRef} className="max-h-64 overflow-y-auto scroll-smooth pt-2 pb-2 pl-6 leading-relaxed">
+          {parts.map((part, index) => (
+            <TextPart
+              key={`${messageId}-reasoning-${index}`}
+              text={part.text}
+              isStreaming={isStreaming && index === parts.length - 1}
+              threadId={threadId}
+              messageId={`${messageId}-reasoning-${index}`}
+              streamingVariant="reasoning"
+            />
+          ))}
+        </div>
+      </CollapsibleContent>
+    </Collapsible>
+  );
+}
+
+export const ReasoningPart = memo(ReasoningPartImpl);
diff --git a/src/components/chat-v2/parts/TextPart.tsx b/src/components/chat-v2/parts/TextPart.tsx
new file mode 100644
index 00000000..a2ca3c51
--- /dev/null
+++ b/src/components/chat-v2/parts/TextPart.tsx
@@ -0,0 +1,155 @@
+"use client";
+
+import { Streamdown, type CodeHighlighterPlugin } from "streamdown";
+import "streamdown/styles.css";
+import { createCodePlugin } from "@streamdown/code";
+import { mermaid } from "@streamdown/mermaid";
+import { createMathPlugin } from "@streamdown/math";
+import { memo, useRef, type ReactNode, Children, isValidElement, type AnchorHTMLAttributes, type ClipboardEvent as ReactClipboardEvent, type HTMLAttributes } from "react";
+import { InlineCitation, UrlCitation } from "@/components/ai-elements/inline-citation";
+import { Badge } from "@/components/ui/badge";
+import { MarkdownLink } from "@/components/ui/markdown-link";
+import { useNavigateToItem } from "@/hooks/ui/use-navigate-to-item";
+import { useWorkspaceState } from "@/hooks/workspace/use-workspace-state";
+import { useUIStore } from "@/lib/stores/ui-store";
+import { useWorkspaceStore } from "@/lib/stores/workspace-store";
+import { getCitationUrl, preprocessLatex } from "@/lib/utils/preprocess-latex";
+import { resolveItemByPath } from "@/lib/ai/tools/workspace-search-utils";
+import { cn } from "@/lib/utils";
+
+const math = createMathPlugin({ singleDollarTextMath: true });
+const code = createCodePlugin({ themes: ["one-dark-pro", "one-dark-pro"] }) as CodeHighlighterPlugin;
+
+function parseCitationPage(ref: string): { title: string; quote?: string; pageNumber?: number } {
+  const segments = ref.split(/\s*\|\s*/).map((s) => s.trim()).filter(Boolean);
+  if (segments.length === 0) return { title: "" };
+  const last = segments.at(-1) ?? "";
+  const pageMatch = last.match(/^(?:p\.?\s*)?(\d+)$/i) || last.match(/^page\s*(\d+)$/i);
+  let pageNumber: number | undefined;
+  if (pageMatch) {
+    pageNumber = Number.parseInt(pageMatch[1], 10);
+    segments.pop();
+  }
+  return {
+    title: segments[0] ?? "",
+    quote: segments.length > 1 ? segments.slice(1).join(" | ") : undefined,
+    pageNumber,
+  };
+}
+
+function extractCitationText(children: ReactNode): string {
+  if (typeof children === "string") return children.trim();
+  if (children == null) return "";
+  return Children.toArray(children)
+    .map((child) => {
+      if (typeof child === "string") return child;
+      if (isValidElement(child)) {
+        const nested = (child.props as { children?: ReactNode }).children;
+        return nested ? extractCitationText(nested) : "";
+      }
+      return "";
+    })
+    .join("")
+    .trim();
+}
+
+const CitationRenderer = memo(({ children }: { children?: ReactNode }) => {
+  const ref = extractCitationText(children);
+  const url = getCitationUrl(ref);
+  const workspaceId = useWorkspaceStore((state) => state.currentWorkspaceId);
+  const { state: workspaceState } = useWorkspaceState(workspaceId);
+  const navigateToItem = useNavigateToItem();
+  const openWorkspaceItem = useUIStore((state) => state.openWorkspaceItem);
+  const setCitationHighlightQuery = useUIStore((state) => state.setCitationHighlightQuery);
+
+  if (!ref) return null;
+  if (url) return <UrlCitation url={url} />;
+  if (ref.startsWith("http://") || ref.startsWith("https://")) {
+    return <UrlCitation url={ref} />;
+  }
+
+  const { title, quote, pageNumber } = parseCitationPage(ref);
+  const normalize = (value: string) => value.trim().toLowerCase().replace(/\.pdf$/i, "");
+  const item = resolveItemByPath(workspaceState, title) ?? workspaceState.find((candidate) =>
+    (candidate.type === "document" || candidate.type === "pdf") && normalize(candidate.name) === normalize(title),
+  );
+
+  if (!item) {
+    return <InlineCitation><Badge variant="secondary" className="ml-0.5 px-1.5 py-0 text-[10px]">{title}</Badge></InlineCitation>;
+  }
+
+  const displayTitle = title.includes("/") ? title.split("/").at(-1) ?? title : title;
+
+  return (
+    <InlineCitation>
+      <Badge
+        variant="secondary"
+        className="ml-0.5 cursor-pointer px-1.5 py-0 text-[10px]"
+        onClick={() => {
+          if (quote?.trim() || (pageNumber != null && item.type === "pdf")) {
+            setCitationHighlightQuery({ itemId: item.id, query: quote?.trim() ?? "", ...(pageNumber != null ? { pageNumber } : {}) });
+          }
+          navigateToItem(item.id, { silent: true });
+          openWorkspaceItem(item.id);
+        }}
+      >
+        {displayTitle.slice(0, 20)}{displayTitle.length > 20 ? "…" : ""}{pageNumber != null ? ` · p.${pageNumber}` : ""}
+      </Badge>
+    </InlineCitation>
+  );
+});
+CitationRenderer.displayName = "CitationRenderer";
+
+interface TextPartProps {
+  text: string;
+  isStreaming: boolean;
+  threadId?: string | null;
+  messageId: string;
+  streamingVariant?: "default" | "reasoning";
+}
+
+function TextPartImpl({ text, isStreaming, threadId, messageId, streamingVariant = "default" }: TextPartProps) {
+  const containerRef = useRef<HTMLDivElement>(null);
+  const components = {
+    a: (props: AnchorHTMLAttributes<HTMLAnchorElement> & { node?: unknown }) => <MarkdownLink {...props} />,
+    citation: ({ children: citationChildren }: { children?: ReactNode; [key: string]: unknown }) => <CitationRenderer>{citationChildren}</CitationRenderer>,
+    ol: ({ children, ...props }: HTMLAttributes<HTMLOListElement>) => <ol className="ml-4 list-outside list-decimal whitespace-normal" {...props}>{children}</ol>,
+    ul: ({ children, ...props }: HTMLAttributes<HTMLUListElement>) => <ul className="ml-4 list-outside list-disc whitespace-normal" {...props}>{children}</ul>,
+  } as unknown as Parameters<typeof Streamdown>[0]["components"];
+
+  const handleCopy = (event: ReactClipboardEvent<HTMLDivElement>) => {
+    const selection = window.getSelection();
+    if (!selection || selection.rangeCount === 0) return;
+    const wrapper = document.createElement("div");
+    wrapper.appendChild(selection.getRangeAt(0).cloneContents());
+    wrapper.querySelectorAll<HTMLElement>("*").forEach((element) => {
+      element.style.removeProperty("background");
+      element.style.removeProperty("background-color");
+    });
+    const html = wrapper.innerHTML;
+    const plainText = wrapper.textContent ?? "";
+    if (!html && !plainText) return;
+    event.preventDefault();
+    if (html) event.clipboardData.setData("text/html", html);
+    if (plainText) event.clipboardData.setData("text/plain", plainText);
+  };
+
+  return (
+    <div key={`${threadId ?? "no-thread"}-${messageId}`} ref={containerRef} className="chat-v2-markdown" onCopy={handleCopy}>
+      <Streamdown
+        allowedTags={{ citation: [] }}
+        animated={streamingVariant === "reasoning" ? { animation: "blurIn", duration: 250, easing: "ease-out" } : { animation: "fadeIn", duration: 200, easing: "ease-out" }}
+        isAnimating={isStreaming}
+        className={cn("streamdown-content size-full [&>*:first-child]:mt-0 [&>*:last-child]:mb-0")}
+        linkSafety={{ enabled: false }}
+        plugins={{ code, mermaid, math }}
+        components={components}
+        mermaid={{ config: { theme: "dark" } }}
+      >
+        {preprocessLatex(text)}
+      </Streamdown>
+    </div>
+  );
+}
+
+export const TextPart = memo(TextPartImpl);
diff --git a/src/components/chat-v2/parts/ToolGroup.tsx b/src/components/chat-v2/parts/ToolGroup.tsx
new file mode 100644
index 00000000..0f57db1d
--- /dev/null
+++ b/src/components/chat-v2/parts/ToolGroup.tsx
@@ -0,0 +1,40 @@
+"use client";
+
+import { memo, useEffect, useState, type PropsWithChildren } from "react";
+import { ChevronDownIcon, LoaderIcon } from "lucide-react";
+import { Collapsible, CollapsibleContent, CollapsibleTrigger } from "@/components/ui/collapsible";
+import { cn } from "@/lib/utils";
+import { renderLegacyTool } from "./tool-shim";
+import type { ChatToolPart } from "@/lib/chat-v2/types";
+
+interface ToolGroupProps {
+  parts: ChatToolPart[];
+  isStreaming: boolean;
+}
+
+function ToolGroupImpl({ parts, isStreaming }: ToolGroupProps) {
+  const [open, setOpen] = useState(parts.length > 1 || isStreaming);
+
+  useEffect(() => {
+    if (isStreaming) setOpen(true);
+  }, [isStreaming]);
+
+  if (parts.length === 1) {
+    return <div>{renderLegacyTool(parts[0])}</div>;
+  }
+
+  return (
+    <Collapsible open={open} onOpenChange={(nextOpen) => !isStreaming && setOpen(nextOpen)} className="group/tool-group w-full">
+      <CollapsibleTrigger className="flex cursor-pointer items-center gap-2 py-1 text-sm text-muted-foreground transition-colors hover:text-foreground">
+        {isStreaming ? <LoaderIcon className="size-4 animate-spin" /> : null}
+        <span>{isStreaming ? `Taking ${parts.length} actions` : `Took ${parts.length} actions`}</span>
+        <ChevronDownIcon className="size-4 transition-transform group-data-[state=closed]/tool-group:-rotate-90" />
+      </CollapsibleTrigger>
+      <CollapsibleContent className={cn("overflow-hidden pt-2 data-[state=closed]:animate-collapsible-up data-[state=open]:animate-collapsible-down")}>
+        <div className="flex flex-col gap-1">{parts.map((part) => <div key={part.toolCallId}>{renderLegacyTool(part)}</div>)}</div>
+      </CollapsibleContent>
+    </Collapsible>
+  );
+}
+
+export const ToolGroup = memo(ToolGroupImpl);
diff --git a/src/components/chat-v2/parts/group-parts.ts b/src/components/chat-v2/parts/group-parts.ts
new file mode 100644
index 00000000..c81e8cba
--- /dev/null
+++ b/src/components/chat-v2/parts/group-parts.ts
@@ -0,0 +1,37 @@
+import type { ChatMessagePart, ChatToolPart } from "@/lib/chat-v2/types";
+
+type ReasoningSegment = { kind: "reasoning"; parts: Extract<ChatMessagePart, { type: "reasoning" }>[] };
+type ToolSegment = { kind: "tools"; parts: ChatToolPart[] };
+type PartSegment = { kind: "part"; part: ChatMessagePart };
+
+export type GroupedPart = ReasoningSegment | ToolSegment | PartSegment;
+
+export function groupParts(parts: ChatMessagePart[]): GroupedPart[] {
+  const grouped: GroupedPart[] = [];
+
+  for (const part of parts) {
+    const previous = grouped.at(-1);
+
+    if (part.type === "reasoning") {
+      if (previous?.kind === "reasoning") {
+        previous.parts.push(part);
+      } else {
+        grouped.push({ kind: "reasoning", parts: [part] });
+      }
+      continue;
+    }
+
+    if (part.type.startsWith("tool-")) {
+      if (previous?.kind === "tools") {
+        previous.parts.push(part as ChatToolPart);
+      } else {
+        grouped.push({ kind: "tools", parts: [part as ChatToolPart] });
+      }
+      continue;
+    }
+
+    grouped.push({ kind: "part", part });
+  }
+
+  return grouped;
+}
diff --git a/src/components/chat-v2/parts/tool-shim.tsx b/src/components/chat-v2/parts/tool-shim.tsx
new file mode 100644
index 00000000..a6386775
--- /dev/null
+++ b/src/components/chat-v2/parts/tool-shim.tsx
@@ -0,0 +1,109 @@
+"use client";
+
+import { createElement, type ComponentType, type ReactNode } from "react";
+import { canonicalizeToolUIPartType } from "@/lib/ai/chat-tool-names";
+import type { ChatToolPart } from "@/lib/chat-v2/types";
+import { CHAT_TOOL } from "@/lib/ai/chat-tool-names";
+import { renderWebSearchToolUI } from "@/components/assistant-ui/WebSearchToolUI";
+import { renderURLContextToolUI } from "@/components/assistant-ui/URLContextToolUI";
+import { renderSearchWorkspaceToolUI } from "@/components/assistant-ui/SearchWorkspaceToolUI";
+import { renderReadWorkspaceToolUI } from "@/components/assistant-ui/ReadWorkspaceToolUI";
+import { renderCreateDocumentToolUI } from "@/components/assistant-ui/CreateDocumentToolUI";
+import { renderEditItemToolUI } from "@/components/assistant-ui/EditItemToolUI";
+import { renderCreateFlashcardToolUI } from "@/components/assistant-ui/CreateFlashcardToolUI";
+import { renderCreateQuizToolUI } from "@/components/assistant-ui/CreateQuizToolUI";
+import { renderYouTubeSearchToolUI } from "@/components/assistant-ui/YouTubeSearchToolUI";
+import { renderAddYoutubeVideoToolUI } from "@/components/assistant-ui/AddYoutubeVideoToolUI";
+import { renderExecuteCodeToolUI } from "@/components/assistant-ui/ExecuteCodeToolUI";
+
+function toLegacyToolProps(part: ChatToolPart) {
+  const toolName = part.type.replace(/^tool-/, "");
+  const state = part.state;
+
+  if (
+    state === "input-streaming" ||
+    state === "input-available" ||
+    state === "approval-requested"
+  ) {
+    return { args: part.input, result: undefined, status: { type: "running" as const }, toolName };
+  }
+
+  if (state === "output-available") {
+    return { args: part.input, result: part.output, status: { type: "complete" as const }, toolName };
+  }
+
+  if (
+    state === "output-error" ||
+    (state === "approval-responded" && part.approval.approved === false)
+  ) {
+    return {
+      args: part.input,
+      result: part.output,
+      status: {
+        type: "incomplete" as const,
+        reason: "error" as const,
+        error: part.errorText,
+      },
+      toolName,
+    };
+  }
+
+  return { args: part.input, result: undefined, status: { type: "running" as const }, toolName };
+}
+
+type LegacyToolProps = ReturnType<typeof toLegacyToolProps>;
+
+function renderComponent(
+  renderer: ComponentType<LegacyToolProps>,
+  props: LegacyToolProps,
+) {
+  return createElement(renderer, props);
+}
+
+export function renderLegacyTool(part: ChatToolPart): ReactNode {
+  const legacyProps = toLegacyToolProps(part);
+  const type = canonicalizeToolUIPartType(part.type).replace(/^tool-/, "");
+  const toolName = legacyProps.toolName;
+
+  switch (type) {
+    case CHAT_TOOL.WEB_FETCH:
+      return renderComponent(renderURLContextToolUI as ComponentType<LegacyToolProps>, legacyProps);
+    case CHAT_TOOL.WEB_SEARCH:
+      return renderComponent(renderWebSearchToolUI as ComponentType<LegacyToolProps>, legacyProps);
+    case CHAT_TOOL.WORKSPACE_SEARCH:
+      return renderComponent(renderSearchWorkspaceToolUI as ComponentType<LegacyToolProps>, legacyProps);
+    case CHAT_TOOL.WORKSPACE_READ:
+      return renderComponent(renderReadWorkspaceToolUI as ComponentType<LegacyToolProps>, legacyProps);
+    case CHAT_TOOL.DOCUMENT_CREATE:
+      return renderComponent(renderCreateDocumentToolUI as ComponentType<LegacyToolProps>, legacyProps);
+    case CHAT_TOOL.ITEM_EDIT:
+      return renderComponent(renderEditItemToolUI as ComponentType<LegacyToolProps>, legacyProps);
+    case CHAT_TOOL.FLASHCARDS_CREATE:
+      return renderComponent(renderCreateFlashcardToolUI as ComponentType<LegacyToolProps>, legacyProps);
+    case CHAT_TOOL.QUIZ_CREATE:
+      return renderComponent(renderCreateQuizToolUI as ComponentType<LegacyToolProps>, legacyProps);
+    case CHAT_TOOL.YOUTUBE_SEARCH:
+      return renderComponent(renderYouTubeSearchToolUI as ComponentType<LegacyToolProps>, legacyProps);
+    case CHAT_TOOL.YOUTUBE_ADD:
+      return renderComponent(renderAddYoutubeVideoToolUI as ComponentType<LegacyToolProps>, legacyProps);
+    case CHAT_TOOL.CODE_EXECUTE:
+      return renderComponent(renderExecuteCodeToolUI as ComponentType<LegacyToolProps>, legacyProps);
+    default:
+      return (
+        <div className="rounded-md border border-border/50 bg-muted/30 p-3 text-xs">
+          <div className="mb-1 font-medium">Tool: {toolName}</div>
+          {(part.state === "input-streaming" || part.state === "input-available" || part.state === "approval-requested") ? (
+            <div className="text-muted-foreground">Running…</div>
+          ) : null}
+          {part.state === "output-available" ? (
+            <pre className="whitespace-pre-wrap break-all text-[11px] text-muted-foreground">
+              {typeof part.output === "string" ? part.output : JSON.stringify(part.output, null, 2)}
+            </pre>
+          ) : null}
+          {part.state === "output-error" ? (
+            <div className="text-destructive">Error: {String(part.errorText ?? "tool failed")}</div>
+          ) : null}
+        </div>
+      );
+  }
+}
diff --git a/src/components/layout/DashboardLayout.tsx b/src/components/layout/DashboardLayout.tsx
index dbd7f5cb..f41db472 100644
--- a/src/components/layout/DashboardLayout.tsx
+++ b/src/components/layout/DashboardLayout.tsx
@@ -6,6 +6,7 @@ import { WorkspaceRuntimeProvider } from "@/components/assistant-ui/WorkspaceRun
 import { WorkspaceCanvasDropzone } from "@/components/workspace-canvas/WorkspaceCanvasDropzone";
 import { AssistantDropzone } from "@/components/assistant-ui/AssistantDropzone";
 import { PANEL_DEFAULTS } from "@/lib/layout-constants";
+import { USE_NEW_CHAT } from "@/lib/chat-v2/feature-flag";
 import React from "react";
 
 interface DashboardLayoutProps {
@@ -135,7 +136,10 @@ export function DashboardLayout({
 
   if (currentWorkspaceId) {
     return (
-      <WorkspaceRuntimeProvider workspaceId={currentWorkspaceId}>
+      <WorkspaceRuntimeProvider
+        workspaceId={currentWorkspaceId}
+        disableChatRuntime={USE_NEW_CHAT}
+      >
         {content}
       </WorkspaceRuntimeProvider>
     );
diff --git a/src/lib/ai/tools/index.ts b/src/lib/ai/tools/index.ts
index d1d78b68..a57d678f 100644
--- a/src/lib/ai/tools/index.ts
+++ b/src/lib/ai/tools/index.ts
@@ -3,39 +3,30 @@
  * Factory function to create all chat tools with shared context
  */
 
-import { frontendTools } from "@assistant-ui/react-ai-sdk";
 import { createProcessUrlsTool } from "./process-urls";
-import {
-  createDocumentTool,
-  createDeleteItemTool,
-  type WorkspaceToolContext,
-} from "./workspace-tools";
+import { createDocumentTool, createDeleteItemTool, type WorkspaceToolContext } from "./workspace-tools";
 import { createEditItemTool } from "./edit-item-tool";
 import { createFlashcardsTool } from "./flashcard-tools";
 import { createQuizTool } from "./quiz-tools";
-import {
-  createSearchYoutubeTool,
-  createAddYoutubeVideoTool,
-} from "./youtube-tools";
+import { createSearchYoutubeTool, createAddYoutubeVideoTool } from "./youtube-tools";
 import { createWebSearchTool } from "./web-search";
 import { createSearchWorkspaceTool } from "./search-workspace";
 import { createReadWorkspaceTool } from "./read-workspace";
 import { createExecuteCodeTool } from "./execute-code";
-import { logger } from "@/lib/utils/logger";
 import { CHAT_TOOL } from "@/lib/ai/chat-tool-names";
+import type { Tool } from "ai";
 
 export interface ChatToolsConfig {
   workspaceId: string | null;
   userId: string | null;
   activeFolderId?: string;
   threadId?: string | null;
-  clientTools?: Record<string, any>;
+  clientTools?: Record<string, unknown>;
 }
 
-/**
- * Create all chat tools with the given context
- */
-export function createChatTools(config: ChatToolsConfig): Record<string, any> {
+export function createChatTools(
+  config: ChatToolsConfig,
+): Record<string, Tool<unknown, unknown>> {
   const ctx: WorkspaceToolContext = {
     workspaceId: config.workspaceId,
     userId: config.userId,
@@ -43,44 +34,20 @@ export function createChatTools(config: ChatToolsConfig): Record<string, any> {
     threadId: config.threadId ?? null,
   };
 
-  // Safeguard frontendTools
-  let frontendClientTools = {};
-  try {
-    frontendClientTools = frontendTools(config.clientTools || {});
-  } catch (e) {
-    logger.error("❌ frontendTools failed:", e);
-  }
-
   return {
-    // URL processing
     [CHAT_TOOL.WEB_FETCH]: createProcessUrlsTool(),
-
-    // Search
     [CHAT_TOOL.WEB_SEARCH]: createWebSearchTool(),
     [CHAT_TOOL.CODE_EXECUTE]: createExecuteCodeTool(),
     [CHAT_TOOL.WORKSPACE_SEARCH]: createSearchWorkspaceTool(ctx),
     [CHAT_TOOL.WORKSPACE_READ]: createReadWorkspaceTool(ctx),
-
-    // Workspace operations
     [CHAT_TOOL.DOCUMENT_CREATE]: createDocumentTool(ctx),
     [CHAT_TOOL.ITEM_EDIT]: createEditItemTool(ctx),
-
     [CHAT_TOOL.ITEM_DELETE]: createDeleteItemTool(ctx),
-
-    // Flashcards
     [CHAT_TOOL.FLASHCARDS_CREATE]: createFlashcardsTool(ctx),
-
-    // Quizzes
     [CHAT_TOOL.QUIZ_CREATE]: createQuizTool(ctx),
-
-    // YouTube
     [CHAT_TOOL.YOUTUBE_SEARCH]: createSearchYoutubeTool(),
     [CHAT_TOOL.YOUTUBE_ADD]: createAddYoutubeVideoTool(ctx),
-
-    // Client tools from frontend
-    ...frontendClientTools,
-  };
+  } as Record<string, Tool<unknown, unknown>>;
 }
 
-// Re-export types
 export type { WorkspaceToolContext } from "./workspace-tools";
diff --git a/src/lib/chat-v2/__tests__/branching.test.ts b/src/lib/chat-v2/__tests__/branching.test.ts
new file mode 100644
index 00000000..33c8ada6
--- /dev/null
+++ b/src/lib/chat-v2/__tests__/branching.test.ts
@@ -0,0 +1,58 @@
+import { beforeEach, describe, expect, it, vi } from "vitest";
+import { editBranchMessage, fetchBranches, switchBranch } from "@/lib/chat-v2/branches";
+
+describe("chat-v2 branching helpers", () => {
+  beforeEach(() => {
+    vi.restoreAllMocks();
+  });
+
+  it("loads sibling metadata from the branches endpoint", async () => {
+    vi.stubGlobal("fetch", vi.fn().mockResolvedValue({
+      ok: true,
+      json: async () => ({
+        siblings: [
+          { id: "m1", parentId: null, createdAt: "2024-01-01" },
+          { id: "m2", parentId: null, createdAt: "2024-01-02" },
+        ],
+        currentIndex: 1,
+      }),
+    }));
+
+    const data = await fetchBranches("thread-1", "m2");
+    expect(data.currentIndex).toBe(1);
+    expect(data.siblings).toHaveLength(2);
+  });
+
+  it("posts a branch switch request", async () => {
+    const fetchMock = vi.fn().mockResolvedValue({ ok: true, json: async () => ({ headMessageId: "m3" }) });
+    vi.stubGlobal("fetch", fetchMock);
+
+    await switchBranch("thread-1", "m2", "m3");
+
+    expect(fetchMock).toHaveBeenCalledWith(
+      "/api/threads/thread-1/messages/m2/branches",
+      expect.objectContaining({
+        method: "POST",
+        headers: { "Content-Type": "application/json" },
+        body: JSON.stringify({ targetBranchId: "m3" }),
+      }),
+    );
+  });
+
+  it("posts the edit endpoint payload", async () => {
+    const fetchMock = vi.fn().mockResolvedValue({ ok: true, json: async () => ({ newMessageId: "m4" }) });
+    vi.stubGlobal("fetch", fetchMock);
+
+    const data = await editBranchMessage("thread-1", "m2", "edited");
+
+    expect(data.newMessageId).toBe("m4");
+    expect(fetchMock).toHaveBeenCalledWith(
+      "/api/chat-v2/edit",
+      expect.objectContaining({
+        method: "POST",
+        headers: { "Content-Type": "application/json" },
+        body: JSON.stringify({ threadId: "thread-1", messageId: "m2", text: "edited" }),
+      }),
+    );
+  });
+});
diff --git a/src/lib/chat-v2/__tests__/prepare-send-messages.test.ts b/src/lib/chat-v2/__tests__/prepare-send-messages.test.ts
new file mode 100644
index 00000000..a0a51cbd
--- /dev/null
+++ b/src/lib/chat-v2/__tests__/prepare-send-messages.test.ts
@@ -0,0 +1,93 @@
+import { describe, expect, it } from "vitest";
+import { buildPrepareSendMessagesBody } from "@/lib/chat-v2/prepare-send-messages";
+import type { ChatMessage } from "@/lib/chat-v2/types";
+
+describe("buildPrepareSendMessagesBody", () => {
+  it("injects metadata onto the last user message on send", () => {
+    const messages: ChatMessage[] = [
+      { id: "u1", role: "user", parts: [{ type: "text", text: "hello" }] },
+    ];
+
+    const body = buildPrepareSendMessagesBody({
+      id: "thread-1",
+      workspaceId: "workspace-1",
+      messages,
+      trigger: "submit-message",
+      modelId: "gpt-5",
+      memoryEnabled: true,
+      activeFolderId: "folder-123",
+      selectedCardsContext: "[cards-ctx]",
+      selectedCardIds: ["a", "b"],
+      replySelections: [{ text: "quoted", title: "title" }],
+      system: "system-prompt",
+    });
+
+    expect(body.messages.at(-1)?.metadata).toEqual({
+      replySelections: [{ text: "quoted", title: "title" }],
+      selectedCards: ["a", "b"],
+    });
+    expect(body.id).toBe("thread-1");
+    expect(body.workspaceId).toBe("workspace-1");
+    expect(body.trigger).toBe("submit-message");
+    expect(body.modelId).toBe("gpt-5");
+    expect(body.memoryEnabled).toBe(true);
+    expect(body.activeFolderId).toBe("folder-123");
+    expect(body.selectedCardsContext).toBe("[cards-ctx]");
+    expect(body.system).toBe("system-prompt");
+  });
+
+  it("preserves regenerate payload shape when last message is assistant", () => {
+    const messages: ChatMessage[] = [
+      { id: "u1", role: "user", parts: [{ type: "text", text: "hello" }] },
+      { id: "a1", role: "assistant", parts: [{ type: "text", text: "world" }] },
+    ];
+
+    const body = buildPrepareSendMessagesBody({
+      id: "thread-1",
+      workspaceId: "workspace-1",
+      messages,
+      trigger: "regenerate-message",
+      messageId: "a1",
+      modelId: "model-1",
+      memoryEnabled: false,
+    });
+
+    expect(body.messageId).toBe("a1");
+    expect(body.messages).toEqual(messages);
+    expect(body.memoryEnabled).toBe(false);
+  });
+
+  it("keeps tool approval continuation messages intact", () => {
+    const messages: ChatMessage[] = [
+      {
+        id: "a1",
+        role: "assistant",
+        parts: [
+          {
+            type: "tool-web_search",
+            toolCallId: "call-1",
+            state: "approval-responded",
+            input: { query: "x" },
+            approval: { id: "approval-1", approved: true },
+          },
+        ],
+      },
+    ];
+
+    const body = buildPrepareSendMessagesBody({
+      id: "thread-1",
+      workspaceId: "workspace-1",
+      messages,
+      trigger: "submit-message",
+      messageId: "a1",
+      modelId: "model-1",
+      memoryEnabled: true,
+    });
+
+    expect(body.messages[0].parts[0]).toMatchObject({
+      type: "tool-web_search",
+      state: "approval-responded",
+    });
+    expect(body.messageId).toBe("a1");
+  });
+});
diff --git a/src/lib/chat-v2/__tests__/stream-persistence.test.ts b/src/lib/chat-v2/__tests__/stream-persistence.test.ts
new file mode 100644
index 00000000..499736a1
--- /dev/null
+++ b/src/lib/chat-v2/__tests__/stream-persistence.test.ts
@@ -0,0 +1,58 @@
+import { describe, expect, it, vi } from "vitest";
+import {
+  getNewFinishedMessages,
+  resolveInitialParentId,
+} from "@/lib/chat-v2/stream-persistence";
+import type { ChatMessage } from "@/lib/chat-v2/types";
+
+describe("stream persistence helpers", () => {
+  it("uses the regenerated assistant sibling parent id", async () => {
+    const getStoredMessageParentId = vi.fn().mockResolvedValue("u1");
+
+    const parentId = await resolveInitialParentId({
+      trigger: "regenerate-message",
+      regenerateMessageId: "a1",
+      lastMessage: {
+        id: "a1",
+        role: "assistant",
+        parts: [{ type: "text", text: "old answer" }],
+      },
+      getStoredMessageParentId,
+    });
+
+    expect(parentId).toBe("u1");
+    expect(getStoredMessageParentId).toHaveBeenCalledWith("a1");
+  });
+
+  it("filters already-validated messages before persistence", () => {
+    const validatedMessages: ChatMessage[] = [
+      { id: "u1", role: "user", parts: [{ type: "text", text: "hello" }] },
+      {
+        id: "a1",
+        role: "assistant",
+        parts: [{ type: "text", text: "old answer" }],
+      },
+    ];
+    const finishedMessages: ChatMessage[] = [
+      ...validatedMessages,
+      {
+        id: "a2",
+        role: "assistant",
+        parts: [{ type: "text", text: "new answer" }],
+      },
+    ];
+
+    const newMessages = getNewFinishedMessages({
+      finishedMessages,
+      validatedMessages,
+    });
+
+    expect(newMessages).toEqual([
+      {
+        id: "a2",
+        role: "assistant",
+        parts: [{ type: "text", text: "new answer" }],
+      },
+    ]);
+  });
+});
diff --git a/src/lib/chat-v2/branches.ts b/src/lib/chat-v2/branches.ts
new file mode 100644
index 00000000..d4a68e6e
--- /dev/null
+++ b/src/lib/chat-v2/branches.ts
@@ -0,0 +1,53 @@
+import type { BranchSiblingsResponse } from "./types";
+
+export async function fetchBranches(threadId: string, messageId: string) {
+  const response = await fetch(
+    `/api/threads/${threadId}/messages/${messageId}/branches`,
+    { cache: "no-store" },
+  );
+
+  if (!response.ok) {
+    throw new Error(await response.text());
+  }
+
+  return (await response.json()) as BranchSiblingsResponse;
+}
+
+export async function switchBranch(
+  threadId: string,
+  messageId: string,
+  targetBranchId: string,
+) {
+  const response = await fetch(
+    `/api/threads/${threadId}/messages/${messageId}/branches`,
+    {
+      method: "POST",
+      headers: { "Content-Type": "application/json" },
+      body: JSON.stringify({ targetBranchId }),
+    },
+  );
+
+  if (!response.ok) {
+    throw new Error(await response.text());
+  }
+
+  return response.json();
+}
+
+export async function editBranchMessage(
+  threadId: string,
+  messageId: string,
+  text: string,
+): Promise<{ newMessageId: string }> {
+  const response = await fetch("/api/chat-v2/edit", {
+    method: "POST",
+    headers: { "Content-Type": "application/json" },
+    body: JSON.stringify({ threadId, messageId, text }),
+  });
+
+  if (!response.ok) {
+    throw new Error(await response.text());
+  }
+
+  return response.json();
+}
diff --git a/src/lib/chat-v2/data-stream-provider.tsx b/src/lib/chat-v2/data-stream-provider.tsx
new file mode 100644
index 00000000..c00dfb21
--- /dev/null
+++ b/src/lib/chat-v2/data-stream-provider.tsx
@@ -0,0 +1,41 @@
+"use client";
+
+import type { DataUIPart } from "ai";
+import type React from "react";
+import { createContext, useContext, useMemo, useState } from "react";
+import type { CustomUIDataTypes } from "./types";
+
+type DataStreamContextValue = {
+  dataStream: DataUIPart<CustomUIDataTypes>[];
+  setDataStream: React.Dispatch<
+    React.SetStateAction<DataUIPart<CustomUIDataTypes>[]>
+  >;
+};
+
+const DataStreamContext = createContext<DataStreamContextValue | null>(null);
+
+export function DataStreamProvider({
+  children,
+}: {
+  children: React.ReactNode;
+}) {
+  const [dataStream, setDataStream] = useState<DataUIPart<CustomUIDataTypes>[]>(
+    [],
+  );
+
+  const value = useMemo(() => ({ dataStream, setDataStream }), [dataStream]);
+
+  return (
+    <DataStreamContext.Provider value={value}>
+      {children}
+    </DataStreamContext.Provider>
+  );
+}
+
+export function useDataStream() {
+  const context = useContext(DataStreamContext);
+  if (!context) {
+    throw new Error("useDataStream must be used within a DataStreamProvider");
+  }
+  return context;
+}
diff --git a/src/lib/chat-v2/feature-flag.ts b/src/lib/chat-v2/feature-flag.ts
new file mode 100644
index 00000000..6db92eaf
--- /dev/null
+++ b/src/lib/chat-v2/feature-flag.ts
@@ -0,0 +1 @@
+export const USE_NEW_CHAT = process.env.NEXT_PUBLIC_USE_NEW_CHAT === "true";
diff --git a/src/lib/chat-v2/load-thread-messages.ts b/src/lib/chat-v2/load-thread-messages.ts
new file mode 100644
index 00000000..2dcb7016
--- /dev/null
+++ b/src/lib/chat-v2/load-thread-messages.ts
@@ -0,0 +1,42 @@
+import { canonicalizeToolUIPartType } from "@/lib/ai/chat-tool-names";
+import type { ChatMessage, ThreadMessagesResponse } from "./types";
+
+function normalizeParts(message: ChatMessage): ChatMessage {
+  return {
+    ...message,
+    parts: message.parts.map((part) => {
+      if (!part.type.startsWith("tool-")) return part;
+      return {
+        ...part,
+        type: canonicalizeToolUIPartType(part.type),
+      } as typeof part;
+    }),
+  };
+}
+
+function isChatMessage(value: unknown): value is ChatMessage {
+  if (!value || typeof value !== "object") return false;
+  const candidate = value as Record<string, unknown>;
+  return (
+    typeof candidate.id === "string" &&
+    typeof candidate.role === "string" &&
+    Array.isArray(candidate.parts)
+  );
+}
+
+export async function loadThreadMessages(threadId: string): Promise<ChatMessage[]> {
+  const response = await fetch(`/api/threads/${threadId}/messages?format=ai-sdk/v6`, {
+    cache: "no-store",
+  });
+
+  if (!response.ok) {
+    throw new Error(await response.text());
+  }
+
+  const data = (await response.json()) as ThreadMessagesResponse;
+
+  return [...data.messages]
+    .map((row) => row.content)
+    .filter(isChatMessage)
+    .map(normalizeParts);
+}
diff --git a/src/lib/chat-v2/prepare-send-messages.ts b/src/lib/chat-v2/prepare-send-messages.ts
new file mode 100644
index 00000000..a0fb0a4b
--- /dev/null
+++ b/src/lib/chat-v2/prepare-send-messages.ts
@@ -0,0 +1,88 @@
+import type { PrepareSendMessagesRequest } from "ai";
+import type { ReplySelection } from "@/lib/stores/ui-store";
+import type { ChatMessage } from "./types";
+
+export interface PrepareSendMessagesBodyOptions {
+  id: string;
+  workspaceId: string;
+  messages: ChatMessage[];
+  trigger: "submit-message" | "regenerate-message";
+  messageId?: string;
+  modelId: string;
+  memoryEnabled: boolean;
+  activeFolderId?: string | null;
+  selectedCardsContext?: string;
+  selectedCardIds?: string[];
+  replySelections?: ReplySelection[];
+  system?: string;
+}
+
+export function injectMessageMetadata({
+  messages,
+  replySelections = [],
+  selectedCardIds = [],
+}: {
+  messages: ChatMessage[];
+  replySelections?: ReplySelection[];
+  selectedCardIds?: string[];
+}): ChatMessage[] {
+  if (messages.length === 0) return messages;
+
+  const nextMessages = [...messages];
+  const lastMessage = nextMessages.at(-1);
+  if (!lastMessage || lastMessage.role !== "user") {
+    return nextMessages;
+  }
+
+  nextMessages[nextMessages.length - 1] = {
+    ...lastMessage,
+    metadata: {
+      ...lastMessage.metadata,
+      ...(replySelections.length > 0 ? { replySelections } : {}),
+      ...(selectedCardIds.length > 0 ? { selectedCards: selectedCardIds } : {}),
+    },
+  };
+
+  return nextMessages;
+}
+
+export function buildPrepareSendMessagesBody(
+  options: PrepareSendMessagesBodyOptions,
+) {
+  const messages = injectMessageMetadata({
+    messages: options.messages,
+    replySelections: options.replySelections,
+    selectedCardIds: options.selectedCardIds,
+  });
+
+  return {
+    id: options.id,
+    workspaceId: options.workspaceId,
+    messages,
+    trigger: options.trigger,
+    messageId: options.messageId,
+    modelId: options.modelId,
+    memoryEnabled: options.memoryEnabled,
+    activeFolderId: options.activeFolderId ?? null,
+    selectedCardsContext: options.selectedCardsContext ?? "",
+    system: options.system ?? "",
+  };
+}
+
+export function createPrepareSendMessagesRequest(
+  getBody: () => Omit<PrepareSendMessagesBodyOptions, "id" | "messages" | "trigger" | "messageId"> & {
+    id: string;
+  },
+): PrepareSendMessagesRequest<ChatMessage> {
+  return async (options) => {
+    const current = getBody();
+    return {
+      body: buildPrepareSendMessagesBody({
+        ...current,
+        messages: options.messages,
+        trigger: options.trigger,
+        messageId: options.messageId,
+      }),
+    };
+  };
+}
diff --git a/src/lib/chat-v2/stream-persistence.ts b/src/lib/chat-v2/stream-persistence.ts
new file mode 100644
index 00000000..fa52ea9e
--- /dev/null
+++ b/src/lib/chat-v2/stream-persistence.ts
@@ -0,0 +1,32 @@
+import type { UIMessage } from "ai";
+
+type ChatTrigger = "submit-message" | "regenerate-message";
+
+export async function resolveInitialParentId({
+  trigger,
+  regenerateMessageId,
+  lastMessage,
+  getStoredMessageParentId,
+}: {
+  trigger: ChatTrigger;
+  regenerateMessageId: string | null;
+  lastMessage?: UIMessage;
+  getStoredMessageParentId: (messageId: string) => Promise<string | null>;
+}) {
+  if (trigger === "regenerate-message" && regenerateMessageId) {
+    return await getStoredMessageParentId(regenerateMessageId);
+  }
+
+  return lastMessage?.id ?? null;
+}
+
+export function getNewFinishedMessages({
+  finishedMessages,
+  validatedMessages,
+}: {
+  finishedMessages: UIMessage[];
+  validatedMessages: UIMessage[];
+}) {
+  const validatedIds = new Set(validatedMessages.map((message) => message.id));
+  return finishedMessages.filter((message) => !validatedIds.has(message.id));
+}
diff --git a/src/lib/chat-v2/types.ts b/src/lib/chat-v2/types.ts
new file mode 100644
index 00000000..4359706b
--- /dev/null
+++ b/src/lib/chat-v2/types.ts
@@ -0,0 +1,37 @@
+import type { ToolUIPart, UIMessage } from "ai";
+import type { ReplySelection } from "@/lib/stores/ui-store";
+
+export type ChatMetadata = {
+  replySelections?: ReplySelection[];
+  selectedCards?: string[];
+};
+
+export type CustomUIDataTypes = Record<string, unknown>;
+export type ChatDataTypes = CustomUIDataTypes;
+export type ChatTools = Record<string, { input: unknown; output: unknown }>;
+
+export type ChatMessage = UIMessage<ChatMetadata, ChatDataTypes, ChatTools>;
+export type ChatMessagePart = ChatMessage["parts"][number];
+export type ChatToolPart = ToolUIPart<ChatTools>;
+
+export type ThreadMessageRow = {
+  id: string;
+  parent_id: string | null;
+  format: string;
+  content: unknown;
+  created_at: string;
+};
+
+export type ThreadMessagesResponse = {
+  messages: ThreadMessageRow[];
+  headId?: string;
+};
+
+export type BranchSiblingsResponse = {
+  siblings: Array<{
+    id: string;
+    parentId: string | null;
+    createdAt: string;
+  }>;
+  currentIndex: number;
+};
diff --git a/src/lib/chat-v2/use-chat-runtime.tsx b/src/lib/chat-v2/use-chat-runtime.tsx
new file mode 100644
index 00000000..aebd561c
--- /dev/null
+++ b/src/lib/chat-v2/use-chat-runtime.tsx
@@ -0,0 +1,306 @@
+"use client";
+
+import { DefaultChatTransport, type ChatStatus } from "ai";
+import { useChat, type UseChatHelpers } from "@ai-sdk/react";
+import { createContext, useCallback, useContext, useEffect, useMemo, useRef, useState, type ReactNode, type RefObject } from "react";
+import { usePathname, useRouter, useSearchParams } from "next/navigation";
+import { toast } from "sonner";
+import { useSelectedCardIds } from "@/hooks/ui/use-selected-card-ids";
+import { formatSelectedCardsMetadata, formatWorkspaceContext } from "@/lib/utils/format-workspace-context";
+import { useUIStore } from "@/lib/stores/ui-store";
+import { useWorkspaceContext } from "@/contexts/WorkspaceContext";
+import { createPrepareSendMessagesRequest } from "./prepare-send-messages";
+import { loadThreadMessages } from "./load-thread-messages";
+import type { ChatMessage } from "./types";
+import type { Item } from "@/lib/workspace-state/types";
+import { useDataStream } from "./data-stream-provider";
+import { useShallow } from "zustand/react/shallow";
+
+export type ComposerAttachment = {
+  id: string;
+  file?: File;
+  filename: string;
+  mediaType: string;
+  url?: string;
+  isUploading: boolean;
+  uploadPromise?: Promise<void>;
+};
+
+interface ChatRuntimeContextValue {
+  workspaceId: string;
+  items: Item[];
+  threadId: string | null;
+  setThreadId: (threadId: string | null) => void;
+  messages: ChatMessage[];
+  setMessages: (messages: ChatMessage[]) => void;
+  sendMessage: UseChatHelpers<ChatMessage>["sendMessage"];
+  regenerate: UseChatHelpers<ChatMessage>["regenerate"];
+  stop: UseChatHelpers<ChatMessage>["stop"];
+  status: ChatStatus;
+  error?: Error;
+  isLoading: boolean;
+  refreshMessages: () => Promise<void>;
+  refreshMessagesIfSafe: () => Promise<void>;
+  refreshThreads: () => Promise<void>;
+  input: string;
+  setInput: (value: string) => void;
+  attachments: ComposerAttachment[];
+  setAttachments: React.Dispatch<React.SetStateAction<ComposerAttachment[]>>;
+  composerRef: RefObject<HTMLTextAreaElement | null>;
+  focusComposer: () => void;
+}
+
+const ChatRuntimeContext = createContext<ChatRuntimeContextValue | null>(null);
+
+function updateUrlThread(pathname: string, searchParams: URLSearchParams, router: ReturnType<typeof useRouter>, threadId: string | null) {
+  const nextParams = new URLSearchParams(searchParams.toString());
+  if (threadId) nextParams.set("thread", threadId);
+  else nextParams.delete("thread");
+  const query = nextParams.toString();
+  router.replace(query ? `${pathname}?${query}` : pathname, { scroll: false });
+}
+
+interface ChatRuntimeProviderProps {
+  workspaceId: string;
+  items: Item[];
+  initialThreadId: string | null;
+  onThreadSelectionChange?: (threadId: string | null) => void;
+  onThreadResolved?: (threadId: string) => void;
+  onReady?: () => void;
+  children: ReactNode;
+}
+
+export function ChatRuntimeProvider({
+  workspaceId,
+  items,
+  initialThreadId,
+  onThreadSelectionChange,
+  onThreadResolved,
+  onReady,
+  children,
+}: ChatRuntimeProviderProps) {
+  const router = useRouter();
+  const pathname = usePathname();
+  const searchParams = useSearchParams();
+  const { currentWorkspace } = useWorkspaceContext();
+  const { setDataStream } = useDataStream();
+  const composerRef = useRef<HTMLTextAreaElement | null>(null);
+  const chatIdRef = useRef<string>(initialThreadId ?? crypto.randomUUID());
+  const selectedModelId = useUIStore((state) => state.selectedModelId);
+  const memoryEnabled = useUIStore((state) => state.memoryEnabled);
+  const activeFolderId = useUIStore((state) => state.activeFolderId);
+  const replySelections = useUIStore(useShallow((state) => state.replySelections));
+  const clearReplySelections = useUIStore((state) => state.clearReplySelections);
+  const { selectedCardIdsArray: selectedCardIds } = useSelectedCardIds();
+  const activePdfPageByItemId = useUIStore(useShallow((state) => state.activePdfPageByItemId));
+  const openItems = useUIStore(useShallow((state) => state.openItems));
+  const [threadId, setThreadIdState] = useState<string | null>(initialThreadId);
+  const [isLoading, setIsLoading] = useState(Boolean(initialThreadId));
+  const [input, setInput] = useState("");
+  const [attachments, setAttachments] = useState<ComposerAttachment[]>([]);
+  const refreshThreadsRef = useRef<() => Promise<void>>(async () => {});
+  const refreshTokenRef = useRef(0);
+  const ensureThreadRef = useRef<() => Promise<string>>(async () => {
+    throw new Error("Chat runtime not initialized");
+  });
+  const statusRef = useRef<ChatStatus>("ready");
+
+  useEffect(() => {
+    setThreadIdState(initialThreadId);
+  }, [initialThreadId]);
+
+  const viewingItemIds = useMemo(() => {
+    const ids = new Set<string>();
+    if (openItems.primary) ids.add(openItems.primary);
+    if (openItems.secondary) ids.add(openItems.secondary);
+    return ids;
+  }, [openItems.primary, openItems.secondary]);
+
+  const selectedCardsContext = useMemo(() => {
+    const selectedItems = items.filter((item) => selectedCardIds.includes(item.id));
+    return formatSelectedCardsMetadata(selectedItems, items, activePdfPageByItemId, viewingItemIds);
+  }, [activePdfPageByItemId, items, selectedCardIds, viewingItemIds]);
+
+  const systemPrompt = useMemo(() => formatWorkspaceContext(items, currentWorkspace?.name), [currentWorkspace?.name, items]);
+  const dynamicStateRef = useRef({ selectedModelId, memoryEnabled, activeFolderId, replySelections, selectedCardIds, selectedCardsContext, systemPrompt });
+
+  useEffect(() => {
+    dynamicStateRef.current = { selectedModelId, memoryEnabled, activeFolderId, replySelections, selectedCardIds, selectedCardsContext, systemPrompt };
+  }, [activeFolderId, memoryEnabled, replySelections, selectedCardIds, selectedCardsContext, selectedModelId, systemPrompt]);
+
+  const setThreadId = useCallback((nextThreadId: string | null) => {
+    setThreadIdState(nextThreadId);
+    onThreadSelectionChange?.(nextThreadId);
+    updateUrlThread(pathname, new URLSearchParams(searchParams.toString()), router, nextThreadId);
+  }, [onThreadSelectionChange, pathname, router, searchParams]);
+
+  const handleChatError = useCallback((error: Error) => {
+    console.error("[Chat Error]", error);
+    const extendedError = error as Error & { responseBody?: string; data?: { error?: { message?: string } } };
+    const errorMessage = error.message?.toLowerCase() || "";
+    const responseBody = extendedError.responseBody?.toLowerCase() || "";
+    const errorData = extendedError.data?.error?.message?.toLowerCase() || "";
+    const combinedMessage = `${errorMessage} ${responseBody} ${errorData}`.toLowerCase();
+    const show = (title: string, description: string) => toast.error(title, { description });
+
+    if (combinedMessage.includes("timeout") || combinedMessage.includes("504") || combinedMessage.includes("gateway")) {
+      show("Request timed out", "The AI is taking too long to respond. Please try again.");
+    } else if (combinedMessage.includes("network") || combinedMessage.includes("fetch") || combinedMessage.includes("failed to fetch")) {
+      show("Connection error", "Unable to reach the server. Please check your connection.");
+    } else if (combinedMessage.includes("500") || combinedMessage.includes("internal server")) {
+      show("Server error", "Something went wrong on our end. Please try again.");
+    } else if (combinedMessage.includes("429") || combinedMessage.includes("rate limit")) {
+      show("Rate limited", "Too many requests. Please wait a moment and try again.");
+    } else if (combinedMessage.includes("401") || combinedMessage.includes("unauthorized")) {
+      show("Authentication error", "Your session may have expired. Please refresh the page.");
+    } else if (
+      combinedMessage.includes("api key not valid") ||
+      combinedMessage.includes("api_key_invalid") ||
+      combinedMessage.includes("api key not defined") ||
+      combinedMessage.includes("api key is not set") ||
+      (combinedMessage.includes("api key") && (combinedMessage.includes("not valid") || combinedMessage.includes("invalid")))
+    ) {
+      show("API key not valid", "Please check your GOOGLE_GENERATIVE_AI_API_KEY in your environment variables.");
+    } else {
+      show("Something went wrong", error.message || "An unexpected error occurred. Please try again.");
+    }
+  }, []);
+
+  const { messages, setMessages: setMessagesRaw, sendMessage: sendMessageRaw, status, stop, regenerate, error } = useChat<ChatMessage>({
+    id: chatIdRef.current,
+    messages: [],
+    generateId: () => crypto.randomUUID(),
+    transport: new DefaultChatTransport<ChatMessage>({
+      api: "/api/chat-v2",
+      prepareSendMessagesRequest: async (options) => {
+        const resolvedThreadId = await ensureThreadRef.current();
+        return createPrepareSendMessagesRequest(() => ({
+          id: resolvedThreadId,
+          workspaceId,
+          modelId: dynamicStateRef.current.selectedModelId,
+          memoryEnabled: dynamicStateRef.current.memoryEnabled,
+          activeFolderId: dynamicStateRef.current.activeFolderId,
+          selectedCardsContext: dynamicStateRef.current.selectedCardsContext,
+          selectedCardIds: dynamicStateRef.current.selectedCardIds,
+          replySelections: dynamicStateRef.current.replySelections,
+          system: dynamicStateRef.current.systemPrompt,
+        }))({ ...options, id: resolvedThreadId });
+      },
+    }),
+    onData: (dataPart) => {
+      setDataStream((current) => [...current, dataPart]);
+    },
+    onError: handleChatError,
+    onFinish: async () => {
+      await refreshThreadsRef.current();
+    },
+  });
+  // TODO: sendAutomaticallyWhen once chat-v2 supports tool approval continuations.
+  // TODO: useAutoResume when chat-v2 adopts resumable streams.
+
+  useEffect(() => {
+    statusRef.current = status;
+  }, [status]);
+
+  const setMessages = useCallback((nextMessages: ChatMessage[]) => {
+    setMessagesRaw(nextMessages);
+  }, [setMessagesRaw]);
+
+  const refreshMessages = useCallback(async () => {
+    const token = ++refreshTokenRef.current;
+    const loadingThreadId = threadId;
+    if (!loadingThreadId) {
+      setMessages([]);
+      setIsLoading(false);
+      return;
+    }
+
+    setIsLoading(true);
+    try {
+      const loadedMessages = await loadThreadMessages(loadingThreadId);
+      if (token !== refreshTokenRef.current || loadingThreadId !== threadId || statusRef.current === "streaming" || statusRef.current === "submitted") return;
+      setMessages(loadedMessages);
+    } finally {
+      if (token === refreshTokenRef.current) setIsLoading(false);
+    }
+  }, [setMessages, threadId]);
+
+  const refreshMessagesIfSafe = useCallback(async () => {
+    if (statusRef.current === "streaming" || statusRef.current === "submitted") return;
+    await refreshMessages();
+  }, [refreshMessages]);
+
+  useEffect(() => {
+    void refreshMessages();
+  }, [refreshMessages]);
+
+  useEffect(() => {
+    if (!isLoading) onReady?.();
+  }, [isLoading, onReady]);
+
+  ensureThreadRef.current = async () => {
+    if (threadId) return threadId;
+    const response = await fetch("/api/threads", {
+      method: "POST",
+      headers: { "Content-Type": "application/json" },
+      body: JSON.stringify({ workspaceId }),
+    });
+    if (!response.ok) throw new Error(await response.text());
+    const data = (await response.json()) as { id: string };
+    setThreadIdState(data.id);
+    onThreadResolved?.(data.id);
+    updateUrlThread(pathname, new URLSearchParams(searchParams.toString()), router, data.id);
+    return data.id;
+  };
+
+  const refreshThreads = useCallback(async () => {
+    await fetch(`/api/threads?workspaceId=${workspaceId}`, { cache: "no-store" });
+  }, [workspaceId]);
+
+  useEffect(() => {
+    refreshThreadsRef.current = refreshThreads;
+  }, [refreshThreads]);
+
+  const sendMessage = useCallback<ChatRuntimeContextValue["sendMessage"]>(async (message, options) => {
+    await sendMessageRaw(message, options);
+    clearReplySelections();
+    setInput("");
+    setAttachments([]);
+  }, [clearReplySelections, sendMessageRaw]);
+
+  const focusComposer = useCallback(() => {
+    composerRef.current?.focus();
+  }, []);
+
+  const value = useMemo<ChatRuntimeContextValue>(() => ({
+    workspaceId,
+    items,
+    threadId,
+    setThreadId,
+    messages,
+    setMessages,
+    sendMessage,
+    regenerate,
+    stop,
+    status,
+    error,
+    isLoading,
+    refreshMessages,
+    refreshMessagesIfSafe,
+    refreshThreads,
+    input,
+    setInput,
+    attachments,
+    setAttachments,
+    composerRef,
+    focusComposer,
+  }), [attachments, error, focusComposer, input, isLoading, items, messages, refreshMessages, refreshMessagesIfSafe, refreshThreads, regenerate, sendMessage, setMessages, setThreadId, status, stop, threadId, workspaceId]);
+
+  return <ChatRuntimeContext.Provider value={value}>{children}</ChatRuntimeContext.Provider>;
+}
+
+export function useChatRuntime() {
+  const context = useContext(ChatRuntimeContext);
+  if (!context) throw new Error("useChatRuntime must be used inside ChatRuntimeProvider");
+  return context;
+}