From 8c4721bcbd86371f1856a858ac67a319bc5177bc Mon Sep 17 00:00:00 2001
From: Ryan Salazar <ryaninwilton@gmail.com>
Date: Tue, 26 May 2026 19:24:18 +0000
Subject: [PATCH] =?UTF-8?q?homepage:=20All=20featured=20=E2=86=92=20goes?=
 =?UTF-8?q?=20to=20dedicated=20/news/featured=20page?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

Was linking to /news?category=Featured which silently fell back to the
unfiltered /news listing because "Featured" isn't in CATEGORIES and the
filter is tag-based, not category-column-based.

Adds getLegacyFeaturedArticles() that mirrors FeaturedBento's query
(category ILIKE 'featured', featured-flag-first sort) at limit 200, and
a thin /news/featured route that reuses NewsPageClient.
---
 src/app/news/featured/page.tsx         | 22 ++++++++++++++++++++++
 src/components/FeaturedBentoFromDb.tsx |  2 +-
 src/lib/articles/legacy-source.ts      | 17 +++++++++++++++++
 3 files changed, 40 insertions(+), 1 deletion(-)
 create mode 100644 src/app/news/featured/page.tsx

diff --git a/src/app/news/featured/page.tsx b/src/app/news/featured/page.tsx
new file mode 100644
index 0000000..b74787c
--- /dev/null
+++ b/src/app/news/featured/page.tsx
@@ -0,0 +1,22 @@
+import type { Metadata } from "next";
+import { Suspense } from "react";
+import NewsPageClient from "../NewsPageClient";
+import { getLegacyFeaturedArticles } from "@/lib/articles/legacy-source";
+
+export const revalidate = 1800;
+
+export const metadata: Metadata = {
+  title: "Featured Stories — Broadcast Beat",
+  description:
+    "Editorial picks from the Broadcast Beat staff — the most important industry stories, hand-selected from across broadcast engineering, IP/cloud workflows, streaming, AI, and live production.",
+  alternates: { canonical: "/news/featured" },
+};
+
+export default async function FeaturedNewsPage() {
+  const articles = await getLegacyFeaturedArticles(200);
+  return (
+    <Suspense fallback={null}>
+      <NewsPageClient articles={articles} />
+    </Suspense>
+  );
+}
diff --git a/src/components/FeaturedBentoFromDb.tsx b/src/components/FeaturedBentoFromDb.tsx
index d8aac6a..a8a52a9 100644
--- a/src/components/FeaturedBentoFromDb.tsx
+++ b/src/components/FeaturedBentoFromDb.tsx
@@ -66,7 +66,7 @@ export default async function FeaturedBento() {
       <div className="flex items-center gap-3 mb-4 md:mb-5 flex-wrap">
         <span className="section-label">Staff Editorial</span>
         <div className="flex-1 h-px bg-[#2a2a2a]" />
-        <Link href="/news?category=Featured" className="text-[11px] font-mono text-[var(--color-text-info,#60a5fa)] hover:underline whitespace-nowrap">
+        <Link href="/news/featured" className="text-[11px] font-mono text-[var(--color-text-info,#60a5fa)] hover:underline whitespace-nowrap">
           All featured →
         </Link>
       </div>
diff --git a/src/lib/articles/legacy-source.ts b/src/lib/articles/legacy-source.ts
index 9a74e58..3fa45e8 100644
--- a/src/lib/articles/legacy-source.ts
+++ b/src/lib/articles/legacy-source.ts
@@ -317,6 +317,23 @@ export async function getLegacyArticlesBySection(
   return merged.slice(0, limit).map((m) => m.article);
 }
 
+export async function getLegacyFeaturedArticles(limit = 200): Promise<Article[]> {
+  try {
+    const { data, error } = await client()
+      .from("wp_imported_posts")
+      .select(SELECT_COLS + ",featured")
+      .eq("status", "published")
+      .ilike("category", "featured")
+      .order("featured", { ascending: false })
+      .order("wp_published_at", { ascending: false, nullsFirst: false })
+      .limit(limit);
+    if (error || !data) return [];
+    return (data as ImportedPostRow[]).map((r) => rowToArticle(r));
+  } catch {
+    return [];
+  }
+}
+
 // Default raised from 50 → 5000 because users expect search to return
 // every match. The 29k-article archive is small enough that title/excerpt
 // ilike filters stay fast even without an explicit cap. Pass a smaller