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

chore(ui): remove dead compareUI ModelSelector and its test

Browse source 
Co-Authored-By: Devin AI <158243242+devin-ai-integration[bot]@users.noreply.github.com>
This commit is contained in:
mateo 2026-09-17 20:04:26 +00:00
parent decbb96382
commit b57104be33
2 changed files with 0 additions and 146 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

61
ui/litellm-dashboard/src/app/(dashboard)/playground/components/compareUI/components/ModelSelector.test.tsx
View file

@ -1,61 +0,0 @@
import { render, screen } from "@testing-library/react";
import userEvent from "@testing-library/user-event";
import { describe, expect, it, vi } from "vitest";
import { ModelSelector } from "./ModelSelector";
const MODELS = ["gpt-4", "gpt-3.5-turbo"];
describe("ModelSelector", () => {
it("should render", () => {
render(<ModelSelector value="" onChange={vi.fn()} models={MODELS} />);
expect(screen.getByRole("combobox")).toBeInTheDocument();
});
it("reports the model the user picks from the dropdown", async () => {
const user = userEvent.setup();
const onChange = vi.fn();
render(<ModelSelector value="" onChange={onChange} models={MODELS} />);
await user.click(screen.getByRole("combobox"));
await user.click(await screen.findByRole("option", { name: "gpt-4" }));
expect(onChange).toHaveBeenCalledWith("gpt-4");
});
it("displays a custom value that is not one of the known models", () => {
render(<ModelSelector value="custom-model-123" onChange={vi.fn()} models={MODELS} />);
expect(screen.getByRole("combobox")).toHaveValue("custom-model-123");
});
it("reports a custom model typed into the custom name field", async () => {
const user = userEvent.setup();
const onChange = vi.fn();
render(<ModelSelector value="" onChange={onChange} models={MODELS} />);
await user.click(screen.getByRole("combobox"));
await user.click(await screen.findByRole("option", { name: "+ Add custom model" }));
await user.type(await screen.findByPlaceholderText("Custom Model Name (Enter to add)"), "my-custom-model{Enter}");
expect(onChange).toHaveBeenCalledWith("my-custom-model");
});
it("disables the control when disabled is set", async () => {
const user = userEvent.setup();
const onChange = vi.fn();
const { rerender } = render(<ModelSelector value="custom-model-123" onChange={onChange} models={MODELS} />);
expect(screen.getByRole("combobox")).toBeEnabled();
rerender(<ModelSelector value="custom-model-123" onChange={onChange} models={MODELS} disabled={true} />);
const combobox = screen.getByRole("combobox");
expect(combobox).toBeDisabled();
await user.click(combobox);
await user.keyboard("gpt-4");
expect(combobox).toHaveValue("custom-model-123");
expect(screen.queryByRole("option")).not.toBeInTheDocument();
expect(onChange).not.toHaveBeenCalled();
});
});

85
ui/litellm-dashboard/src/app/(dashboard)/playground/components/compareUI/components/ModelSelector.tsx
View file

@ -1,85 +0,0 @@
import React, { useMemo, useState } from "react";
import { SearchSelect } from "@/components/shared/SearchSelect";
import { Input } from "@/components/ui/input";
interface ModelSelectorProps {
value: string;
onChange: (value: string) => void;
models: string[];
loading?: boolean;
disabled?: boolean;
}
export function ModelSelector({ value, onChange, models, loading, disabled }: ModelSelectorProps) {
const [isAddingCustom, setIsAddingCustom] = useState(false);
const [customValue, setCustomValue] = useState("");
const options = useMemo(() => Array.from(new Set(models)).sort(), [models]);
const displayOptions = useMemo(() => {
if (value && !options.includes(value)) {
return [value, ...options];
}
return options;
}, [options, value]);
const selectValue = isAddingCustom ? "__custom__" : value || undefined;
const handleSelectChange = (selected: string | null) => {
if (selected === null) return;
if (selected === "__custom__") {
setIsAddingCustom(true);
if (value && !options.includes(value)) {
setCustomValue(value);
} else {
setCustomValue("");
}
return;
}
setIsAddingCustom(false);
setCustomValue("");
onChange(selected);
};
const commitCustomValue = () => {
const trimmed = customValue.trim();
if (!trimmed) {
setIsAddingCustom(false);
setCustomValue("");
return;
}
onChange(trimmed);
setIsAddingCustom(false);
setCustomValue("");
};
return (
<div className="flex-1 min-w-0">
<SearchSelect
options={[
...displayOptions.map((model) => ({ label: model, value: model })),
{ label: "+ Add custom model", value: "__custom__" },
]}
value={selectValue ?? ""}
onValueChange={handleSelectChange}
disabled={disabled}
placeholder={loading ? "Loading models..." : "Select a model"}
emptyText="No models found"
allowClear={false}
className="rounded-md"
/>
{isAddingCustom && (
<Input
className="mt-2"
placeholder="Custom Model Name (Enter to add)"
value={customValue}
onChange={(e) => setCustomValue(e.target.value)}
onKeyDown={(event) => {
if (event.key === "Enter") {
event.preventDefault();
commitCustomValue();
}
}}
onBlur={commitCustomValue}
autoFocus
/>
)}
</div>
);
}