Skip to content

Commit 733d2a6

Browse files
committed
Separate error states per tab
Resolves modelcontextprotocol#40.
1 parent ab9c130 commit 733d2a6

File tree

1 file changed

+23
-11
lines changed

1 file changed

+23
-11
lines changed

client/src/App.tsx

Lines changed: 23 additions & 11 deletions
Original file line numberDiff line numberDiff line change
@@ -79,7 +79,11 @@ const App = () => {
7979
const [tools, setTools] = useState<Tool[]>([]);
8080
const [toolResult, setToolResult] =
8181
useState<CompatibilityCallToolResult | null>(null);
82-
const [error, setError] = useState<string | null>(null);
82+
const [errors, setErrors] = useState<Record<string, string | null>>({
83+
resources: null,
84+
prompts: null,
85+
tools: null,
86+
});
8387
const [command, setCommand] = useState<string>(() => {
8488
return localStorage.getItem("lastCommand") || "mcp-server-everything";
8589
});
@@ -175,17 +179,19 @@ const App = () => {
175179
const makeRequest = async <T extends ZodType<object>>(
176180
request: ClientRequest,
177181
schema: T,
182+
tabKey: keyof typeof errors
178183
) => {
179184
if (!mcpClient) {
180185
throw new Error("MCP client not connected");
181186
}
182-
187+
183188
try {
184189
const response = await mcpClient.request(request, schema);
185190
pushHistory(request, response);
191+
setErrors(prev => ({ ...prev, [tabKey]: null }));
186192
return response;
187193
} catch (e: unknown) {
188-
setError((e as Error).message);
194+
setErrors(prev => ({ ...prev, [tabKey]: (e as Error).message }));
189195
throw e;
190196
}
191197
};
@@ -211,11 +217,12 @@ const App = () => {
211217
params: nextResourceCursor ? { cursor: nextResourceCursor } : {},
212218
},
213219
ListResourcesResultSchema,
220+
'resources'
214221
);
215222
setResources(resources.concat(response.resources ?? []));
216223
setNextResourceCursor(response.nextCursor);
217224
};
218-
225+
219226
const listResourceTemplates = async () => {
220227
const response = await makeRequest(
221228
{
@@ -225,20 +232,22 @@ const App = () => {
225232
: {},
226233
},
227234
ListResourceTemplatesResultSchema,
235+
'resources'
228236
);
229237
setResourceTemplates(
230238
resourceTemplates.concat(response.resourceTemplates ?? []),
231239
);
232240
setNextResourceTemplateCursor(response.nextCursor);
233241
};
234-
242+
235243
const readResource = async (uri: string) => {
236244
const response = await makeRequest(
237245
{
238246
method: "resources/read" as const,
239247
params: { uri },
240248
},
241249
ReadResourceResultSchema,
250+
'resources'
242251
);
243252
setResourceContent(JSON.stringify(response, null, 2));
244253
};
@@ -250,18 +259,20 @@ const App = () => {
250259
params: nextPromptCursor ? { cursor: nextPromptCursor } : {},
251260
},
252261
ListPromptsResultSchema,
262+
'prompts'
253263
);
254264
setPrompts(response.prompts);
255265
setNextPromptCursor(response.nextCursor);
256266
};
257-
267+
258268
const getPrompt = async (name: string, args: Record<string, string> = {}) => {
259269
const response = await makeRequest(
260270
{
261271
method: "prompts/get" as const,
262272
params: { name, arguments: args },
263273
},
264274
GetPromptResultSchema,
275+
'prompts'
265276
);
266277
setPromptContent(JSON.stringify(response, null, 2));
267278
};
@@ -273,11 +284,12 @@ const App = () => {
273284
params: nextToolCursor ? { cursor: nextToolCursor } : {},
274285
},
275286
ListToolsResultSchema,
287+
'tools'
276288
);
277289
setTools(response.tools);
278290
setNextToolCursor(response.nextCursor);
279291
};
280-
292+
281293
const callTool = async (name: string, params: Record<string, unknown>) => {
282294
const response = await makeRequest(
283295
{
@@ -291,6 +303,7 @@ const App = () => {
291303
},
292304
},
293305
CompatibilityCallToolResultSchema,
306+
'tools'
294307
);
295308
setToolResult(response);
296309
};
@@ -515,7 +528,7 @@ const App = () => {
515528
resourceContent={resourceContent}
516529
nextCursor={nextResourceCursor}
517530
nextTemplateCursor={nextResourceTemplateCursor}
518-
error={error}
531+
error={errors.resources}
519532
/>
520533
<PromptsTab
521534
prompts={prompts}
@@ -525,9 +538,8 @@ const App = () => {
525538
setSelectedPrompt={setSelectedPrompt}
526539
promptContent={promptContent}
527540
nextCursor={nextPromptCursor}
528-
error={error}
541+
error={errors.prompts}
529542
/>
530-
<RequestsTab />
531543
<ToolsTab
532544
tools={tools}
533545
listTools={listTools}
@@ -539,7 +551,7 @@ const App = () => {
539551
}}
540552
toolResult={toolResult}
541553
nextCursor={nextToolCursor}
542-
error={error}
554+
error={errors.tools}
543555
/>
544556
<ConsoleTab />
545557
<PingTab

0 commit comments

Comments
 (0)