From 5da1dc3256980a71e5f3433acd2c90cf52ba8727 Mon Sep 17 00:00:00 2001
From: Marc Abramowitz <abramowi@adobe.com>
Date: Tue, 3 Jun 2025 22:54:19 -0700
Subject: [PATCH] Add tooltip for URL field

A quick way to see the full URL if it's cut off

Inspired by @cliffhall's
[comment](https://github.com/modelcontextprotocol/inspector/pull/459#issuecomment-2932277785)
---
 client/src/components/Sidebar.tsx | 21 ++++++++++++++-------
 1 file changed, 14 insertions(+), 7 deletions(-)

diff --git a/client/src/components/Sidebar.tsx b/client/src/components/Sidebar.tsx
index eee8eeaa..1b7f78e9 100644
--- a/client/src/components/Sidebar.tsx
+++ b/client/src/components/Sidebar.tsx
@@ -285,13 +285,20 @@ const Sidebar = ({
                 <label className="text-sm font-medium" htmlFor="sse-url-input">
                   URL
                 </label>
-                <Input
-                  id="sse-url-input"
-                  placeholder="URL"
-                  value={sseUrl}
-                  onChange={(e) => setSseUrl(e.target.value)}
-                  className="font-mono"
-                />
+                <Tooltip>
+                  <TooltipTrigger asChild>
+                    <Input
+                      id="sse-url-input"
+                      placeholder="URL"
+                      value={sseUrl}
+                      onChange={(e) => setSseUrl(e.target.value)}
+                      className="font-mono"
+                    />
+                  </TooltipTrigger>
+                  <TooltipContent>
+                    {sseUrl || `Enter URL to MCP server`}
+                  </TooltipContent>
+                </Tooltip>
               </div>
               <div className="space-y-2">
                 <Button