1  'use client'
 2  
 3  import { useAppStore } from '@/stores/use-app-store'
 4  import { McpServerList } from '@/components/mcp-servers/mcp-server-list'
 5  
 6  export default function McpServersPage() {
 7    return (
 8      <div className="flex-1 flex flex-col h-full">
 9        <div className="flex items-center px-6 pt-5 pb-3 shrink-0">
10          <h2 className="font-display text-[14px] font-600 text-text-2 tracking-[-0.01em] capitalize flex-1">
11            MCP Servers
12          </h2>
13          <button
14            onClick={() => useAppStore.getState().setMcpServerSheetOpen(true)}
15            className="flex items-center gap-1.5 px-2.5 py-1.5 rounded-[8px] text-[11px] font-600 text-accent-bright bg-accent-soft hover:bg-accent-bright/15 transition-all cursor-pointer"
16            style={{ fontFamily: 'inherit' }}
17          >
18            <svg width="12" height="12" viewBox="0 0 24 24" fill="none" stroke="currentColor" strokeWidth="2.5" strokeLinecap="round">
19              <line x1="12" y1="5" x2="12" y2="19" /><line x1="5" y1="12" x2="19" y2="12" />
20            </svg>
21            MCP Server
22          </button>
23        </div>
24        <McpServerList />
25      </div>
26    )
27  }