docs/src/components/chat/message-formatter.tsx (1)

241-249: Consolidate duplicate replacements and handle more URL variants.

The two includes(...).replace(...) calls can be collapsed into one regex to handle http://, https://, //, and www. variants in a single pass. The diff above already does this using a case-insensitive regex.

docs/src/app/api/chat/route.ts (2)

15-15: Avoid double logging of errors.

getErrorMessage logs, and the catch below logs again. Keep logging in one place to prevent noisy logs.

Apply this diff to remove the early console log:

 function getErrorMessage(error: unknown): string {
-  console.log('Error in chat API:', error);
   if (error instanceof Error) {
     return error.message;
   }
   return String(error);
 }

---

34-101: System prompt: enforce docs domain consistency and rate considerations.

The prompt mandates fetching docs for “every question.” This can increase latency and server load. Consider softening to “when a docs reference would materially improve the answer” and keep the canonical domain https://docs.stack-auth.com (already aligned with MessageFormatter).

docs/src/components/chat/ai-chat.tsx (2)

203-209: Auto-scroll to latest message looks good; consider scroll-behavior guard.

This pattern is fine. If you notice jank on rapid streams, debounce the scroll or only scroll when the user is near the bottom.

Also applies to: 450-452

---

241-275: Webhook payload contains PII-ish fields; confirm policy and user consent.

You send userAgent, pathname, timestamps, and session identifiers to Discord. Ensure this aligns with your privacy policy and explicitly inform users.

If needed, I can add:

• a small UI notice/toggle for telemetry consent,
• redaction of userAgent,
• hashing of sessionId.

Say the word and I’ll patch it.

Configuration used: CodeRabbit UI

Review profile: CHILL

Plan: Pro

💡 Knowledge Base configuration:

• MCP integration is disabled by default for public repositories
• Jira integration is disabled by default for public repositories
• Linear integration is disabled by default for public repositories

You can enable these sources in your CodeRabbit configuration.

docs/package.json (1)

25-25: Please manually verify dependency compatibility and clean build

Upgrading @modelcontextprotocol/sdk to ^1.17.2 and ai to ^4.3.17 should align with the new MCP client usage and useChat API, but our CI install/typecheck failed with missing modules and errors. To ensure nothing is broken, please:

• Install dependencies with your project’s package manager (pnpm or npm) and confirm no peer-dependency warnings:

  pnpm install --ignore-scripts     # or npm install --ignore-scripts

• Verify that @ai-sdk/react@^1.2.12, ai@^4.3.17, and @modelcontextprotocol/sdk@^1.17.2 resolve correctly:

  pnpm ls ai @ai-sdk/react @modelcontextprotocol/sdk    # or npm ls ai @ai-sdk/react @modelcontextprotocol/sdk

• Typecheck the docs app to ensure no runtime or type errors:

  pnpm run -w docs typecheck        # or npm run -w docs typecheck
  # fallback:
  npx tsc -p docs/tsconfig.json --noEmit

Once these steps pass without warnings or errors, the dependency bump can be considered safe.

Also applies to: line 36.

docs/src/app/api/chat/route.ts (2)

105-109: Pass tools directly; avoid spreading in case of array return type.

If stackAuthMcp.tools() returns an object keyed by tool name, spreading is unnecessary. If it returns an array, spreading produces numeric keys and breaks tool resolution. Pass tools as-is.

Apply this diff:

-      tools: {
-        ...tools,
-      },
+      tools,

If TS complains, assert the correct type or transform the array to a name-keyed object:

const toolsRecord = Array.isArray(tools)
  ? Object.fromEntries(tools.map((t: any) => [t.name, t]))
  : tools;

---

23-31: Guard JSON parsing and ensure MCP client cleanup

Please wrap the request body parse and MCP client initialization in a try/catch, default messages to an empty array, and—if the client exposes a close() method—shut it down in a finally block. Verify whether createMCPClient supports explicit disposal and adjust the finally accordingly.

• File: docs/src/app/api/chat/route.ts
– Surround const { messages } = await request.json() and the MCP client creation in a try/catch.
– Replace direct destructuring with a safe parse that falls back to {} and validates messages as an array.
– After returning the response, add a finally block to invoke (stackAuthMcp as any)?.close?.().

Suggested diff:

 export async function POST(request: Request) {
-  const { messages } = await request.json();
-
-  // Create MCP client for Stack Auth documentation
-  const stackAuthMcp = await createMCPClient({
-    transport: new StreamableHTTPClientTransport(
-      new URL('https://mcp.stack-auth.com/api/internal/mcp')
-    ),
-  });
-  const tools = await stackAuthMcp.tools();
+  let stackAuthMcp;
+  try {
+    const body = await request.json().catch(() => ({}));
+    const messages = Array.isArray(body?.messages) ? body.messages : [];
+
+    // Create MCP client for Stack Auth documentation
+    stackAuthMcp = await createMCPClient({
+      transport: new StreamableHTTPClientTransport(
+        new URL('https://mcp.stack-auth.com/api/internal/mcp')
+      ),
+    });
+    const tools = await stackAuthMcp.tools();
+
+    // …rest of your handler using `messages` and `tools`
+  } catch (err) {
+    return new Response('Invalid request or MCP error', { status: 400 });
+  } finally {
+    try { (stackAuthMcp as any)?.close?.(); } catch {}
+  }
 }

docs/src/components/chat/ai-chat.tsx (3)

81-83: Refs addition LGTM.

Using refs for the contentEditable and end-of-messages anchor is appropriate for sync and scrolling.

---

427-441: “Thinking” banner UX looks good.

Clear and unobtrusive. Nice touch with subtle animation and brand icon.

---

413-419: Tool invocation rendering is a solid UX addition.

Showing the fetched doc title and a deep link improves trust and traceability.

docs/src/app/api/chat/route.ts (1)

25-46: Good: Robust MCP bootstrap with 503 fallback.
This resolves the earlier “missing error handling” concern for MCP initialization. Returning a 503 with a user-facing explanation is a solid choice here.

docs/src/app/api/chat/route.ts (6)

15-15: Use console.error (and avoid duplicate logging) in error helper.
getErrorMessage currently logs with console.log and you also log again in the catch block below; this can double-log. Prefer console.error here or remove logging from this helper.

 function getErrorMessage(error: unknown): string {
-  console.log('Error in chat API:', error);
+  console.error('Error in chat API:', error);
   if (error instanceof Error) {
     return error.message;
   }
   return String(error);
 }

---

25-33: Make MCP base URL configurable.
Hardcoding https://mcp.stack-auth.com makes environment switches harder. Read from an env var with a sensible default.

-    const stackAuthMcp = await createMCPClient({
-      transport: new StreamableHTTPClientTransport(
-        new URL('/api/internal/mcp', 'https://mcp.stack-auth.com')
-      ),
-    });
+    const mcpBase = process.env.MCP_HTTP_BASE ?? 'https://mcp.stack-auth.com';
+    const stackAuthMcp = await createMCPClient({
+      transport: new StreamableHTTPClientTransport(
+        new URL('/api/internal/mcp', mcpBase)
+      ),
+    });

---

25-34: Type tools explicitly (and consider lightweight caching).
Typing avoids “{} is not assignable to Tools” friction and helps IDEs. Also, fetching tool descriptors on every request can be avoided with a short TTL cache.

-  let tools = {};
+  import type { Tool } from 'ai';
+  let tools: Record<string, Tool> = {};
   try {
     const stackAuthMcp = await createMCPClient({
       transport: new StreamableHTTPClientTransport(
         new URL('/api/internal/mcp', 'https://mcp.stack-auth.com')
       ),
     });
-    tools = await stackAuthMcp.tools();
+    // Optional: cache across requests (module-scope) with a TTL
+    tools = await stackAuthMcp.tools();

If you’d like, I can provide a small module-scope TTL cache snippet.

---

49-116: Prompt copy is strong; minor brand/UX nits.

• “As an AI…” phrasing can read robotic; consider omitting to keep brand voice tight.
• “ALWAYS use the available tools” can dead-end if tools are intentionally pruned; consider “default to” tools with allowance to answer from memory when appropriate.

---

120-128: Propagate request abort; align streaming with client disconnects.
Pass the request.signal to streamText so upstream calls are cancelled if the client disconnects.

   try {
-    const result = streamText({
+    const result = streamText({
       model: google('gemini-2.5-flash'),
       tools: {
         ...tools,
       },
       maxSteps: 50,
       system: systemPrompt,
       messages,
       temperature: 0.1,
+      abortSignal: (request as any).signal ?? undefined,
     });

Note: on the edge runtime Request has a signal; casting keeps TS happy in Node runtimes too.

---

9-11: Optional: fail fast if GOOGLE_AI_API_KEY is missing.
This prevents a harder-to-diagnose error later when calling the model.

 const google = createGoogleGenerativeAI({
-  apiKey: process.env.GOOGLE_AI_API_KEY,
+  apiKey: process.env.GOOGLE_AI_API_KEY ?? '',
 });
+if (!process.env.GOOGLE_AI_API_KEY) {
+  console.warn('GOOGLE_AI_API_KEY is not set; chat route will fail at runtime.');
+}

If you prefer, short-circuit in POST with a 500 and actionable message.

docs/src/components/chat/ai-chat.tsx (6)

55-63: Optional: build doc link via URL for extra safety.
This avoids subtle path concatenation bugs and normalizes // and missing slashes.

-            href={`https://docs.stack-auth.com${docId.startsWith('/') ? docId : `/${docId}`}`}
+            href={new URL(docId?.startsWith('/') ? docId : `/${docId ?? ''}`, 'https://docs.stack-auth.com').toString()}

---

199-205: Auto-scroll only when user is near the bottom.
Current behavior can yank the view while the user scrolls history. Track scroll position and only scroll if the user hasn’t scrolled up.

I can provide a small hook (useAutoscroll) that observes scrollTop and clientHeight to decide when to scroll.

---

315-317: Simplify: call handleSubmit() directly; no need to fake an event.
useChat’s handleSubmit accepts an optional event; passing {} is unnecessary.

-  const handleSubmitSafely = () => {
-    runAsynchronously(() => handleChatSubmit({} as React.FormEvent));
-  };
+  const handleSubmitSafely = () => {
+    runAsynchronously(() => handleChatSubmit(undefined as unknown as React.FormEvent));
+  };

Or even cleaner, change handleChatSubmit to call handleSubmit() with no args and update the onClick/onKeyDown sites accordingly:

-    handleSubmit(e);
+    handleSubmit();

---

452-491: Accessibility: add ARIA to contentEditable input.
contentEditable lacks native input semantics. Add role, aria-multiline, and an aria-label for screen readers.

               <div
                 ref={editableRef}
                 contentEditable
                 suppressContentEditableWarning={true}
+                role="textbox"
+                aria-multiline="true"
+                aria-label="Ask about Stack Auth"
                 className="text-primary w-full resize-none border-none bg-transparent shadow-none outline-none focus-visible:ring-0 focus-visible:ring-offset-0 text-sm empty:before:content-[attr(data-placeholder)] empty:before:text-fd-muted-foreground"

---

411-416: Harden against unexpected toolInvocations shape.
Guard with Array.isArray to avoid rendering errors if a provider changes the shape.

-                    {message.toolInvocations?.map((toolCall, index) => (
+                    {Array.isArray((message as any).toolInvocations) &&
+                     (message as any).toolInvocations.map((toolCall: any, index: number) => (
                       <ToolCallDisplay key={index} toolCall={toolCall} />
                     ))}

---

261-270: Optional: handle non-2xx Discord responses.
A failing webhook currently logs only on network error; surface 4xx/5xx too.

-      await fetch('/api/discord-webhook', {
+      const resp = await fetch('/api/discord-webhook', {
         method: 'POST',
         headers: {
           'Content-Type': 'application/json',
         },
         body: JSON.stringify(context),
       });
+      if (!resp.ok) {
+        console.error('Discord webhook responded with', resp.status);
+      }

Same for sendAIResponseToDiscord.

Configuration used: CodeRabbit UI

Review profile: CHILL

Plan: Pro

💡 Knowledge Base configuration:

• MCP integration is disabled by default for public repositories
• Jira integration is disabled by default for public repositories
• Linear integration is disabled by default for public repositories

You can enable these sources in your CodeRabbit configuration.

Learnt from: CR
PR: stack-auth/stack-auth#0
File: CLAUDE.md:0-0
Timestamp: 2025-08-04T22:25:51.260Z
Learning: Applies to apps/backend/src/app/api/latest/**/* : The project uses a custom route handler system in the backend for consistent API responses

docs/src/app/api/chat/route.ts (1)

2-3: MCP + AI imports look correct and consistent with the dependency bumps.
The switch to StreamableHTTPClientTransport and experimental_createMCPClient aligns with the PR’s goal.

docs/src/components/chat/ai-chat.tsx (1)

26-69: ToolCallDisplay overall: nice, and prior console.log concerns are resolved.

Console logging was removed, optional chaining added, and link rendering is clean. With the chaining and URL fix above, this looks solid.

docs/src/components/chat/ai-chat.tsx (7)

412-416: Prefer stable keys over array index for tool invocations.

Index keys can cause reconciliation issues on interleaved tool calls; a composite key is available.

Apply:

-                    {message.toolInvocations?.map((toolCall, index) => (
-                      <ToolCallDisplay key={index} toolCall={toolCall} />
-                    ))}
+                    {message.toolInvocations?.map((toolCall, index) => (
+                      <ToolCallDisplay
+                        key={`${toolCall.toolName}:${toolCall.args?.id ?? index}`}
+                        toolCall={toolCall}
+                      />
+                    ))}

---

206-212: Avoid caret jumps when syncing contentEditable with state.

Overwriting textContent while the element is focused will move the caret to the end. Guard against clobbering during active edits.

Apply:

-  useEffect(() => {
-    if (editableRef.current && editableRef.current.textContent !== input) {
-      editableRef.current.textContent = input;
-    }
-  }, [input]);
+  useEffect(() => {
+    const el = editableRef.current;
+    if (!el) return;
+    if (document.activeElement === el) return; // don't clobber caret while typing
+    if (el.textContent !== input) {
+      el.textContent = input;
+    }
+  }, [input]);

---

195-196: Telemetry model value may be stale; avoid hard-coding.

You’re logging the AI response to Discord here. The helper currently hard-codes model: 'gemini-2.0-flash'. Given this PR switches to MCP and, per PR notes, Gemini 2.5 may be in use, this can mislead analytics. Either omit the model, or plumb the actual model name from the backend response if available.

Suggested change (in sendAIResponseToDiscord body):

-          sessionId: sessionId,
-          model: 'gemini-2.0-flash',
+          sessionId: sessionId,
+          // model: supplied by server; omit here to avoid drift

---

237-271: Confirm consent before sending user messages + metadata to Discord.

This ships user prompts, userAgent, and path to /api/discord-webhook. Ensure this is disclosed and gated (e.g., env flag or an in-UI opt-in).

Lightweight pattern:

• Gate behind NEXT_PUBLIC_ENABLE_AI_TELEMETRY === 'true'.
• Provide a toggle in the drawer footer and remember via localStorage.
• Strip userAgent unless strictly necessary.

I can open a follow-up PR to add the flag and toggle if you’d like.

---

426-435: A11y: Announce the “Thinking” state to screen readers.

Add role="status" and aria-live="polite" to the container so assistive tech is notified of progress.

Apply:

-              <div className="rounded-lg bg-fd-muted border border-fd-border p-3">
+              <div
+                className="rounded-lg bg-fd-muted border border-fd-border p-3"
+                role="status"
+                aria-live="polite"
+              >

---

199-205: Auto-scroll only on assistant messages to avoid interrupting the user.

Current effect scrolls on any message change, including when the user is typing or editing past messages. Consider scrolling when the last message is from the assistant.

Example:

-  useEffect(() => {
-    if (messagesEndRef.current) {
-      messagesEndRef.current.scrollIntoView({ behavior: 'smooth' });
-    }
-  }, [messages]);
+  useEffect(() => {
+    const last = messages[messages.length - 1];
+    if (last?.role !== 'assistant') return;
+    messagesEndRef.current?.scrollIntoView({ behavior: 'smooth' });
+  }, [messages]);

---

291-307: Hoist static starterPrompts outside the component.

It’s re-created every render. Minor, but easy to avoid.

Move the array to module scope and reference it inside the component.

Configuration used: CodeRabbit UI

Review profile: CHILL

Plan: Pro

💡 Knowledge Base configuration:

• MCP integration is disabled by default for public repositories
• Jira integration is disabled by default for public repositories
• Linear integration is disabled by default for public repositories

You can enable these sources in your CodeRabbit configuration.