Fix ESLint errors in page components

Remove unused imports and variables. Drop bindings from catch clauses.
Use const where variables are never reassigned. Remove unused map
callback parameters. Escape apostrophes in JSX text.

Co-Authored-By: Claude Opus 4.6 (1M context) <noreply@anthropic.com>

Author: ambv

frontend/src/app/about/page.tsx

@@ -56,7 +56,7 @@ export default function AboutPage() {
       try {
         const users = await api.getMaintainers();
         setAdminUsers(users.filter((user) => user.is_active));
-      } catch (error) {
+      } catch {
         // Fallback to hardcoded admin if API fails
         setAdminUsers([
           {
@@ -248,7 +248,7 @@ export default function AboutPage() {
             </CardHeader>
             <CardContent>
               <p className="text-muted-foreground">
-                Powered by Memray's flamegraph generation, explore exactly where
+                Powered by Memray&apos;s flamegraph generation, explore exactly where
                 memory is allocated in the CPython codebase. Click through call
                 stacks, zoom into specific functions, and identify memory
                 hotspots.
@@ -265,7 +265,7 @@ export default function AboutPage() {
             </CardHeader>
             <CardContent>
               <p className="text-muted-foreground">
-                Access memory profiling data for any commit in CPython's
+                Access memory profiling data for any commit in CPython&apos;s
                 history. Compare commits across weeks, months, or years to
                 understand long-term memory usage trends and validate that
                 optimizations have lasting impact.
@@ -331,7 +331,7 @@ export default function AboutPage() {
         <CardContent className="prose prose-lg prose-neutral dark:prose-invert max-w-none text-center">
           <p>
             CPython Memory Insights is built on top of <strong>Memray</strong>,
-            Bloomberg's powerful memory profiler for Python. Memray provides the
+            Bloomberg&apos;s powerful memory profiler for Python. Memray provides the
             core profiling capabilities that enable tracking memory allocations
             with minimal overhead and generate detailed flamegraphs for
             analysis.
@@ -358,7 +358,7 @@ export default function AboutPage() {
           </CardTitle>
         </CardHeader>
         <CardContent className="space-y-4">
-          {faqItems.map((item, index) => (
+          {faqItems.map((item) => (
             <Collapsible
               key={item.question}
               open={openFAQ === item.question}

frontend/src/app/binaries/[id]/page.tsx

@@ -68,7 +68,7 @@ interface EnvironmentCardProps {
 }
 
 function EnvironmentCard({
-  binary,
+  binary: _binary,
   binaryId,
   environment,
   commits,

frontend/src/app/build-comparison/page.tsx

@@ -58,7 +58,6 @@ import type {
 import { METRIC_OPTIONS } from '@/lib/types';
 import { api } from '@/lib/api';
 import { ScrollArea } from '@/components/ui/scroll-area';
-import { Badge } from '@/components/ui/badge';
 import { Slider } from '@/components/ui/slider';
 import { useToast } from '@/hooks/use-toast';
 
@@ -279,7 +278,7 @@ export default function BuildComparisonPage() {
 
         for (const [key, trends] of Object.entries(batchResponse.results)) {
           // Extract binary ID and benchmark name from key: format is "binaryId:benchmarkName|pythonVersion"
-          let benchmarkPart = key.split('|')[0]; // Remove python version part
+          const benchmarkPart = key.split('|')[0]; // Remove python version part
           const [binaryId, benchmarkName] = benchmarkPart.split(':'); // Extract binary ID and benchmark name
           if (!newTrendData[binaryId]) {
             newTrendData[binaryId] = {};
@@ -310,7 +309,7 @@ export default function BuildComparisonPage() {
     debouncedMaxDataPoints,
   ]); // Remove selectedBenchmarks and benchmarkMode from dependencies
 
-  const filteredData = useMemo(() => {
+  useMemo(() => {
     // For "All Benchmarks" mode, don't require selectedBenchmarks
     const requiresBenchmarkSelection =
       benchmarkMode === 'specific' && selectedBenchmarks.length === 0;
@@ -1009,7 +1008,7 @@ export default function BuildComparisonPage() {
                       default_benchᵢ) × 100%]) / n_benchmarks
                     </div>
                     <div className="text-xs text-muted-foreground">
-                      Each benchmark's % change vs Default is calculated, then
+                      Each benchmark&apos;s % change vs Default is calculated, then
                       averaged across all selected benchmarks. 0% = same as
                       default, positive = uses more memory, negative = uses less
                       memory.

frontend/src/app/diff/page.tsx

@@ -45,13 +45,10 @@ import {
 } from 'lucide-react';
 import { useRouter } from 'next/navigation';
 import type {
-  DiffTableRow,
-  MetricKey,
   Commit,
   Binary,
   Environment,
 } from '@/lib/types';
-import { METRIC_OPTIONS } from '@/lib/types';
 import { api } from '@/lib/api';
 import type { DiffQueryParams } from '@/types/api';
 import { useSearchParams } from 'next/navigation';
@@ -335,14 +332,14 @@ function DiffTableContent() {
           environment_id: selectedEnvironmentId,
           metric_key: 'high_watermark_bytes',
         } satisfies DiffQueryParams;
-        
+
         const totalAllocatedParams = {
           commit_sha: selectedCommitSha,
           binary_id: selectedBinaryId,
           environment_id: selectedEnvironmentId,
           metric_key: 'total_allocated_bytes',
         } satisfies DiffQueryParams;
-        
+
         const [highWatermarkData, totalAllocatedData] = await Promise.all([
           api.getDiffTable(highWatermarkParams),
           api.getDiffTable(totalAllocatedParams),
@@ -544,10 +541,6 @@ function DiffTableContent() {
     return 'text-foreground';
   };
 
-  const getPythonVersionDisplay = (versionStr?: string) => {
-    return versionStr ? `(py ${versionStr})` : '';
-  };
-
   if (!mounted || loading) {
     return (
       <div className="space-y-6">

frontend/src/app/page.tsx

@@ -110,7 +110,7 @@ export default function Home() {
       <div className="w-full max-w-6xl">
         {/* First row - 3 cards */}
         <div className="grid grid-cols-1 md:grid-cols-3 gap-6 mb-6">
-          {features.slice(0, 3).map((feature, index) => (
+          {features.slice(0, 3).map((feature) => (
             <Card
               key={feature.title}
               className="flex flex-col shadow-lg hover:shadow-xl transition-all duration-300 hover:-translate-y-1 group"
@@ -138,7 +138,7 @@ export default function Home() {
 
         {/* Second row - 3 cards */}
         <div className="grid grid-cols-1 md:grid-cols-3 gap-6">
-          {features.slice(3).map((feature, index) => (
+          {features.slice(3).map((feature) => (
             <Card
               key={feature.title}
               className="flex flex-col shadow-lg hover:shadow-xl transition-all duration-300 hover:-translate-y-1 group"

frontend/src/app/trends/page.tsx

@@ -310,7 +310,7 @@ export default function BenchmarkTrendPage() {
 
         for (const [key, trends] of Object.entries(batchResponse.results)) {
           // Extract benchmark name from key: format is "binaryId:benchmarkName|pythonVersion"
-          let benchmarkPart = key.split('|')[0]; // Remove python version part
+          const benchmarkPart = key.split('|')[0]; // Remove python version part
           const [, benchmarkName] = benchmarkPart.split(':'); // Extract benchmark name
           newTrendData[benchmarkName] = trends;
         }

frontend/src/app/version-comparison/page.tsx

@@ -28,22 +28,15 @@ import { Button } from '@/components/ui/button';
 import { Checkbox } from '@/components/ui/checkbox';
 import { Label } from '@/components/ui/label';
 import {
-  Tooltip,
-  TooltipContent,
   TooltipProvider,
-  TooltipTrigger,
 } from '@/components/ui/tooltip';
 import {
   GitBranch,
   Download,
   ArrowUpDown,
   Filter,
   AlertCircle,
-  Info,
-  Code2,
-  BarChart3,
 } from 'lucide-react';
-import { useRouter } from 'next/navigation';
 import type { Commit, Binary, Environment } from '@/lib/types';
 import type {
   TrendDataPoint,
@@ -72,7 +65,6 @@ type SortField = 'benchmark_name';
 type SortDirection = 'asc' | 'dsc';
 
 function VersionComparisonContent() {
-  const router = useRouter();
   const [commits, setCommits] = useState<Commit[]>([]);
   const [binaries, setBinaries] = useState<Binary[]>([]);
   const [environments, setEnvironments] = useState<Environment[]>([]);
@@ -618,7 +610,7 @@ function VersionComparisonContent() {
                     </Label>
                     <p className="text-sm text-muted-foreground">
                       Choose which Python versions to include in the comparison
-                      (maximum 5). We'll use the latest commit for each version.
+                      (maximum 5). We&apos;ll use the latest commit for each version.
                     </p>
                   </div>
                   <div className="flex items-center gap-2 mt-3 lg:mt-0">