[Refactor] UI - Admin Page: Migrate to AntD Tabs#20465
Merged
yuneng-jiang merged 2 commits intomainfrom Feb 6, 2026
Merged
Conversation
|
The latest updates on your projects. Learn more about Vercel for GitHub.
|
Contributor
Greptile OverviewGreptile SummaryRefactors the AdminPanel component to migrate from Tremor's Key Changes:
Issues Found:
Confidence Score: 4/5
|
| Filename | Overview |
|---|---|
| ui/litellm-dashboard/src/components/admins.tsx | Migrated from Tremor tabs to Ant Design Tabs, removed unused admin/member management code, integrated useAuthorized hook |
| ui/litellm-dashboard/src/app/(dashboard)/settings/admin-settings/page.tsx | Simplified parent component by removing all prop drilling to AdminPanel |
| ui/litellm-dashboard/src/app/page.tsx | Updated import path and removed prop drilling to AdminPanel |
| ui/litellm-dashboard/src/components/Admins.test.tsx | Added comprehensive test coverage for AdminPanel component with all tabs, modals, and interactions |
Sequence Diagram
sequenceDiagram
participant User
participant AdminPanel
participant useAuthorized
participant Tabs
participant API
User->>AdminPanel: Load component
AdminPanel->>useAuthorized: Call hook
useAuthorized-->>AdminPanel: {accessToken, userId, premiumUser}
AdminPanel->>API: checkSSOConfiguration()
API->>API: getSSOSettings(accessToken)
API-->>AdminPanel: SSO configuration data
AdminPanel->>AdminPanel: setSsoConfigured(true/false)
AdminPanel->>Tabs: Render AntD Tabs
Tabs-->>User: Display tabs (SSO, Security, SCIM, UI Settings)
alt User clicks Security Settings tab
User->>Tabs: Click "Security Settings"
Tabs->>AdminPanel: Render Security Settings content
AdminPanel-->>User: Show SSO, Allowed IPs, UI Access Control buttons
alt User clicks Allowed IPs
User->>AdminPanel: Click "Allowed IPs"
AdminPanel->>AdminPanel: Check premiumUser
alt Premium user
AdminPanel->>API: getAllowedIPs(accessToken)
API-->>AdminPanel: IP list
AdminPanel->>AdminPanel: setAllowedIPs()
AdminPanel-->>User: Show IP management modal
else Non-premium user
AdminPanel-->>User: Show premium required message
end
end
alt User clicks UI Access Control
User->>AdminPanel: Click "UI Access Control"
AdminPanel->>AdminPanel: Check premiumUser
alt Premium user
AdminPanel-->>User: Show UI Access Control modal
else Non-premium user
AdminPanel-->>User: Show premium required message
end
end
end
![greptile-apps[bot]](https://avatars.githubusercontent.com/in/867647?s=60&v=4){kind=small}
Comment on lines
176
to
178
| useEffect(() => { | ||
| checkSSOConfiguration(); | ||
| }, [accessToken, premiumUser]); |
Contributor
There was a problem hiding this comment.
missing checkSSOConfiguration in dependency array
Suggested change
| useEffect(() => { | |
| checkSSOConfiguration(); | |
| }, [accessToken, premiumUser]); | |
| useEffect(() => { | |
| checkSSOConfiguration(); | |
| }, [accessToken, premiumUser, checkSSOConfiguration]); |
Prompt To Fix With AI
This is a comment left during a code review.
Path: ui/litellm-dashboard/src/components/admins.tsx
Line: 176:178
Comment:
missing `checkSSOConfiguration` in dependency array
```suggestion
useEffect(() => {
checkSSOConfiguration();
}, [accessToken, premiumUser, checkSSOConfiguration]);
```
How can I resolve this? If you propose a fix, please make it concise.
Comment on lines
345
to
347
| <a href={nonSssoUrl} target="_blank"> | ||
| <b>{nonSssoUrl}</b>{" "} | ||
| </a> |
Contributor
There was a problem hiding this comment.
missing rel="noopener noreferrer" security attribute
Suggested change
| <a href={nonSssoUrl} target="_blank"> | |
| <b>{nonSssoUrl}</b>{" "} | |
| </a> | |
| <a href={nonSssoUrl} target="_blank" rel="noopener noreferrer"> | |
| <b>{nonSssoUrl}</b>{" "} | |
| </a> |
Prompt To Fix With AI
This is a comment left during a code review.
Path: ui/litellm-dashboard/src/components/admins.tsx
Line: 345:347
Comment:
missing `rel="noopener noreferrer"` security attribute
```suggestion
<a href={nonSssoUrl} target="_blank" rel="noopener noreferrer">
<b>{nonSssoUrl}</b>{" "}
</a>
```
How can I resolve this? If you propose a fix, please make it concise.
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
1 participant
Add this suggestion to a batch that can be applied as a single commit.This suggestion is invalid because no changes were made to the code.Suggestions cannot be applied while the pull request is closed.Suggestions cannot be applied while viewing a subset of changes.Only one suggestion per line can be applied in a batch.Add this suggestion to a batch that can be applied as a single commit.Applying suggestions on deleted lines is not supported.You must change the existing code in this line in order to create a valid suggestion.Outdated suggestions cannot be applied.This suggestion has been applied or marked resolved.Suggestions cannot be applied from pending reviews.Suggestions cannot be applied on multi-line comments.Suggestions cannot be applied while the pull request is queued to merge.Suggestion cannot be applied right now. Please check back later.
Relevant issues
Pre-Submission checklist
Please complete all items before asking a LiteLLM maintainer to review your PR
tests/litellm/directory, Adding at least 1 test is a hard requirement - see detailsmake test-unitCI (LiteLLM team)
Branch creation CI run
Link:
CI run for the last commit
Link:
Merge / cherry-pick CI run
Links:
Type
🧹 Refactoring
✅ Test
Changes
Migrates the AdminPanel component from Tremor tabs (
TabGroup,TabList,Tab,TabPanel,TabPanels) to Ant DesignTabscomponent. This is a test migration on a moderately used page (admin settings) rather than a heavily used page to validate the migration approach before applying it more broadly. Refactors the component to use theuseAuthorizedhook instead of prop drilling, removes unused member and admin management code, and adds comprehensive test coverage.Screenshots