chore: ran linting

This commit is contained in:
Anish Sarkar 2026-01-20 11:50:17 +05:30
parent 0c3307fabb
commit e65d9fa1db
3 changed files with 36 additions and 32 deletions

View file

@ -44,7 +44,7 @@ export const MCPConnectForm: FC<ConnectFormProps> = ({ onSubmit, isSubmitting })
name: "My Remote MCP Server", name: "My Remote MCP Server",
url: "https://your-mcp-server.com/mcp", url: "https://your-mcp-server.com/mcp",
headers: { headers: {
"API_KEY": "your_api_key_here", API_KEY: "your_api_key_here",
}, },
transport: "streamable-http", transport: "streamable-http",
}, },
@ -137,11 +137,12 @@ export const MCPConnectForm: FC<ConnectFormProps> = ({ onSubmit, isSubmitting })
return ( return (
<div className="space-y-6 pb-6"> <div className="space-y-6 pb-6">
<Alert className="bg-slate-400/5 dark:bg-white/5 border-slate-400/20 p-2 sm:p-3 [&>svg]:top-2 sm:[&>svg]:top-3"> <Alert className="bg-slate-400/5 dark:bg-white/5 border-slate-400/20 p-2 sm:p-3 [&>svg]:top-2 sm:[&>svg]:top-3">
<Server className="h-4 w-4 shrink-0" /> <Server className="h-4 w-4 shrink-0" />
<AlertDescription className="text-[10px] sm:text-xs"> <AlertDescription className="text-[10px] sm:text-xs">
Connect to an MCP (Model Context Protocol) server. Each MCP server is added as a separate connector. Connect to an MCP (Model Context Protocol) server. Each MCP server is added as a separate
</AlertDescription> connector.
</Alert> </AlertDescription>
</Alert>
<form id="mcp-connect-form" onSubmit={handleSubmit} className="space-y-6"> <form id="mcp-connect-form" onSubmit={handleSubmit} className="space-y-6">
<div className="rounded-xl border border-border bg-slate-400/5 dark:bg-white/5 p-4 sm:p-6 space-y-4"> <div className="rounded-xl border border-border bg-slate-400/5 dark:bg-white/5 p-4 sm:p-6 space-y-4">
@ -182,7 +183,8 @@ export const MCPConnectForm: FC<ConnectFormProps> = ({ onSubmit, isSubmitting })
const start = target.selectionStart; const start = target.selectionStart;
const end = target.selectionEnd; const end = target.selectionEnd;
const indent = " "; // 2 spaces for JSON const indent = " "; // 2 spaces for JSON
const newValue = configJson.substring(0, start) + indent + configJson.substring(end); const newValue =
configJson.substring(0, start) + indent + configJson.substring(end);
handleConfigChange(newValue); handleConfigChange(newValue);
// Set cursor position after the inserted tab // Set cursor position after the inserted tab
requestAnimationFrame(() => { requestAnimationFrame(() => {
@ -194,11 +196,10 @@ export const MCPConnectForm: FC<ConnectFormProps> = ({ onSubmit, isSubmitting })
rows={16} rows={16}
className={`font-mono text-xs ${jsonError ? "border-red-500" : ""}`} className={`font-mono text-xs ${jsonError ? "border-red-500" : ""}`}
/> />
{jsonError && ( {jsonError && <p className="text-xs text-red-500">JSON Error: {jsonError}</p>}
<p className="text-xs text-red-500">JSON Error: {jsonError}</p>
)}
<p className="text-[10px] sm:text-xs text-muted-foreground"> <p className="text-[10px] sm:text-xs text-muted-foreground">
Paste a single MCP server configuration. Must include: name, command, args (optional), env (optional), transport (optional). Paste a single MCP server configuration. Must include: name, command, args (optional),
env (optional), transport (optional).
</p> </p>
</div> </div>
@ -232,7 +233,9 @@ export const MCPConnectForm: FC<ConnectFormProps> = ({ onSubmit, isSubmitting })
<div className="flex-1"> <div className="flex-1">
<div className="flex items-center justify-between"> <div className="flex items-center justify-between">
<AlertTitle className="text-sm"> <AlertTitle className="text-sm">
{testResult.status === "success" ? "Connection Successful" : "Connection Failed"} {testResult.status === "success"
? "Connection Successful"
: "Connection Failed"}
</AlertTitle> </AlertTitle>
{testResult.tools.length > 0 && ( {testResult.tools.length > 0 && (
<Button <Button
@ -266,9 +269,7 @@ export const MCPConnectForm: FC<ConnectFormProps> = ({ onSubmit, isSubmitting })
{testResult.message} {testResult.message}
{showDetails && testResult.tools.length > 0 && ( {showDetails && testResult.tools.length > 0 && (
<div className="mt-3 pt-3 border-t border-green-500/20"> <div className="mt-3 pt-3 border-t border-green-500/20">
<p className="font-semibold mb-2"> <p className="font-semibold mb-2">Available tools:</p>
Available tools:
</p>
<ul className="list-disc list-inside text-xs space-y-0.5"> <ul className="list-disc list-inside text-xs space-y-0.5">
{testResult.tools.map((tool, i) => ( {testResult.tools.map((tool, i) => (
<li key={i}>{tool.name}</li> <li key={i}>{tool.name}</li>

View file

@ -188,7 +188,8 @@ export const MCPConfig: FC<MCPConfigProps> = ({ connector, onConfigChange, onNam
const start = target.selectionStart; const start = target.selectionStart;
const end = target.selectionEnd; const end = target.selectionEnd;
const indent = " "; // 2 spaces for JSON const indent = " "; // 2 spaces for JSON
const newValue = configJson.substring(0, start) + indent + configJson.substring(end); const newValue =
configJson.substring(0, start) + indent + configJson.substring(end);
handleConfigChange(newValue); handleConfigChange(newValue);
// Set cursor position after the inserted tab // Set cursor position after the inserted tab
requestAnimationFrame(() => { requestAnimationFrame(() => {
@ -201,7 +202,8 @@ export const MCPConfig: FC<MCPConfigProps> = ({ connector, onConfigChange, onNam
/> />
{jsonError && <p className="text-xs text-red-500">JSON Error: {jsonError}</p>} {jsonError && <p className="text-xs text-red-500">JSON Error: {jsonError}</p>}
<p className="text-[10px] sm:text-xs text-muted-foreground"> <p className="text-[10px] sm:text-xs text-muted-foreground">
<strong>Local (stdio):</strong> command, args, env, transport: "stdio"<br /> <strong>Local (stdio):</strong> command, args, env, transport: "stdio"
<br />
<strong>Remote (HTTP):</strong> url, headers, transport: "streamable-http" <strong>Remote (HTTP):</strong> url, headers, transport: "streamable-http"
</p> </p>
</div> </div>

View file

@ -156,18 +156,19 @@ export const parseMCPConfig = (configJson: string): MCPConfigValidationResult =>
} }
// Build config based on transport type // Build config based on transport type
const config: MCPServerConfig = result.data.transport === "stdio" || !result.data.transport const config: MCPServerConfig =
? { result.data.transport === "stdio" || !result.data.transport
command: (result.data as z.infer<typeof StdioConfigSchema>).command, ? {
args: (result.data as z.infer<typeof StdioConfigSchema>).args, command: (result.data as z.infer<typeof StdioConfigSchema>).command,
env: (result.data as z.infer<typeof StdioConfigSchema>).env, args: (result.data as z.infer<typeof StdioConfigSchema>).args,
transport: "stdio" as const, env: (result.data as z.infer<typeof StdioConfigSchema>).env,
} transport: "stdio" as const,
: { }
url: (result.data as z.infer<typeof HttpConfigSchema>).url, : {
headers: (result.data as z.infer<typeof HttpConfigSchema>).headers, url: (result.data as z.infer<typeof HttpConfigSchema>).url,
transport: result.data.transport as "streamable-http" | "http" | "sse", headers: (result.data as z.infer<typeof HttpConfigSchema>).headers,
}; transport: result.data.transport as "streamable-http" | "http" | "sse",
};
// Cache the successfully parsed config // Cache the successfully parsed config
configCache.set(configJson, { configCache.set(configJson, {