@@ -45,10 +45,7 @@ import Sidebar from "./components/Sidebar";
45
45
import ToolsTab from "./components/ToolsTab" ;
46
46
import { DEFAULT_INSPECTOR_CONFIG } from "./lib/constants" ;
47
47
import { InspectorConfig } from "./lib/configurationTypes" ;
48
- import {
49
- getMCPProxyAddress ,
50
- getMCPServerRequestTimeout ,
51
- } from "./utils/configUtils" ;
48
+ import { getMCPProxyAddress } from "./utils/configUtils" ;
52
49
import { useToast } from "@/hooks/use-toast" ;
53
50
54
51
const params = new URLSearchParams ( window . location . search ) ;
@@ -98,10 +95,21 @@ const App = () => {
98
95
const [ config , setConfig ] = useState < InspectorConfig > ( ( ) => {
99
96
const savedConfig = localStorage . getItem ( CONFIG_LOCAL_STORAGE_KEY ) ;
100
97
if ( savedConfig ) {
101
- return {
98
+ // merge default config with saved config
99
+ const mergedConfig = {
102
100
...DEFAULT_INSPECTOR_CONFIG ,
103
101
...JSON . parse ( savedConfig ) ,
104
102
} as InspectorConfig ;
103
+
104
+ // update description of keys to match the new description (in case of any updates to the default config description)
105
+ Object . entries ( mergedConfig ) . forEach ( ( [ key , value ] ) => {
106
+ mergedConfig [ key as keyof InspectorConfig ] = {
107
+ ...value ,
108
+ label : DEFAULT_INSPECTOR_CONFIG [ key as keyof InspectorConfig ] . label ,
109
+ } ;
110
+ } ) ;
111
+
112
+ return mergedConfig ;
105
113
}
106
114
return DEFAULT_INSPECTOR_CONFIG ;
107
115
} ) ;
@@ -148,7 +156,7 @@ const App = () => {
148
156
serverCapabilities,
149
157
mcpClient,
150
158
requestHistory,
151
- makeRequest : makeConnectionRequest ,
159
+ makeRequest,
152
160
sendNotification,
153
161
handleCompletion,
154
162
completionsSupported,
@@ -161,8 +169,7 @@ const App = () => {
161
169
sseUrl,
162
170
env,
163
171
bearerToken,
164
- proxyServerUrl : getMCPProxyAddress ( config ) ,
165
- requestTimeout : getMCPServerRequestTimeout ( config ) ,
172
+ config,
166
173
onNotification : ( notification ) => {
167
174
setNotifications ( ( prev ) => [ ...prev , notification as ServerNotification ] ) ;
168
175
} ,
@@ -279,13 +286,13 @@ const App = () => {
279
286
setErrors ( ( prev ) => ( { ...prev , [ tabKey ] : null } ) ) ;
280
287
} ;
281
288
282
- const makeRequest = async < T extends z . ZodType > (
289
+ const sendMCPRequest = async < T extends z . ZodType > (
283
290
request : ClientRequest ,
284
291
schema : T ,
285
292
tabKey ?: keyof typeof errors ,
286
293
) => {
287
294
try {
288
- const response = await makeConnectionRequest ( request , schema ) ;
295
+ const response = await makeRequest ( request , schema ) ;
289
296
if ( tabKey !== undefined ) {
290
297
clearError ( tabKey ) ;
291
298
}
@@ -303,7 +310,7 @@ const App = () => {
303
310
} ;
304
311
305
312
const listResources = async ( ) => {
306
- const response = await makeRequest (
313
+ const response = await sendMCPRequest (
307
314
{
308
315
method : "resources/list" as const ,
309
316
params : nextResourceCursor ? { cursor : nextResourceCursor } : { } ,
@@ -316,7 +323,7 @@ const App = () => {
316
323
} ;
317
324
318
325
const listResourceTemplates = async ( ) => {
319
- const response = await makeRequest (
326
+ const response = await sendMCPRequest (
320
327
{
321
328
method : "resources/templates/list" as const ,
322
329
params : nextResourceTemplateCursor
@@ -333,7 +340,7 @@ const App = () => {
333
340
} ;
334
341
335
342
const readResource = async ( uri : string ) => {
336
- const response = await makeRequest (
343
+ const response = await sendMCPRequest (
337
344
{
338
345
method : "resources/read" as const ,
339
346
params : { uri } ,
@@ -346,7 +353,7 @@ const App = () => {
346
353
347
354
const subscribeToResource = async ( uri : string ) => {
348
355
if ( ! resourceSubscriptions . has ( uri ) ) {
349
- await makeRequest (
356
+ await sendMCPRequest (
350
357
{
351
358
method : "resources/subscribe" as const ,
352
359
params : { uri } ,
@@ -362,7 +369,7 @@ const App = () => {
362
369
363
370
const unsubscribeFromResource = async ( uri : string ) => {
364
371
if ( resourceSubscriptions . has ( uri ) ) {
365
- await makeRequest (
372
+ await sendMCPRequest (
366
373
{
367
374
method : "resources/unsubscribe" as const ,
368
375
params : { uri } ,
@@ -377,7 +384,7 @@ const App = () => {
377
384
} ;
378
385
379
386
const listPrompts = async ( ) => {
380
- const response = await makeRequest (
387
+ const response = await sendMCPRequest (
381
388
{
382
389
method : "prompts/list" as const ,
383
390
params : nextPromptCursor ? { cursor : nextPromptCursor } : { } ,
@@ -390,7 +397,7 @@ const App = () => {
390
397
} ;
391
398
392
399
const getPrompt = async ( name : string , args : Record < string , string > = { } ) => {
393
- const response = await makeRequest (
400
+ const response = await sendMCPRequest (
394
401
{
395
402
method : "prompts/get" as const ,
396
403
params : { name, arguments : args } ,
@@ -402,7 +409,7 @@ const App = () => {
402
409
} ;
403
410
404
411
const listTools = async ( ) => {
405
- const response = await makeRequest (
412
+ const response = await sendMCPRequest (
406
413
{
407
414
method : "tools/list" as const ,
408
415
params : nextToolCursor ? { cursor : nextToolCursor } : { } ,
@@ -415,29 +422,42 @@ const App = () => {
415
422
} ;
416
423
417
424
const callTool = async ( name : string , params : Record < string , unknown > ) => {
418
- const response = await makeRequest (
419
- {
420
- method : "tools/call" as const ,
421
- params : {
422
- name,
423
- arguments : params ,
424
- _meta : {
425
- progressToken : progressTokenRef . current ++ ,
425
+ try {
426
+ const response = await sendMCPRequest (
427
+ {
428
+ method : "tools/call" as const ,
429
+ params : {
430
+ name,
431
+ arguments : params ,
432
+ _meta : {
433
+ progressToken : progressTokenRef . current ++ ,
434
+ } ,
426
435
} ,
427
436
} ,
428
- } ,
429
- CompatibilityCallToolResultSchema ,
430
- "tools" ,
431
- ) ;
432
- setToolResult ( response ) ;
437
+ CompatibilityCallToolResultSchema ,
438
+ "tools" ,
439
+ ) ;
440
+ setToolResult ( response ) ;
441
+ } catch ( e ) {
442
+ const toolResult : CompatibilityCallToolResult = {
443
+ content : [
444
+ {
445
+ type : "text" ,
446
+ text : ( e as Error ) . message ?? String ( e ) ,
447
+ } ,
448
+ ] ,
449
+ isError : true ,
450
+ } ;
451
+ setToolResult ( toolResult ) ;
452
+ }
433
453
} ;
434
454
435
455
const handleRootsChange = async ( ) => {
436
456
await sendNotification ( { method : "notifications/roots/list_changed" } ) ;
437
457
} ;
438
458
439
459
const sendLogLevelRequest = async ( level : LoggingLevel ) => {
440
- await makeRequest (
460
+ await sendMCPRequest (
441
461
{
442
462
method : "logging/setLevel" as const ,
443
463
params : { level } ,
@@ -637,9 +657,10 @@ const App = () => {
637
657
setTools ( [ ] ) ;
638
658
setNextToolCursor ( undefined ) ;
639
659
} }
640
- callTool = { ( name , params ) => {
660
+ callTool = { async ( name , params ) => {
641
661
clearError ( "tools" ) ;
642
- callTool ( name , params ) ;
662
+ setToolResult ( null ) ;
663
+ await callTool ( name , params ) ;
643
664
} }
644
665
selectedTool = { selectedTool }
645
666
setSelectedTool = { ( tool ) => {
@@ -654,7 +675,7 @@ const App = () => {
654
675
< ConsoleTab />
655
676
< PingTab
656
677
onPingClick = { ( ) => {
657
- void makeRequest (
678
+ void sendMCPRequest (
658
679
{
659
680
method : "ping" as const ,
660
681
} ,
0 commit comments