mirror of
https://github.com/BerriAI/litellm.git
synced 2026-10-08 03:08:45 +00:00
feat(chat-ui): add MCP OAuth2 value prop and OAuth2 pill on server cards
- Add subtitle in chat empty state explaining MCP OAuth2 value prop with 'Open Apps' link - Update MCPAppsPanel header copy to explain the flow more clearly - Show OAuth2 pill badge on server cards where auth_type is oauth2
This commit is contained in:
parent
9543d785b5
commit
0e0657b949
2 changed files with 21 additions and 2 deletions
|
|
@ -944,10 +944,20 @@ const ChatPage: React.FC<ChatPageProps> = ({ accessToken, userRole, userId, user
|
|||
: greeting}
|
||||
</h1>
|
||||
|
||||
{isComparisonMode && (
|
||||
{isComparisonMode ? (
|
||||
<p style={{ margin: "-16px 0 24px", fontSize: 14, color: "#6b7280", textAlign: "center" }}>
|
||||
Send a message to see responses side-by-side
|
||||
</p>
|
||||
) : (
|
||||
<p style={{ margin: "-16px 0 28px", fontSize: 14, color: "#6b7280", textAlign: "center", maxWidth: 520, lineHeight: 1.6 }}>
|
||||
Chat with 100+ LLMs + MCP tools — authenticate once, use them here.{" "}
|
||||
<button
|
||||
onClick={() => setSidebarView("apps")}
|
||||
style={{ background: "none", border: "none", cursor: "pointer", color: "#1677ff", fontSize: 14, padding: 0, fontWeight: 500 }}
|
||||
>
|
||||
Open Apps →
|
||||
</button>
|
||||
</p>
|
||||
)}
|
||||
|
||||
{/* Input card */}
|
||||
|
|
|
|||
|
|
@ -174,7 +174,7 @@ const MCPAppsPanel: React.FC<Props> = ({ accessToken, selectedServers, onChange
|
|||
}}>Beta</span>
|
||||
</div>
|
||||
<p style={{ margin: 0, fontSize: 13, color: "#6b7280" }}>
|
||||
Connect tools to your chat.
|
||||
Browse tools, authenticate once, use in chat — no setup needed.
|
||||
</p>
|
||||
</div>
|
||||
<Input
|
||||
|
|
@ -261,6 +261,15 @@ const MCPAppsPanel: React.FC<Props> = ({ accessToken, selectedServers, onChange
|
|||
{isConnected && (
|
||||
<span style={{ width: 7, height: 7, borderRadius: "50%", background: "#1677ff", flexShrink: 0 }} />
|
||||
)}
|
||||
{server.auth_type === "oauth2" && (
|
||||
<span style={{
|
||||
fontSize: 10, fontWeight: 600, color: "#7c3aed",
|
||||
background: "#f3e8ff", borderRadius: 4, padding: "1px 5px",
|
||||
letterSpacing: "0.03em", flexShrink: 0, whiteSpace: "nowrap",
|
||||
}}>
|
||||
OAuth2
|
||||
</span>
|
||||
)}
|
||||
<RightOutlined style={{ fontSize: 11, color: "#d1d5db", flexShrink: 0 }} />
|
||||
</div>
|
||||
);
|
||||
|
|
|
|||
Loading…
Add table
Reference in a new issue