style(ui): match MCP Servers tabs to the dashboard's line tab pattern

The MCP Servers page was the only page-level tab bar using the segmented
(pill) TabsList stretched with w-full, which rendered a full-width grey
bar with a lone pill on the left. Every other page-level tab bar
(budgets, vector stores, access groups, organizations, routing groups,
API reference) uses the underlined line variant, so use that here too.
This commit is contained in:
Yuneng Jiang 2026-07-25 17:43:53 -07:00
parent 215f05588d
commit 2ce5900770
No known key found for this signature in database

View file

@ -517,31 +517,29 @@ const MCPServers: React.FC<MCPServerProps> = ({ accessToken, userRole, userID })
accessToken={accessToken}
/>
<Tabs defaultValue="servers" className="mt-2 w-full">
<TabsList className="w-full justify-start">
<TabsTrigger value="servers" className="flex-none">
<TabsList variant="line" className="h-auto w-full justify-start rounded-none border-b p-0">
<TabsTrigger value="servers" className="flex-none rounded-none px-4 py-2">
All Servers
</TabsTrigger>
<TabsTrigger value="toolsets" className="flex-none">
<TabsTrigger value="toolsets" className="flex-none rounded-none px-4 py-2">
Toolsets
</TabsTrigger>
<TabsTrigger value="connect" className="flex-none">
<TabsTrigger value="connect" className="flex-none rounded-none px-4 py-2">
Connect
</TabsTrigger>
{isAdminRole(userRole) && (
<TabsTrigger value="semantic-filter" className="flex-none">
<TabsTrigger value="semantic-filter" className="flex-none rounded-none px-4 py-2">
Semantic Filter
</TabsTrigger>
)}
{isAdminRole(userRole) && (
<TabsTrigger value="network-settings" className="flex-none">
<TabsTrigger value="network-settings" className="flex-none rounded-none px-4 py-2">
Network Settings
</TabsTrigger>
)}
{isAdminRole(userRole) && (
<TabsTrigger value="submitted" className="flex-none">
<span className="flex items-center gap-2">
Submitted MCPs <NewBadge />
</span>
<TabsTrigger value="submitted" className="flex-none gap-2 rounded-none px-4 py-2">
Submitted MCPs <NewBadge />
</TabsTrigger>
)}
</TabsList>