perf: memo CodeBlockViewer, DiffViewer, CompactBoundary

These are the most expensive render components (syntax highlighting, diff
computation) — memoizing them prevents re-renders when parent tool items
toggle expand/collapse or parent chat group updates.

src/renderer/components/chat/CompactBoundary.tsx

@@ -1,4 +1,4 @@
-import React, { useState } from 'react';
+import React, { memo, useState } from 'react';
 import ReactMarkdown from 'react-markdown';
 
 import {
@@ -28,9 +28,9 @@ interface CompactBoundaryProps {
  * CompactBoundary displays a horizontal divider indicating where
  * the conversation was compacted. Click to expand the compacted summary.
  */
-export const CompactBoundary = ({
+export const CompactBoundary = memo(function CompactBoundary({
   compactGroup,
-}: Readonly<CompactBoundaryProps>): React.JSX.Element => {
+}: Readonly<CompactBoundaryProps>): React.JSX.Element {
   const { timestamp, message } = compactGroup;
   const [isExpanded, setIsExpanded] = useState(false);
 
@@ -166,4 +166,4 @@ export const CompactBoundary = ({
       )}
     </div>
   );
-};
+});

src/renderer/components/chat/viewers/CodeBlockViewer.tsx

@@ -1,4 +1,4 @@
-import React, { useMemo, useState } from 'react';
+import React, { memo, useMemo, useState } from 'react';
 
 import { getBaseName } from '@renderer/utils/pathUtils';
 import { createLogger } from '@shared/utils/logger';
@@ -117,14 +117,14 @@ function inferLanguage(fileName: string): string {
 // Component
 // =============================================================================
 
-export const CodeBlockViewer: React.FC<CodeBlockViewerProps> = ({
+export const CodeBlockViewer = memo(function CodeBlockViewer({
   fileName,
   content,
   language,
   startLine = 1,
   endLine,
   maxHeight = 'max-h-96',
-}): React.JSX.Element => {
+}: CodeBlockViewerProps): React.JSX.Element {
   const [isCopied, setIsCopied] = useState(false);
 
   // Infer language from file extension if not provided
@@ -241,4 +241,4 @@ export const CodeBlockViewer: React.FC<CodeBlockViewerProps> = ({
       </div>
     </div>
   );
-};
+});

src/renderer/components/chat/viewers/DiffViewer.tsx

@@ -1,4 +1,4 @@
-import React, { useMemo } from 'react';
+import React, { memo, useMemo } from 'react';
 
 import {
   CODE_BG,
@@ -349,14 +349,14 @@ const DiffLineRow: React.FC<DiffLineRowProps> = ({ line, highlightedHtml }): Rea
 // Main Component
 // =============================================================================
 
-export const DiffViewer: React.FC<DiffViewerProps> = ({
+export const DiffViewer = memo(function DiffViewer({
   fileName,
   oldString,
   newString,
   maxHeight = 'max-h-96',
   tokenCount,
   syntaxHighlight = false,
-}): React.JSX.Element => {
+}: DiffViewerProps): React.JSX.Element {
   // Compute diff
   const oldLines = oldString.split(/\r?\n/);
   const newLines = newString.split(/\r?\n/);
@@ -456,4 +456,4 @@ export const DiffViewer: React.FC<DiffViewerProps> = ({
       </div>
     </div>
   );
-};
+});