scriptoriumadmin/litellm
1
0
Fork 0
mirror of https://github.com/BerriAI/litellm.git synced 2026-09-12 23:01:41 +00:00
Code Issues Projects Releases Packages Wiki Activity Actions 182

Merge pull request #19114 from BerriAI/litellm_ui_header_buttons

Browse source 
[Feature] UI - Community Engagement Buttons
This commit is contained in:
yuneng-jiang 2026-01-15 15:50:02 -08:00 • committed by GitHub
commit 542248adb9
No known key found for this signature in database
GPG key ID: B5690EEEBB952194
2 changed files with 41 additions and 1 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

20
ui/litellm-dashboard/src/components/navbar.test.tsx
View file

@ -61,6 +61,26 @@ describe("Navbar", () => {
expect(screen.getByText("User")).toBeInTheDocument();
});
it("should render Join Slack button with correct link", () => {
renderWithProviders(<Navbar {...defaultProps} />);
const joinSlackLink = screen.getByRole("link", { name: /join slack/i });
expect(joinSlackLink).toBeInTheDocument();
expect(joinSlackLink).toHaveAttribute("href", "https://www.litellm.ai/support");
expect(joinSlackLink).toHaveAttribute("target", "_blank");
expect(joinSlackLink).toHaveAttribute("rel", "noopener noreferrer");
});
it("should render Star us on GitHub button with correct link", () => {
renderWithProviders(<Navbar {...defaultProps} />);
const starOnGithubLink = screen.getByRole("link", { name: /star us on github/i });
expect(starOnGithubLink).toBeInTheDocument();
expect(starOnGithubLink).toHaveAttribute("href", "https://github.com/BerriAI/litellm");
expect(starOnGithubLink).toHaveAttribute("target", "_blank");
expect(starOnGithubLink).toHaveAttribute("rel", "noopener noreferrer");
});
it("should display user information in dropdown", async () => {
const user = userEvent.setup();
renderWithProviders(<Navbar {...defaultProps} />);

22
ui/litellm-dashboard/src/components/navbar.tsx
View file

@ -11,15 +11,17 @@ import {
import { fetchProxySettings } from "@/utils/proxyUtils";
import {
CrownOutlined,
GithubOutlined,
LogoutOutlined,
MailOutlined,
MenuFoldOutlined,
MenuUnfoldOutlined,
SafetyOutlined,
SlackOutlined,
UserOutlined,
} from "@ant-design/icons";
import type { MenuProps } from "antd";
import { Dropdown, Switch, Tooltip } from "antd";
import { Button, Dropdown, Switch, Tooltip } from "antd";
import Link from "next/link";
import React, { useEffect, useState } from "react";
@ -207,6 +209,24 @@ const Navbar: React.FC<NavbarProps> = ({
</div>
{/* Right side nav items */}
<div className="flex items-center space-x-5 ml-auto">
<Button
href="https://www.litellm.ai/support"
target="_blank"
rel="noopener noreferrer"
icon={<SlackOutlined />}
className="shadow-md shadow-indigo-500/20 hover:shadow-indigo-500/50 transition-shadow"
>
Join Slack
</Button>
<Button
href="https://github.com/BerriAI/litellm"
target="_blank"
rel="noopener noreferrer"
className="shadow-md shadow-indigo-500/20 hover:shadow-indigo-500/50 transition-shadow"
icon={<GithubOutlined />}
>
Star us on GitHub
</Button>
<a
href="https://docs.litellm.ai/docs/"
target="_blank"