mirror of
https://github.com/BerriAI/litellm.git
synced 2026-09-06 08:16:43 +00:00
fix(ui): withhold the tag list until it resolves
The usage page seeded its tag list as an empty array, so between first paint and the tag request landing the filter had a resolved-looking empty list and showed "No tags with usage in this range" for a scope nobody had measured yet. Seed it as null instead, which the filter already treats as unresolved and hides, so the empty state only appears once the list has actually come back.
This commit is contained in:
parent
21bb011770
commit
13b5c80c90
2 changed files with 25 additions and 1 deletions
|
|
@ -586,6 +586,30 @@ describe("UsagePage", () => {
|
|||
});
|
||||
});
|
||||
|
||||
it("should withhold the tag list until it resolves so no empty state is shown while loading", async () => {
|
||||
let resolveTagList: (tags: Record<string, unknown>) => void = () => {};
|
||||
mockTagListCall.mockReturnValue(
|
||||
new Promise((resolve) => {
|
||||
resolveTagList = resolve;
|
||||
}) as ReturnType<typeof networking.tagListCall>,
|
||||
);
|
||||
|
||||
renderWithProviders(<UsagePage {...defaultProps} />);
|
||||
|
||||
act(() => {
|
||||
fireEvent.change(screen.getByTestId("usage-view-select"), { target: { value: "tag" } });
|
||||
});
|
||||
|
||||
const entityUsage = await screen.findByTestId("entity-usage");
|
||||
expect(entityUsage).toHaveAttribute("data-entity-list", "null");
|
||||
|
||||
await act(async () => {
|
||||
resolveTagList({});
|
||||
});
|
||||
|
||||
expect(screen.getByTestId("entity-usage")).toHaveAttribute("data-entity-list", "[]");
|
||||
});
|
||||
|
||||
it("should show tag usage selector option for internal users", async () => {
|
||||
mockUseAuthorized.mockReturnValue({
|
||||
isLoading: false,
|
||||
|
|
|
|||
|
|
@ -96,7 +96,7 @@ const UsagePage: React.FC<UsagePageProps> = ({ teams, organizations }) => {
|
|||
to: initialToDate,
|
||||
});
|
||||
|
||||
const [allTags, setAllTags] = useState<EntityList[]>([]);
|
||||
const [allTags, setAllTags] = useState<EntityList[] | null>(null);
|
||||
const { data: customers = [] } = useCustomers();
|
||||
const { data: agentsResponse } = useAgents();
|
||||
const { data: currentUser } = useCurrentUser();
|
||||
|
|
|
|||
Loading…
Add table
Reference in a new issue