Skip to content

Commit 1c9b47a

Browse files
xiaoyijunxiaoyijun
committed
refactor: ui improvement
1 parent cc2272b commit 1c9b47a

File tree

1 file changed

+89
-93
lines changed

1 file changed

+89
-93
lines changed

‎client/src/components/Sidebar.tsx

Lines changed: 89 additions & 93 deletions
Original file line numberDiff line numberDiff line change
@@ -103,10 +103,9 @@ const Sidebar = ({
103103
}: SidebarProps) => {
104104
const [theme, setTheme] = useTheme();
105105
const [showEnvVars, setShowEnvVars] = useState(false);
106-
const [showBearerToken, setShowBearerToken] = useState(false);
106+
const [showAuthConfig, setShowAuthConfig] = useState(false);
107107
const [showConfig, setShowConfig] = useState(false);
108108
const [shownEnvVars, setShownEnvVars] = useState<Set<string>>(new Set());
109-
const [showOauthConfig, setShowOauthConfig] = useState(false);
110109
const [copiedServerEntry, setCopiedServerEntry] = useState(false);
111110
const [copiedServerFile, setCopiedServerFile] = useState(false);
112111
const { toast } = useToast();
@@ -317,97 +316,6 @@ const Sidebar = ({
317316
/>
318317
)}
319318
</div>
320-
<div className="space-y-2">
321-
<Button
322-
variant="outline"
323-
onClick={() => setShowBearerToken(!showBearerToken)}
324-
className="flex items-center w-full"
325-
data-testid="auth-button"
326-
aria-expanded={showBearerToken}
327-
>
328-
{showBearerToken ? (
329-
<ChevronDown className="w-4 h-4 mr-2" />
330-
) : (
331-
<ChevronRight className="w-4 h-4 mr-2" />
332-
)}
333-
Authentication
334-
</Button>
335-
{showBearerToken && (
336-
<div className="space-y-2">
337-
<label className="text-sm font-medium">Header Name</label>
338-
<Input
339-
placeholder="Authorization"
340-
onChange={(e) =>
341-
setHeaderName && setHeaderName(e.target.value)
342-
}
343-
data-testid="header-input"
344-
className="font-mono"
345-
value={headerName}
346-
/>
347-
<label
348-
className="text-sm font-medium"
349-
htmlFor="bearer-token-input"
350-
>
351-
Bearer Token
352-
</label>
353-
<Input
354-
id="bearer-token-input"
355-
placeholder="Bearer Token"
356-
value={bearerToken}
357-
onChange={(e) => setBearerToken(e.target.value)}
358-
data-testid="bearer-token-input"
359-
className="font-mono"
360-
type="password"
361-
/>
362-
</div>
363-
)}
364-
</div>
365-
{/* OAuth Configuration */}
366-
<div className="space-y-2">
367-
<Button
368-
variant="outline"
369-
onClick={() => setShowOauthConfig(!showOauthConfig)}
370-
className="flex items-center w-full"
371-
data-testid="oauth-config-button"
372-
aria-expanded={showOauthConfig}
373-
>
374-
{showOauthConfig ? (
375-
<ChevronDown className="w-4 h-4 mr-2" />
376-
) : (
377-
<ChevronRight className="w-4 h-4 mr-2" />
378-
)}
379-
OAuth Configuration
380-
</Button>
381-
{showOauthConfig && (
382-
<div className="space-y-2">
383-
<label className="text-sm font-medium">Client ID</label>
384-
<Input
385-
placeholder="Client ID"
386-
onChange={(e) => setOauthClientId(e.target.value)}
387-
value={oauthClientId}
388-
data-testid="oauth-client-id-input"
389-
className="font-mono"
390-
/>
391-
<label className="text-sm font-medium">
392-
Redirect URL
393-
</label>
394-
<Input
395-
readOnly
396-
placeholder="Redirect URL"
397-
value={window.location.origin + "/oauth/callback"}
398-
className="font-mono"
399-
/>
400-
<label className="text-sm font-medium">Scope</label>
401-
<Input
402-
placeholder="Scope (space-separated)"
403-
onChange={(e) => setOauthScope(e.target.value)}
404-
value={oauthScope}
405-
data-testid="oauth-scope-input"
406-
className="font-mono"
407-
/>
408-
</div>
409-
)}
410-
</div>
411319
</>
412320
)}
413321

@@ -576,6 +484,94 @@ const Sidebar = ({
576484
</Tooltip>
577485
</div>
578486

487+
<div className="space-y-2">
488+
<Button
489+
variant="outline"
490+
onClick={() => setShowAuthConfig(!showAuthConfig)}
491+
className="flex items-center w-full"
492+
data-testid="auth-button"
493+
aria-expanded={showAuthConfig}
494+
>
495+
{showAuthConfig ? (
496+
<ChevronDown className="w-4 h-4 mr-2" />
497+
) : (
498+
<ChevronRight className="w-4 h-4 mr-2" />
499+
)}
500+
Authentication
501+
</Button>
502+
{showAuthConfig && (
503+
<>
504+
{/* Bearer Token Section */}
505+
<div className="space-y-2 p-3 rounded border">
506+
<h4 className="text-sm font-semibold flex items-center">
507+
API Token Authentication
508+
</h4>
509+
<div className="space-y-2">
510+
<label className="text-sm font-medium">Header Name</label>
511+
<Input
512+
placeholder="Authorization"
513+
onChange={(e) =>
514+
setHeaderName && setHeaderName(e.target.value)
515+
}
516+
data-testid="header-input"
517+
className="font-mono"
518+
value={headerName}
519+
/>
520+
<label
521+
className="text-sm font-medium"
522+
htmlFor="bearer-token-input"
523+
>
524+
Bearer Token
525+
</label>
526+
<Input
527+
id="bearer-token-input"
528+
placeholder="Bearer Token"
529+
value={bearerToken}
530+
onChange={(e) => setBearerToken(e.target.value)}
531+
data-testid="bearer-token-input"
532+
className="font-mono"
533+
type="password"
534+
/>
535+
</div>
536+
</div>
537+
{transportType !== "stdio" && (
538+
// OAuth Configuration
539+
<div className="space-y-2 p-3 rounded border">
540+
<h4 className="text-sm font-semibold flex items-center">
541+
OAuth 2.0 Flow
542+
</h4>
543+
<div className="space-y-2">
544+
<label className="text-sm font-medium">Client ID</label>
545+
<Input
546+
placeholder="Client ID"
547+
onChange={(e) => setOauthClientId(e.target.value)}
548+
value={oauthClientId}
549+
data-testid="oauth-client-id-input"
550+
className="font-mono"
551+
/>
552+
<label className="text-sm font-medium">
553+
Redirect URL
554+
</label>
555+
<Input
556+
readOnly
557+
placeholder="Redirect URL"
558+
value={window.location.origin + "/oauth/callback"}
559+
className="font-mono"
560+
/>
561+
<label className="text-sm font-medium">Scope</label>
562+
<Input
563+
placeholder="Scope (space-separated)"
564+
onChange={(e) => setOauthScope(e.target.value)}
565+
value={oauthScope}
566+
data-testid="oauth-scope-input"
567+
className="font-mono"
568+
/>
569+
</div>
570+
</div>
571+
)}
572+
</>
573+
)}
574+
</div>
579575
{/* Configuration */}
580576
<div className="space-y-2">
581577
<Button

0 commit comments

Comments
 (0)