From 1c0cfd7e3b72b8a1cf82d7dadef244b762adc3d5 Mon Sep 17 00:00:00 2001
From: yuneng-jiang <yuneng.jiang@gmail.com>
Date: Sat, 21 Feb 2026 17:11:53 -0800
Subject: [PATCH] fix: enforce 5-post limit in BlogDropdown and add cap test

---
 .../Navbar/BlogDropdown/BlogDropdown.tsx      |  2 +-
 .../__tests__/BlogDropdown.test.tsx           | 23 +++++++++++++++++++
 2 files changed, 24 insertions(+), 1 deletion(-)

diff --git a/ui/litellm-dashboard/src/components/Navbar/BlogDropdown/BlogDropdown.tsx b/ui/litellm-dashboard/src/components/Navbar/BlogDropdown/BlogDropdown.tsx
index 6f8b29f8805..022ebb1e68c 100644
--- a/ui/litellm-dashboard/src/components/Navbar/BlogDropdown/BlogDropdown.tsx
+++ b/ui/litellm-dashboard/src/components/Navbar/BlogDropdown/BlogDropdown.tsx
@@ -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}
diff --git a/ui/litellm-dashboard/src/components/Navbar/BlogDropdown/__tests__/BlogDropdown.test.tsx b/ui/litellm-dashboard/src/components/Navbar/BlogDropdown/__tests__/BlogDropdown.test.tsx
index f5a79648c77..6f448e5b60b 100644
--- a/ui/litellm-dashboard/src/components/Navbar/BlogDropdown/__tests__/BlogDropdown.test.tsx
+++ b/ui/litellm-dashboard/src/components/Navbar/BlogDropdown/__tests__/BlogDropdown.test.tsx
@@ -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"));