litellm/ui
yuneng-jiang 573aa61084
refactor(ui): move the shared key form controls off antd onto shadcn (#37348)
* test(ui): pin the antd submit payloads for the key create and edit forms

Characterization only, no source change. Both suites are green against the
current antd components, so they can gate the react-hook-form migration that
follows without being edited.

key_edit_view had no exact-payload assertion, only objectContaining, so nothing
caught a form that started sending server-only key fields. The new case asserts
the whole object.

create_key_button's existing suite runs against a hand-rolled antd fake and
stubs out KeyLifecycleSettings and RateLimitTypeFormItem, so neither the real
store nor those two controls were covered. The new file drives the real antd
form and pins the network payload instead.

* refactor(ui): move the shared key form controls off antd onto shadcn

KeyLifecycleSettings and RateLimitTypeFormItem each owned an antd Form.Item and
took the parent's FormInstance as a prop, so neither could be hosted by anything
but an antd form. That is what made the key create and edit forms one
inseparable migration unit.

Both are now presentational: they take value and onChange and let the parent own
the binding, so an antd Form.Item and a react-hook-form FormField can host them
equally. The two parents keep their antd forms for now and pass the binding down
unchanged, which is why every existing payload assertion still holds.

Controls are shadcn Select, Input, Switch and Checkbox on semantic colour
tokens, so both are dark-mode ready. The rotation notice keeps its blue hue and
gains a dark variant rather than flattening to a neutral.

The form prop the two components took was already inert: antd dispatches its own
store update before calling the child's onChange, so setFieldValue was writing a
value the store had just been given.

KeyLifecycleSettings.test.tsx keeps every assertion; only the harness moves the
duration binding up into a Form.Item, and one case disables user-event's
pointer-events check because Base UI leaves a reopened select popup inert under
jsdom, reproduced on a bare shadcn Select with none of this code involved.

* test(ui): pin the role-gated key fields and tidy the new assertions

Adds the case that proves policies and prompts leave the payload entirely for a
role that cannot see them, which a react-hook-form port would otherwise start
sending from defaultValues. Green against antd like the rest.

Also hoists the two large expected payloads into named constants and drops two
unused exports, so the lane adds no new lint-budget pressure.

* fix(ui): give the key expiry input and Never Expire checkbox separate labels

The expiry label carried htmlFor for the duration input while also wrapping
the Never Expire checkbox and its own label, so the two controls shared one
ambiguous association. Splitting the row into a plain container with a label
per control makes each name resolve to the control it describes.

Also drops the prop and test comments added in this branch, which the
repository comment policy does not allow.

* test(ui): pin the create-form expiry binding to the generate payload

create_key_button coalesces a missing or blank duration to null before it
calls keyCreateCall, so the key is present in the payload whether or not the
control is bound to the form. Every existing case stayed green with the
Form.Item removed, which left the binding uncovered.

The new case opens Key Lifecycle, types an expiry, and asserts it arrives as
that value. Proven red with the Form.Item removed and green with it restored.
2026-08-18 14:28:03 -07:00
..
litellm-dashboard refactor(ui): move the shared key form controls off antd onto shadcn (#37348) 2026-08-18 14:28:03 -07:00
Dockerfile chore(build): move the Admin UI toolchain to Node 24 (#35801) 2026-08-04 12:36:07 -07:00
nginx.conf fix(ui): serve /ui/assets from the nginx image instead of SPA fallback (#34066) 2026-07-21 09:22:02 -07:00