From 8508754467d2a8662331b5e9f84f225da2f27c78 Mon Sep 17 00:00:00 2001
From: Kian Newman-Hazel <kian@cloudflare.com>
Date: Wed, 16 Apr 2025 19:08:08 +0100
Subject: [PATCH 1/4] [Docs Site] Align filter/load more logic in changelog

---
 src/pages/changelog/index.astro | 87 ++++++++-------------------------
 1 file changed, 21 insertions(+), 66 deletions(-)

diff --git a/src/pages/changelog/index.astro b/src/pages/changelog/index.astro
index d0cc271739f47eb..489a2fb0b66c85b 100644
--- a/src/pages/changelog/index.astro
+++ b/src/pages/changelog/index.astro
@@ -89,7 +89,7 @@ const props = {
 	<div class="flex items-center justify-center">
 		<button
 			id="changelogs-next-button"
-			class="h-12 cursor-pointer rounded bg-cl1-brand-orange px-6 font-medium text-cl1-black"
+			class="bg-cl1-brand-orange text-cl1-black h-12 cursor-pointer rounded px-6 font-medium"
 		>
 			Load more items
 		</button>
@@ -114,37 +114,26 @@ const props = {
 
 	filter?.addEventListener("change", updateFilter);
 
-	button?.addEventListener("click", () => {
-		const entries = [
-			...document.querySelectorAll<HTMLElement>("[data-products]"),
-		];
-
-		if (!entries) return;
-
-		const value = filter!.value;
-
-		const hidden = entries
-			.filter((e) => {
-				if (e.style.display !== "none") {
-					return false;
-				}
-
-				if (value === "all") {
-					return true;
-				}
-
-				if (!e.dataset.products) {
-					return false;
-				}
+	function filterByProduct(e: HTMLElement, value: string): boolean {
+		if (value === "all") {
+			return true;
+		}
 
-				const products: string[] = JSON.parse(e.dataset.products);
+		if (!e.dataset.products) {
+			return false;
+		}
 
-				if (products.includes(value)) {
-					return true;
-				}
+		const products: string[] = JSON.parse(e.dataset.products);
+		return products.includes(value);
+	}
 
-				return false;
-			})
+	button?.addEventListener("click", () => {
+		const hidden = [
+			...document.querySelectorAll<HTMLElement>("[data-products]"),
+		]
+			.filter(
+				(e) => e.style.display === "none" && filterByProduct(e, filter!.value),
+			)
 			.slice(0, 10);
 
 		hidden.forEach((e) => (e.style.display = ""));
@@ -162,24 +151,8 @@ const props = {
 		const value = filter!.value;
 
 		const filtered = entries
-			.filter((e) => {
-				if (value === "all") {
-					return true;
-				}
-
-				if (!e.dataset.products) {
-					return false;
-				}
-
-				const products: string[] = JSON.parse(e.dataset.products);
-
-				if (products.includes(value)) {
-					return true;
-				}
-
-				return false;
-			})
-			.slice(0, 5);
+			.filter((e) => filterByProduct(e, value))
+			.slice(0, 10);
 
 		for (const entry of entries) {
 			const show = filtered.includes(entry);
@@ -211,25 +184,7 @@ const props = {
 
 		if (entries.length === 0) return;
 
-		const filtered = entries.filter((p) => {
-			const value = filter!.value;
-
-			if (value === "all") {
-				return true;
-			}
-
-			if (!p.dataset.products) {
-				return false;
-			}
-
-			const products: string[] = JSON.parse(p.dataset.products);
-
-			if (!products.includes(value)) {
-				return false;
-			}
-
-			return true;
-		});
+		const filtered = entries.filter((p) => filterByProduct(p, filter!.value));
 
 		const visible = filtered.filter((p) => p.style.display !== "none");
 		const hidden = filtered.length - visible.length;

From 9cba41fb5d6e01fb425db31165945ec382fc81d5 Mon Sep 17 00:00:00 2001
From: Kian Newman-Hazel <kian@cloudflare.com>
Date: Wed, 16 Apr 2025 19:10:54 +0100
Subject: [PATCH 2/4] fix button visibility

---
 src/pages/changelog/index.astro | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/src/pages/changelog/index.astro b/src/pages/changelog/index.astro
index 489a2fb0b66c85b..39c0724214bb23f 100644
--- a/src/pages/changelog/index.astro
+++ b/src/pages/changelog/index.astro
@@ -189,7 +189,7 @@ const props = {
 		const visible = filtered.filter((p) => p.style.display !== "none");
 		const hidden = filtered.length - visible.length;
 
-		if (hidden >= 10) {
+		if (hidden > 0) {
 			button!.style.display = "";
 		} else {
 			button!.style.display = "none";

From 19c9dd594bcffdf737ba9465f551a3bbe20136ec Mon Sep 17 00:00:00 2001
From: Kody Jackson <kody@cloudflare.com>
Date: Wed, 16 Apr 2025 14:00:16 -0500
Subject: [PATCH 3/4] Update src/pages/changelog/index.astro

---
 src/pages/changelog/index.astro | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/src/pages/changelog/index.astro b/src/pages/changelog/index.astro
index 39c0724214bb23f..1c35da639c0838b 100644
--- a/src/pages/changelog/index.astro
+++ b/src/pages/changelog/index.astro
@@ -189,7 +189,7 @@ const props = {
 		const visible = filtered.filter((p) => p.style.display !== "none");
 		const hidden = filtered.length - visible.length;
 
-		if (hidden > 0) {
+		if (hidden > 0)  {
 			button!.style.display = "";
 		} else {
 			button!.style.display = "none";

From a337c45beb6d321abc5dd5223a7d1fb5df532f90 Mon Sep 17 00:00:00 2001
From: Kody Jackson <kody@cloudflare.com>
Date: Wed, 16 Apr 2025 14:00:28 -0500
Subject: [PATCH 4/4] Update src/pages/changelog/index.astro

---
 src/pages/changelog/index.astro | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/src/pages/changelog/index.astro b/src/pages/changelog/index.astro
index 1c35da639c0838b..39c0724214bb23f 100644
--- a/src/pages/changelog/index.astro
+++ b/src/pages/changelog/index.astro
@@ -189,7 +189,7 @@ const props = {
 		const visible = filtered.filter((p) => p.style.display !== "none");
 		const hidden = filtered.length - visible.length;
 
-		if (hidden > 0)  {
+		if (hidden > 0) {
 			button!.style.display = "";
 		} else {
 			button!.style.display = "none";