scriptoriumadmin/litellm
1
0
Fork 0
mirror of https://github.com/BerriAI/litellm.git synced 2026-11-13 08:52:02 +00:00
Code Issues Projects Releases Packages Wiki Activity Actions 174

fix(ui): preserve credential actions menu across panel refreshes

Browse source 
Co-Authored-By: Devin AI <158243242+devin-ai-integration[bot]@users.noreply.github.com>
This commit is contained in:
mateo 2026-11-10 02:59:56 +00:00
parent a56a27deb6
commit f6ba209e03
2 changed files with 34 additions and 5 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

29
ui/litellm-dashboard/src/components/model_add/CredentialsPanel.test.tsx
View file

@ -111,6 +111,35 @@ const renderPanel = () =>
);
describe("CredentialsPanel", () => {
it("keeps an open credential menu usable when the panel refreshes", async () => {
const user = userEvent.setup();
mockUseAuthorized.mockReturnValue({ accessToken: "test-token", userRole: "Admin" });
mockUseCredentials.mockReturnValue({ data: { credentials }, isLoading: false, refetch: vi.fn() });
const client = createQueryClient();
const panel = (
<QueryClientProvider client={client}>
<CredentialsPanel />
</QueryClientProvider>
);
const { rerender } = render(panel);
await user.click(screen.getByTestId("credential-actions-openai-key"));
expect(await screen.findByTestId("credential-action-edit")).toBeInTheDocument();
mockUseCredentials.mockReturnValue({
data: { credentials: credentials.map((credential) => ({ ...credential })) },
isLoading: false,
refetch: vi.fn(),
});
rerender(
<QueryClientProvider client={client}>
<CredentialsPanel />
</QueryClientProvider>,
);
await user.click(screen.getByTestId("credential-action-edit"));
expect(screen.getByTestId("credential-modal-edit-submit")).toBeInTheDocument();
});
beforeEach(() => {
vi.clearAllMocks();
});

10
ui/litellm-dashboard/src/components/model_add/CredentialsPanel.tsx
View file

@ -2,7 +2,7 @@
import { useTerminology } from "@/contexts/TerminologyContext";
import { Plus } from "lucide-react";
import { useState } from "react";
import { useCallback, useState } from "react";
import { useTranslation } from "react-i18next";
import { useCredentials } from "@/app/(dashboard)/hooks/credentials/useCredentials";
@ -91,15 +91,15 @@ export default function CredentialsPanel() {
}
};
const openEditModal = (credential: CredentialItem) => {
const openEditModal = useCallback((credential: CredentialItem) => {
setSelectedCredential(credential);
setIsUpdateModalOpen(true);
};
}, []);
const openDeleteModal = (credential: CredentialItem) => {
const openDeleteModal = useCallback((credential: CredentialItem) => {
setCredentialToDelete(credential);
setIsDeleteModalOpen(true);
};
}, []);
const closeDeleteModal = () => {
setCredentialToDelete(null);