fix: enforce 5-post limit in BlogDropdown and add cap test

This commit is contained in:
yuneng-jiang 2026-02-21 17:11:53 -08:00
parent e241e6fd45
commit 1c0cfd7e3b
2 changed files with 24 additions and 1 deletions

View file

@ -77,7 +77,7 @@ export const BlogDropdown: React.FC = () => {
return (
<div style={{ minWidth: 280, maxWidth: 360 }}>
{data.posts.map((post, index) => (
{data.posts.slice(0, 5).map((post, index) => (
<a
key={index}
href={post.url}

View file

@ -72,6 +72,29 @@ describe("BlogDropdown", () => {
});
});
it("shows at most 5 posts", async () => {
const manyPosts = Array.from({ length: 8 }, (_, i) => ({
title: `Post ${i + 1}`,
description: `Description ${i + 1}`,
date: "2026-02-01",
url: `https://www.litellm.ai/blog/post-${i + 1}`,
}));
global.fetch = vi.fn().mockResolvedValueOnce({
ok: true,
json: async () => ({ posts: manyPosts }),
});
render(<BlogDropdown />, { wrapper: createWrapper() });
fireEvent.click(screen.getByText("Blog"));
await waitFor(() => {
expect(screen.getByText("Post 1")).toBeInTheDocument();
expect(screen.getByText("Post 5")).toBeInTheDocument();
expect(screen.queryByText("Post 6")).not.toBeInTheDocument();
});
});
it("shows error message and Retry button on fetch failure", async () => {
global.fetch = vi.fn().mockRejectedValueOnce(new Error("Network error"));