From 546e40097caa762c9ced9dadde0a1f208e3e26f6 Mon Sep 17 00:00:00 2001
From: cnallam <cnallam@paypal.com>
Date: Fri, 15 Aug 2025 18:11:46 -0700
Subject: [PATCH 1/2] Added Bearer Token support

---
 components/mcp-server-manager.tsx | 35 ++++++++++++++++++++++++++++++-
 1 file changed, 34 insertions(+), 1 deletion(-)

diff --git a/components/mcp-server-manager.tsx b/components/mcp-server-manager.tsx
index 8f31d18f..9cb52772 100644
--- a/components/mcp-server-manager.tsx
+++ b/components/mcp-server-manager.tsx
@@ -167,7 +167,8 @@ export const MCPServerManager = ({
     const [editingHeaderIndex, setEditingHeaderIndex] = useState<number | null>(null);
     const [editedEnvValue, setEditedEnvValue] = useState<string>('');
     const [editedHeaderValue, setEditedHeaderValue] = useState<string>('');
-    
+    const [bearerToken, setBearerToken] = useState<string>("");
+
     // Add access to the MCP context for server control
     const { startServer, stopServer, updateServerStatus } = useMCP();
 
@@ -212,6 +213,24 @@ export const MCPServerManager = ({
         setShowSensitiveHeaderValues({});
     };
 
+    // Handler for bearer token input
+    const handleBearerTokenChange = (token: string) => {
+        setNewServer((prev) => {
+            // Remove any existing Authorization header
+            const headers = (prev.headers ?? []).filter(
+            (h) => h.key.toLowerCase() !== 'authorization'
+            );
+
+            return {
+            ...prev,
+            headers: [
+                ...headers,
+                { key: 'Authorization', value: `Bearer ${token}` }
+            ]
+            };
+        });
+    };
+
     const removeServer = (id: string, e: React.MouseEvent) => {
         e.stopPropagation();
         const updatedServers = servers.filter(server => server.id !== id);
@@ -658,6 +677,20 @@ export const MCPServerManager = ({
                                     <p className="text-xs text-muted-foreground">
                                         Full URL to the SSE endpoint of the MCP server
                                     </p>
+                                    <Label htmlFor="authorization">
+                                        Authorization
+                                    </Label>
+                                     <Input
+                                        id="authorization"
+                                        value={
+                                            newServer.headers?.find(h => h.key.toLowerCase() === 'authorization')?.value.replace(/^Bearer\s+/i, '') || ''
+                                        }
+                                        onChange={(e) => handleBearerTokenChange(e.target.value)}
+                                        placeholder="<BEARER_TOKEN>"
+                                        className="relative z-0"
+                                    />
+
+
                                 </div>
                             ) : (
                                 <>

From 12985a89e7b9c4009bd1d98fbc3d5182ab4d592d Mon Sep 17 00:00:00 2001
From: cnallam <cnallam@paypal.com>
Date: Fri, 15 Aug 2025 18:35:33 -0700
Subject: [PATCH 2/2] MCP Settings UI Changes

---
 components/mcp-server-manager.tsx | 63 +++++++++++++++++--------------
 1 file changed, 34 insertions(+), 29 deletions(-)

diff --git a/components/mcp-server-manager.tsx b/components/mcp-server-manager.tsx
index 9cb52772..2d317b8c 100644
--- a/components/mcp-server-manager.tsx
+++ b/components/mcp-server-manager.tsx
@@ -663,35 +663,40 @@ export const MCPServerManager = ({
                             </div>
 
                             {newServer.type === 'sse' ? (
-                                <div className="grid gap-1.5">
-                                    <Label htmlFor="url">
-                                        Server URL
-                                    </Label>
-                                    <Input
-                                        id="url"
-                                        value={newServer.url}
-                                        onChange={(e) => setNewServer({ ...newServer, url: e.target.value })}
-                                        placeholder="https://mcp.example.com/token/sse"
-                                        className="relative z-0"
-                                    />
-                                    <p className="text-xs text-muted-foreground">
-                                        Full URL to the SSE endpoint of the MCP server
-                                    </p>
-                                    <Label htmlFor="authorization">
-                                        Authorization
-                                    </Label>
-                                     <Input
-                                        id="authorization"
-                                        value={
-                                            newServer.headers?.find(h => h.key.toLowerCase() === 'authorization')?.value.replace(/^Bearer\s+/i, '') || ''
-                                        }
-                                        onChange={(e) => handleBearerTokenChange(e.target.value)}
-                                        placeholder="<BEARER_TOKEN>"
-                                        className="relative z-0"
-                                    />
-
-
-                                </div>
+                                <>
+                                    <div className="grid gap-1.5">
+                                        <Label htmlFor="url">
+                                            Server URL
+                                        </Label>
+                                        <Input
+                                            id="url"
+                                            value={newServer.url}
+                                            onChange={(e) => setNewServer({ ...newServer, url: e.target.value })}
+                                            placeholder="https://mcp.example.com/token/sse"
+                                            className="relative z-0"
+                                        />
+                                        <p className="text-xs text-muted-foreground">
+                                            Full URL to the SSE endpoint of the MCP server
+                                        </p>
+                                    </div>
+                                    <div className="grid gap-1.5">
+                                        <Label htmlFor="authorization">
+                                            Authorization
+                                        </Label>
+                                        <Input
+                                            id="authorization"
+                                            value={
+                                                newServer.headers?.find(h => h.key.toLowerCase() === 'authorization')?.value.replace(/^Bearer\s+/i, '') || ''
+                                            }
+                                            onChange={(e) => handleBearerTokenChange(e.target.value)}
+                                            placeholder="<BEARER_TOKEN>"
+                                            className="relative z-0"
+                                        />
+                                        <p className="text-xs text-muted-foreground">
+                                            Add your Bearer token here
+                                        </p>
+                                    </div>
+                                </>
                             ) : (
                                 <>
                                     <div className="grid gap-1.5">