From 9e1186f5ac8528c2947af2dd036c46cabfc458f8 Mon Sep 17 00:00:00 2001
From: Pulkit Sharma <avastpulkit@gmail.com>
Date: Sat, 29 Mar 2025 09:40:13 +0530
Subject: [PATCH] Document configuration in Readme and add TSDoc for the same.

---
 README.md                            |  8 ++++++++
 client/src/components/Sidebar.tsx    |  2 +-
 client/src/lib/configurationTypes.ts | 14 ++++++++++++--
 client/src/lib/constants.ts          |  3 +--
 4 files changed, 22 insertions(+), 5 deletions(-)

diff --git a/README.md b/README.md
index f1bd97c..5fe3693 100644
--- a/README.md
+++ b/README.md
@@ -46,6 +46,14 @@ The inspector supports bearer token authentication for SSE connections. Enter yo
 
 The MCP Inspector includes a proxy server that can run and communicate with local MCP processes. The proxy server should not be exposed to untrusted networks as it has permissions to spawn local processes and can connect to any specified MCP server.
 
+### Configuration
+
+The MCP Inspector supports the following configuration settings. To change them click on the `Configuration` button in the MCP Inspector UI :
+
+| Name                       | Purpose                                                                                   | Default Value |
+| -------------------------- | ----------------------------------------------------------------------------------------- | ------------- |
+| MCP_SERVER_REQUEST_TIMEOUT | Maximum time in milliseconds to wait for a response from the MCP server before timing out | 10000         |
+
 ### From this repository
 
 If you're working on the inspector itself:
diff --git a/client/src/components/Sidebar.tsx b/client/src/components/Sidebar.tsx
index dc5362b..955d415 100644
--- a/client/src/components/Sidebar.tsx
+++ b/client/src/components/Sidebar.tsx
@@ -294,7 +294,7 @@ const Sidebar = ({
           {/* Configuration */}
           <div className="space-y-2">
             <Button
-              variant="secondary"
+              variant="outline"
               onClick={() => setShowConfig(!showConfig)}
               className="flex items-center w-full"
             >
diff --git a/client/src/lib/configurationTypes.ts b/client/src/lib/configurationTypes.ts
index 2310c58..082411d 100644
--- a/client/src/lib/configurationTypes.ts
+++ b/client/src/lib/configurationTypes.ts
@@ -1,8 +1,18 @@
 export type ConfigItem = {
   description: string;
   value: string | number | boolean;
-}
+};
 
+/**
+ * Configuration interface for the MCP Inspector, including settings for the MCP Client,
+ * Proxy Server, and Inspector UI/UX.
+ *
+ * Note: Configuration related to which MCP Server to use or any other MCP Server
+ * specific settings are outside the scope of this interface as of now.
+ */
 export type InspectorConfig = {
+  /**
+   * Maximum time in milliseconds to wait for a response from the MCP server before timing out.
+   */
   MCP_SERVER_REQUEST_TIMEOUT: ConfigItem;
-};
\ No newline at end of file
+};
diff --git a/client/src/lib/constants.ts b/client/src/lib/constants.ts
index 22288d9..869f13b 100644
--- a/client/src/lib/constants.ts
+++ b/client/src/lib/constants.ts
@@ -1,6 +1,5 @@
 import { InspectorConfig } from "./configurationTypes";
 
-
 // OAuth-related session storage keys
 export const SESSION_KEYS = {
   CODE_VERIFIER: "mcp_code_verifier",
@@ -14,4 +13,4 @@ export const DEFAULT_INSPECTOR_CONFIG: InspectorConfig = {
     description: "Timeout for requests to the MCP server (ms)",
     value: 10000,
   },
-} as const;
\ No newline at end of file
+} as const;