import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
import { McpServer } from './McpServer';
import { McpServersProvider, useMcpServers } from '../contexts/McpContext';
import { useTheme } from '../theme';
export const ServerManagerInner = () => {
    const { servers, removeServer } = useMcpServers();
    const theme = useTheme();
    const managerTheme = theme.modelManager;
    return (_jsxs("div", { className: managerTheme.container, children: [servers.map(({ id }) => (_jsx("div", { className: managerTheme.modelCard, children: _jsx(McpServer, { uniqueId: id, onDelete: removeServer }) }, id))), servers.length === 0 && (_jsx("div", { className: managerTheme.emptyState, children: "No MCP servers configured yet. Click \"Add server\" to get started." }))] }));
};
export const ServerManager = () => (_jsx(McpServersProvider, { children: _jsx(ServerManagerInner, {}) }));
