scriptoriumadmin/litellm
1
0
Fork 0
mirror of https://github.com/BerriAI/litellm.git synced 2026-10-10 03:28:53 +00:00
Code Issues Projects Releases Packages Wiki Activity Actions 84

refactor(ui): tokenise the access group selector and drop its stale binding note

Browse source 
The selector takes value and onChange, which is exactly what lets it sit
inside both an antd Form.Item and a react-hook-form FormField, so the doc
bullet naming only antd was about to describe half the truth. The props
interface already states the contract.

That bullet was also the only Form.Item match in the file, and it has twice
inflated the migration's canonical tag count, which now needs no subtraction.

Its four hardcoded colours move to tokens for the same reason as the rest of
the sweep. Its antd Select stays.
This commit is contained in:
Yuneng Jiang 2026-08-18 15:35:35 -07:00
parent 78670789a0
commit fae700da36
No known key found for this signature in database
1 changed files with 4 additions and 5 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

9
ui/litellm-dashboard/src/components/common_components/AccessGroupSelector.tsx
View file

@ -22,7 +22,6 @@ export interface AccessGroupSelectorProps {
* - Displays the **access_group_name** in the dropdown.
* - Returns an array of **access_group_id** values.
* - Always multi-select since users can assign multiple access groups.
* - Integrates with Ant Design `<Form.Item>` out of the box via `value` / `onChange`.
*/
const AccessGroupSelector: React.FC<AccessGroupSelectorProps> = ({
value,
@ -42,7 +41,7 @@ const AccessGroupSelector: React.FC<AccessGroupSelectorProps> = ({
return (
<div>
{showLabel && (
<p className="text-sm font-medium block mb-2 text-gray-700 flex items-center">
<p className="mb-2 flex items-center text-sm font-medium text-foreground">
<TeamOutlined className="mr-2" /> {labelText}
</p>
)}
@ -56,7 +55,7 @@ const AccessGroupSelector: React.FC<AccessGroupSelectorProps> = ({
label: (
<span>
<span className="font-medium">{group.access_group_name}</span>{" "}
<span className="text-gray-400 text-xs">({group.access_group_id})</span>
<span className="text-xs text-muted-foreground">({group.access_group_id})</span>
</span>
),
value: group.access_group_id,
@ -68,7 +67,7 @@ const AccessGroupSelector: React.FC<AccessGroupSelectorProps> = ({
return (
<div>
{showLabel && (
<p className="text-sm font-medium block mb-2 text-gray-700 flex items-center">
<p className="mb-2 flex items-center text-sm font-medium text-foreground">
<TeamOutlined className="mr-2" /> {labelText}
</p>
)}
@ -83,7 +82,7 @@ const AccessGroupSelector: React.FC<AccessGroupSelectorProps> = ({
style={{ width: "100%", ...style }}
className={`rounded-md ${className ?? ""}`}
notFoundContent={
isError ? <span className="text-red-500">Failed to load access groups</span> : "No access groups found"
isError ? <span className="text-destructive">Failed to load access groups</span> : "No access groups found"
}
filterOption={(input, option) => {
const searchText = options.find((opt) => opt.value === option?.value)?.searchText ?? "";