perf(chat): reduce input rerender overhead in conversation shell

Memoize ChatInput to minimize unnecessary updates in the chat input area during frequent parent renders.

Compute localized Claude API retry banner text lazily and only when retry state is present.

src/components/chat/chat-input.tsx

@@ -1,5 +1,6 @@
 "use client"
 
+import { memo } from "react"
 import { useTranslations } from "next-intl"
 import type {
   AgentType,
@@ -48,7 +49,7 @@ interface ChatInputProps {
   onForkSend?: (draft: PromptDraft, modeId?: string | null) => void
 }
 
-export function ChatInput({
+export const ChatInput = memo(function ChatInput({
   status,
   promptCapabilities,
   defaultPath,
@@ -138,4 +139,6 @@ export function ChatInput({
       />
     </div>
   )
-}
+})
+
+ChatInput.displayName = "ChatInput"

src/components/chat/conversation-shell.tsx

@@ -1,4 +1,4 @@
-import type { ReactNode } from "react"
+import { useMemo, type ReactNode } from "react"
 import { useTranslations } from "next-intl"
 import type {
   AgentType,
@@ -104,29 +104,27 @@ export function ConversationShell({
   onForkSend,
 }: ConversationShellProps) {
   const tAcp = useTranslations("Folder.chat.acpConnections")
+  const retryLineText = useMemo(() => {
     const retry = claudeApiRetry
-  const retryAttemptRaw = retry?.attempt
-  const retryMaxRaw = retry?.maxRetries
-  const retryDelayMsRaw = retry?.retryDelayMs
-  const retryErrorStatusRaw = retry?.errorStatus
+    if (!retry) return null
 
     const retryAttempt =
-    retryAttemptRaw !== null && retryAttemptRaw !== undefined
-      ? Math.trunc(retryAttemptRaw)
+      retry.attempt !== null && retry.attempt !== undefined
+        ? Math.trunc(retry.attempt)
         : null
     const retryMax =
-    retryMaxRaw !== null && retryMaxRaw !== undefined
-      ? Math.trunc(retryMaxRaw)
+      retry.maxRetries !== null && retry.maxRetries !== undefined
+        ? Math.trunc(retry.maxRetries)
         : null
     const retryDelaySeconds =
-    retryDelayMsRaw !== null && retryDelayMsRaw !== undefined
-      ? (retryDelayMsRaw / 1000).toFixed(1)
+      retry.retryDelayMs !== null && retry.retryDelayMs !== undefined
+        ? (retry.retryDelayMs / 1000).toFixed(1)
         : null
-  const errorLabel = retry?.error ?? tAcp("claudeApiRetry.fallbackError")
+    const errorLabel = retry.error ?? tAcp("claudeApiRetry.fallbackError")
     const statusLabel =
-    retryErrorStatusRaw !== null && retryErrorStatusRaw !== undefined
+      retry.errorStatus !== null && retry.errorStatus !== undefined
         ? tAcp("claudeApiRetry.httpStatus", {
-          status: Math.trunc(retryErrorStatusRaw),
+            status: Math.trunc(retry.errorStatus),
           })
         : ""
     const retryLabel =
@@ -146,8 +144,8 @@ export function ConversationShell({
             seconds: retryDelaySeconds,
           })
         : null
-  const retryLineText =
-    delayLabel !== null
+
+    return delayLabel !== null
       ? tAcp("claudeApiRetry.lineWithDelay", {
           error: errorLabel,
           status: statusLabel,
@@ -159,6 +157,7 @@ export function ConversationShell({
           status: statusLabel,
           retry: retryLabel,
         })
+  }, [claudeApiRetry, tAcp])
 
   return (
     <div className="flex h-full min-h-0 flex-col">
@@ -207,7 +206,7 @@ export function ConversationShell({
         />
       )}
 
-      {claudeApiRetry && (
+      {retryLineText && (
         <div className="border-t border-destructive/20 bg-destructive/5 px-4 py-2 text-xs text-destructive">
           <div className="flex items-center gap-2 font-medium">
             <Loader2 className="h-3.5 w-3.5 animate-spin" />