scriptoriumadmin/litellm
1
0
Fork 0
mirror of https://github.com/BerriAI/litellm.git synced 2026-10-04 02:31:27 +00:00
Code Issues Projects Releases Packages Wiki Activity Actions 122

feat(ui): vector_store_management/TestVectorStoreTab to shadcn

Browse source 
- antd Card/Typography \u2192 shadcn Card + native <h5>/<p>. antd Select
  preserved (showSearch + Option custom renderer).
- Swept text-gray-500 to text-muted-foreground.

Gates: TS \u2713 | Build \u2713.

Co-authored-by: yuneng-jiang <yuneng-berri@users.noreply.github.com>
This commit is contained in:
Cursor Agent 2026-04-23 18:16:50 +00:00
parent 6e4eb8e648
commit 843d19c2aa
No known key found for this signature in database
1 changed files with 36 additions and 18 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

54
ui/litellm-dashboard/src/components/vector_store_management/TestVectorStoreTab.tsx
View file

@ -1,33 +1,39 @@
import React, { useState } from "react";
import { Card, Select, Typography } from "antd";
import { Select } from "antd";
import { Card } from "@/components/ui/card";
import { VectorStoreTester } from "./VectorStoreTester";
import { VectorStore } from "./types";
const { Text, Title } = Typography;
interface TestVectorStoreTabProps {
accessToken: string | null;
vectorStores: VectorStore[];
}
const TestVectorStoreTab: React.FC<TestVectorStoreTabProps> = ({ accessToken, vectorStores }) => {
const [selectedVectorStoreId, setSelectedVectorStoreId] = useState<string | undefined>(
vectorStores.length > 0 ? vectorStores[0].vector_store_id : undefined
);
const TestVectorStoreTab: React.FC<TestVectorStoreTabProps> = ({
accessToken,
vectorStores,
}) => {
const [selectedVectorStoreId, setSelectedVectorStoreId] = useState<
string | undefined
>(vectorStores.length > 0 ? vectorStores[0].vector_store_id : undefined);
if (!accessToken) {
return (
<Card>
<Text type="secondary">Access token is required to test vector stores.</Text>
<Card className="p-4">
<p className="text-muted-foreground">
Access token is required to test vector stores.
</p>
</Card>
);
}
if (vectorStores.length === 0) {
return (
<Card>
<Card className="p-4">
<div className="text-center py-8">
<Text type="secondary">No vector stores available. Create one first to test it.</Text>
<p className="text-muted-foreground">
No vector stores available. Create one first to test it.
</p>
</div>
</Card>
);
@ -35,11 +41,13 @@ const TestVectorStoreTab: React.FC<TestVectorStoreTabProps> = ({ accessToken, ve
return (
<div className="space-y-4">
<Card>
<Card className="p-4">
<div className="space-y-4">
<div>
<Title level={5}>Select Vector Store</Title>
<Text type="secondary">Choose a vector store to test search queries against</Text>
<h5 className="text-base font-semibold">Select Vector Store</h5>
<p className="text-muted-foreground text-sm">
Choose a vector store to test search queries against
</p>
</div>
<Select
@ -52,11 +60,18 @@ const TestVectorStoreTab: React.FC<TestVectorStoreTabProps> = ({ accessToken, ve
optionFilterProp="children"
>
{vectorStores.map((vs) => (
<Select.Option key={vs.vector_store_id} value={vs.vector_store_id}>
<Select.Option
key={vs.vector_store_id}
value={vs.vector_store_id}
>
<div className="flex flex-col">
<span className="font-medium">{vs.vector_store_name || vs.vector_store_id}</span>
<span className="font-medium">
{vs.vector_store_name || vs.vector_store_id}
</span>
{vs.vector_store_name && (
<span className="text-xs text-gray-500 font-mono">{vs.vector_store_id}</span>
<span className="text-xs text-muted-foreground font-mono">
{vs.vector_store_id}
</span>
)}
</div>
</Select.Option>
@ -66,7 +81,10 @@ const TestVectorStoreTab: React.FC<TestVectorStoreTabProps> = ({ accessToken, ve
</Card>
{selectedVectorStoreId && (
<VectorStoreTester vectorStoreId={selectedVectorStoreId} accessToken={accessToken} />
<VectorStoreTester
vectorStoreId={selectedVectorStoreId}
accessToken={accessToken}
/>
)}
</div>
);