From fe18140da17953b8250d6510b9d8def179c89438 Mon Sep 17 00:00:00 2001
From: Christian Sidak <csidak@gmail.com>
Date: Sun, 5 Apr 2026 21:00:54 -0700
Subject: [PATCH] feat: show item count in list pane header

Display the total number of items next to the list title (e.g. "Tools (5)")
when items are present. This helps users quickly see how many tools,
resources, or prompts an MCP server exposes, which is useful for clients
with tool count limits.

Closes #1171
---
 client/src/components/ListPane.tsx                |  5 +++++
 client/src/components/__tests__/ListPane.test.tsx | 12 ++++++++++++
 2 files changed, 17 insertions(+)

diff --git a/client/src/components/ListPane.tsx b/client/src/components/ListPane.tsx
index e88aadb5a..4e7031392 100644
--- a/client/src/components/ListPane.tsx
+++ b/client/src/components/ListPane.tsx
@@ -61,6 +61,11 @@ const ListPane = <T extends object>({
         <div className="flex items-center justify-between gap-4">
           <h3 className="font-semibold dark:text-white flex-shrink-0">
             {title}
+            {items.length > 0 && (
+              <span className="ml-2 text-xs font-medium text-muted-foreground">
+                ({items.length})
+              </span>
+            )}
           </h3>
           <div className="flex items-center justify-end min-w-0 flex-1">
             {!isSearchExpanded ? (
diff --git a/client/src/components/__tests__/ListPane.test.tsx b/client/src/components/__tests__/ListPane.test.tsx
index e930a52a2..9c29d8a3c 100644
--- a/client/src/components/__tests__/ListPane.test.tsx
+++ b/client/src/components/__tests__/ListPane.test.tsx
@@ -53,6 +53,18 @@ describe("ListPane", () => {
       expect(screen.getByText("Another Tool")).toBeInTheDocument();
     });
 
+    it("should show item count when items are present", () => {
+      renderListPane();
+
+      expect(screen.getByText("(3)")).toBeInTheDocument();
+    });
+
+    it("should not show item count when no items", () => {
+      renderListPane({ items: [] });
+
+      expect(screen.queryByText("(0)")).not.toBeInTheDocument();
+    });
+
     it("should render empty state when no items", () => {
       renderListPane({ items: [] });