From 2e787262918366b127fd676679d541afe41abbae Mon Sep 17 00:00:00 2001
From: Ryan Salazar <ryaninwilton@gmail.com>
Date: Wed, 27 May 2026 12:55:25 +0000
Subject: [PATCH] cross-link: forum auto-link, NAB hub, sponsor strip, recent
 stories
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

Feature 3 — forum auto-linking
  Thread + reply bodies in /forum/thread/[id] now wrap company-name
  mentions with /manufacturers/<slug> links via a new client-side
  LinkifyPlainText component. Loads the directory list once per page
  (module-level promise cache), regex-scans each body, preserves
  whitespace, caps at 10 links per body to avoid clutter.
  CompanyMentionsHover mounted on the page so the same preview card
  pops on hover.
  Adds /api/public/companies/list — minimal { name, slug } directory
  feed, cached 10min.

Feature 4 — /nab-2026 live coverage hub
  New page aggregating every directory company with exhibits_nab=true.
  Three sections:
    - Coverage Partners — active advertisers exhibiting at NAB, larger
      tiles with emerald Sponsor border
    - Latest from the show floor — last 60 days of articles with NAB
      in the title, cinematic grid
    - All NAB 2026 exhibitors — alphabetical, capped at 200 with link
      to full /manufacturers directory
  Every company tile carries data-company-slug for hover previews.

Feature 5b — Sponsor logo strip on homepage
  New SponsorLogoStrip server component renders just above the footer
  on the homepage, showing logos of every current banner advertiser
  with a directory entry + logo. Each links to the manufacturer
  profile with the hover-card slug attribute.

Feature 5c — Recent coverage on manufacturer profiles
  /manufacturers/[slug] now includes a grid of the 6 most recent
  articles matching the company name in the title, with thumbnails.
  Renames the existing manufacturer_id-linked block to "Press
  releases" since it's a separate data source.
---
 src/app/api/public/companies/list/route.ts |  29 +++
 src/app/forum/thread/[id]/page.tsx         |  11 +-
 src/app/home-page/page.tsx                 |  10 +
 src/app/manufacturers/[slug]/page.tsx      |  58 ++++-
 src/app/nab-2026/page.tsx                  | 234 +++++++++++++++++++++
 src/components/LinkifyPlainText.tsx        | 125 +++++++++++
 src/components/SponsorLogoStrip.tsx        |  89 ++++++++
 7 files changed, 552 insertions(+), 4 deletions(-)
 create mode 100644 src/app/api/public/companies/list/route.ts
 create mode 100644 src/app/nab-2026/page.tsx
 create mode 100644 src/components/LinkifyPlainText.tsx
 create mode 100644 src/components/SponsorLogoStrip.tsx

diff --git a/src/app/api/public/companies/list/route.ts b/src/app/api/public/companies/list/route.ts
new file mode 100644
index 0000000..fafc769
--- /dev/null
+++ b/src/app/api/public/companies/list/route.ts
@@ -0,0 +1,29 @@
+import { NextResponse } from "next/server";
+import { createAdminClient } from "@/lib/supabase/admin";
+
+// Cache aggressively — directory rarely changes, and 1k+ companies is ~50KB.
+export const revalidate = 600;
+
+export async function GET() {
+  try {
+    const svc = createAdminClient();
+    const { data } = await svc
+      .from("tracked_companies")
+      .select("company_name, slug")
+      .eq("directory_visible", true)
+      .not("slug", "is", null)
+      .not("company_name", "is", null);
+
+    const rows = (data || [])
+      .filter((r: any) => r.company_name && r.slug)
+      .map((r: any) => ({ name: String(r.company_name).trim(), slug: String(r.slug) }))
+      .filter((r) => r.name.length >= 3);
+
+    return NextResponse.json(
+      { companies: rows },
+      { headers: { "Cache-Control": "public, s-maxage=600, stale-while-revalidate=1200" } },
+    );
+  } catch (e: any) {
+    return NextResponse.json({ companies: [], error: e?.message || "error" }, { status: 500 });
+  }
+}
diff --git a/src/app/forum/thread/[id]/page.tsx b/src/app/forum/thread/[id]/page.tsx
index bec39c6..32798aa 100644
--- a/src/app/forum/thread/[id]/page.tsx
+++ b/src/app/forum/thread/[id]/page.tsx
@@ -8,6 +8,8 @@ import AdImage from '@/components/AdImage';
 import { ADS_300X250, rotateAll } from '@/lib/ads';
 import { createClient } from '@/lib/supabase/client';
 import SidebarAdStack from "@/components/SidebarAdStack";
+import LinkifyPlainText from "@/components/LinkifyPlainText";
+import CompanyMentionsHover from "@/components/CompanyMentionsHover";
 
 // Inline ad slot inserted between forum replies every N posts.
 function InThreadAd({ adIndex }: { adIndex: number }) {
@@ -368,7 +370,9 @@ export default function ForumThreadPage() {
                     <span className="text-[#555] font-body text-xs">·</span>
                     <span className="text-[#555] font-body text-xs">{thread.view_count} views</span>
                   </div>
-                  <p className="text-[#d0d0d0] font-body text-sm leading-relaxed whitespace-pre-wrap">{thread.body}</p>
+                  <p className="text-[#d0d0d0] font-body text-sm leading-relaxed">
+                    <LinkifyPlainText body={thread.body} />
+                  </p>
                   <VoteButtons
                     targetType="thread"
                     targetId={thread.id}
@@ -408,7 +412,9 @@ export default function ForumThreadPage() {
                             <span className="text-[#555] font-body text-xs">·</span>
                             <span className="text-[#555] font-body text-xs">{timeAgo(reply.created_at)}</span>
                           </div>
-                          <p className="text-[#d0d0d0] font-body text-sm leading-relaxed whitespace-pre-wrap">{reply.body}</p>
+                          <p className="text-[#d0d0d0] font-body text-sm leading-relaxed">
+                            <LinkifyPlainText body={reply.body} />
+                          </p>
                           <VoteButtons
                             targetType="reply"
                             targetId={reply.id}
@@ -537,6 +543,7 @@ export default function ForumThreadPage() {
         </div>
       </main>
       <Footer />
+      <CompanyMentionsHover />
     </>
   );
 }
diff --git a/src/app/home-page/page.tsx b/src/app/home-page/page.tsx
index 3e9f9ec..6023d50 100644
--- a/src/app/home-page/page.tsx
+++ b/src/app/home-page/page.tsx
@@ -9,6 +9,8 @@ import SpotlightCarousel from "./components/SpotlightCarousel";
 import ArticleFeed from "./components/ArticleFeed";
 import ScrollRevealSection from "@/components/ScrollRevealSection";
 import NewsletterSignup from "./components/NewsletterSignup";
+import SponsorLogoStrip from "@/components/SponsorLogoStrip";
+import CompanyMentionsHover from "@/components/CompanyMentionsHover";
 
 export const metadata: Metadata = {
   title: 'Broadcast Beat — Broadcast Engineering News & Insights',
@@ -166,8 +168,16 @@ export default function HomePage() {
         <NewsletterSignup />
       </ScrollRevealSection>
 
+      {/* Coverage Partners logo strip — current banner advertisers */}
+      <ScrollRevealSection className="section-enter section-enter-5">
+        <Suspense fallback={null}>
+          <SponsorLogoStrip />
+        </Suspense>
+      </ScrollRevealSection>
+
       {/* Footer */}
       <Footer />
+      <CompanyMentionsHover />
     </div>
   );
 }
\ No newline at end of file
diff --git a/src/app/manufacturers/[slug]/page.tsx b/src/app/manufacturers/[slug]/page.tsx
index 7ded85d..45032c0 100644
--- a/src/app/manufacturers/[slug]/page.tsx
+++ b/src/app/manufacturers/[slug]/page.tsx
@@ -41,11 +41,28 @@ async function loadManufacturer(slug: string) {
     .order("sort_order")
     .order("name");
 
+  // Recent stories: title contains the company name. The same heuristic the
+  // article auto-linker and the hover card use — keeps the directory in sync
+  // with the editorial coverage even when manufacturer_id isn't backfilled.
+  const needle = String(data.company_name || "").trim();
+  let recentStories: any[] = [];
+  if (needle.length >= 3) {
+    const { data: stories } = await supabase
+      .from("wp_imported_posts")
+      .select("wp_slug, title, excerpt, featured_image, wp_published_at, category")
+      .eq("status", "published")
+      .ilike("title", `%${needle.replace(/[%_]/g, "")}%`)
+      .order("wp_published_at", { ascending: false, nullsFirst: false })
+      .limit(12);
+    recentStories = stories || [];
+  }
+
   return {
     company: data,
     shows: shows || [],
     pressReleases: pressReleases || [],
     executives: executives || [],
+    recentStories,
   };
 }
 
@@ -86,7 +103,7 @@ export default async function ManufacturerProfile({
   const { slug } = await params;
   const result = await loadManufacturer(slug);
   if (!result) notFound();
-  const { company, shows, pressReleases, executives } = result;
+  const { company, shows, pressReleases, executives, recentStories } = result;
 
   const jsonLd = {
     "@context": "https://schema.org",
@@ -339,9 +356,46 @@ export default async function ManufacturerProfile({
           </section>
         )}
 
+        {recentStories.length > 0 && (
+          <section className="mb-10">
+            <header className="flex items-baseline justify-between mb-3">
+              <h2 className="text-lg font-display font-bold text-ink">Recent coverage</h2>
+              <Link href={`/news?search=${encodeURIComponent(company.company_name)}`} className="text-xs text-brand-primary hover:underline">
+                All stories →
+              </Link>
+            </header>
+            <div className="grid grid-cols-1 sm:grid-cols-2 lg:grid-cols-3 gap-3">
+              {recentStories.slice(0, 6).map((r: any) => (
+                <Link
+                  key={r.wp_slug}
+                  href={`/news/${r.wp_slug}`}
+                  className="group bg-white border border-ink/10 rounded-md p-3 hover:border-brand-primary hover:shadow-sm transition-all flex gap-3"
+                >
+                  {r.featured_image ? (
+                    /* eslint-disable-next-line @next/next/no-img-element */
+                    <img src={r.featured_image} alt="" className="w-20 h-14 rounded object-cover bg-ink/5 flex-shrink-0" loading="lazy" />
+                  ) : (
+                    <div className="w-20 h-14 rounded bg-ink/5 flex-shrink-0" />
+                  )}
+                  <div className="min-w-0">
+                    <h3 className="text-xs font-semibold text-ink leading-snug group-hover:text-brand-primary line-clamp-3">
+                      {r.title}
+                    </h3>
+                    {r.wp_published_at && (
+                      <p className="text-[10px] text-ink/50 mt-1">
+                        {new Date(r.wp_published_at).toLocaleDateString("en-US", { month: "short", day: "numeric", year: "numeric" })}
+                      </p>
+                    )}
+                  </div>
+                </Link>
+              ))}
+            </div>
+          </section>
+        )}
+
         {pressReleases.length > 0 && (
           <section className="mb-10">
-            <h2 className="text-lg font-display font-bold text-ink mb-3">Recent news</h2>
+            <h2 className="text-lg font-display font-bold text-ink mb-3">Press releases</h2>
             <ul className="space-y-2">
               {pressReleases.map((p) => (
                 <li key={p.slug || p.source_url} className="text-sm">
diff --git a/src/app/nab-2026/page.tsx b/src/app/nab-2026/page.tsx
new file mode 100644
index 0000000..d3b3418
--- /dev/null
+++ b/src/app/nab-2026/page.tsx
@@ -0,0 +1,234 @@
+import type { Metadata } from "next";
+import Link from "next/link";
+import Header from "@/components/Header";
+import Footer from "@/components/Footer";
+import { createClient } from "@/lib/supabase/server";
+import { createAdminClient } from "@/lib/supabase/admin";
+import CompanyMentionsHover from "@/components/CompanyMentionsHover";
+
+export const revalidate = 600;
+
+export const metadata: Metadata = {
+  title: "NAB Show 2026 — Live Coverage Hub | Broadcast Beat",
+  description:
+    "Broadcast Beat's live coverage of NAB Show 2026: 1,100+ exhibitors, the latest product launches, booth-by-booth news, and editorial pick stories from the show floor.",
+  alternates: { canonical: "/nab-2026" },
+  openGraph: {
+    title: "NAB Show 2026 — Live Coverage Hub",
+    description:
+      "Live coverage, exhibitor list, and breaking product news from NAB Show 2026.",
+    type: "website",
+    url: "https://broadcastbeat.com/nab-2026",
+  },
+};
+
+type ExhibitorRow = {
+  slug: string;
+  company_name: string;
+  logo_url: string | null;
+  featured: boolean;
+  mention_count: number;
+  categories: string[] | null;
+};
+
+type ArticleRow = {
+  wp_slug: string;
+  title: string;
+  excerpt: string | null;
+  featured_image: string | null;
+  wp_published_at: string | null;
+};
+
+export default async function NabHub() {
+  const supabase = await createClient();
+
+  const { data: rawExhibitors } = await supabase
+    .from("tracked_companies")
+    .select("slug, company_name, logo_url, featured, mention_count, categories")
+    .eq("directory_visible", true)
+    .eq("exhibits_nab", true)
+    .not("slug", "is", null)
+    .order("featured", { ascending: false })
+    .order("mention_count", { ascending: false })
+    .order("company_name", { ascending: true })
+    .limit(2000);
+
+  const exhibitors = (rawExhibitors || []) as ExhibitorRow[];
+
+  // Sponsor lookup so the hub can bubble paying advertisers to the top.
+  let sponsors = new Set<string>();
+  try {
+    const adv = createAdminClient("adv");
+    const { data: ads } = await adv
+      .from("active_advertisers_by_property")
+      .select("company_name_lower")
+      .eq("property", "broadcastbeat");
+    sponsors = new Set((ads || []).map((r: any) => String(r.company_name_lower)));
+  } catch { /* tolerate */ }
+
+  // Group exhibitors: sponsors first, then everything else alphabetically.
+  const sponsorRows = exhibitors.filter((e) => sponsors.has(e.company_name.toLowerCase()));
+  const otherRows = exhibitors
+    .filter((e) => !sponsors.has(e.company_name.toLowerCase()))
+    .sort((a, b) => a.company_name.localeCompare(b.company_name));
+
+  // Recent NAB stories — anything published in the last 60 days with NAB in
+  // the title or tags. Cap at 30.
+  const sixtyDaysAgo = new Date(Date.now() - 60 * 24 * 3600 * 1000).toISOString();
+  const { data: rawArticles } = await supabase
+    .from("wp_imported_posts")
+    .select("wp_slug, title, excerpt, featured_image, wp_published_at")
+    .eq("status", "published")
+    .or("title.ilike.%NAB%,title.ilike.%NAB 2026%")
+    .gte("wp_published_at", sixtyDaysAgo)
+    .order("wp_published_at", { ascending: false })
+    .limit(30);
+
+  const articles = (rawArticles || []) as ArticleRow[];
+
+  return (
+    <div className="min-h-screen bg-white">
+      <Header />
+      <CompanyMentionsHover />
+
+      {/* Hero */}
+      <section className="bg-gradient-to-br from-amber-50 to-white border-b border-ink/10">
+        <div className="max-w-6xl mx-auto px-4 py-10">
+          <div className="flex items-baseline gap-3 mb-2">
+            <span className="text-[10px] font-bold uppercase tracking-widest bg-amber-100 text-amber-800 px-2 py-0.5 rounded">
+              Live coverage hub
+            </span>
+            <span className="text-xs text-ink/50">April 11–16, 2026 · Las Vegas</span>
+          </div>
+          <h1 className="text-3xl md:text-5xl font-display font-bold text-ink mb-3">
+            NAB Show 2026
+          </h1>
+          <p className="text-ink/70 text-base max-w-3xl">
+            {exhibitors.length.toLocaleString()} exhibitors confirmed.
+            {sponsorRows.length > 0 && <> {sponsorRows.length} are Broadcast Beat coverage partners.</>}
+            {" "}Browse the directory, read the latest product news, and find every booth.
+          </p>
+        </div>
+      </section>
+
+      <div className="max-w-6xl mx-auto px-4 py-10 space-y-12">
+
+        {/* Featured / Coverage Partners */}
+        {sponsorRows.length > 0 && (
+          <section>
+            <header className="flex items-baseline justify-between mb-4">
+              <h2 className="text-xl font-display font-bold text-ink">
+                Coverage Partners at NAB
+              </h2>
+              <span className="text-xs text-ink/50">{sponsorRows.length} exhibiting partner{sponsorRows.length === 1 ? "" : "s"}</span>
+            </header>
+            <div className="grid grid-cols-2 sm:grid-cols-3 md:grid-cols-4 lg:grid-cols-6 gap-3">
+              {sponsorRows.map((e) => (
+                <Link
+                  key={e.slug}
+                  href={`/manufacturers/${e.slug}`}
+                  data-company-slug={e.slug}
+                  className="bg-white border-2 border-emerald-300 rounded-lg p-3 hover:border-emerald-500 hover:shadow-md transition-all flex flex-col items-center text-center gap-2"
+                >
+                  <div className="w-full h-16 flex items-center justify-center bg-ink/5 rounded">
+                    {e.logo_url ? (
+                      /* eslint-disable-next-line @next/next/no-img-element */
+                      <img src={e.logo_url} alt={`${e.company_name} logo`} className="max-h-12 max-w-full object-contain" loading="lazy" />
+                    ) : (
+                      <span className="text-2xl font-bold text-ink/40">{e.company_name.charAt(0).toUpperCase()}</span>
+                    )}
+                  </div>
+                  <span className="font-semibold text-ink text-xs truncate w-full">{e.company_name}</span>
+                  <span className="text-[9px] font-bold uppercase tracking-wider bg-emerald-100 text-emerald-700 px-1.5 py-0.5 rounded">Sponsor</span>
+                </Link>
+              ))}
+            </div>
+          </section>
+        )}
+
+        {/* Recent NAB-related stories */}
+        {articles.length > 0 && (
+          <section>
+            <header className="flex items-baseline justify-between mb-4">
+              <h2 className="text-xl font-display font-bold text-ink">
+                Latest from the show floor
+              </h2>
+              <Link href="/news?search=NAB+2026" className="text-xs text-brand-primary hover:underline">
+                See all NAB coverage →
+              </Link>
+            </header>
+            <div className="grid grid-cols-1 md:grid-cols-2 lg:grid-cols-3 gap-4">
+              {articles.slice(0, 9).map((a) => (
+                <Link
+                  key={a.wp_slug}
+                  href={`/news/${a.wp_slug}`}
+                  className="group bg-white border border-ink/10 rounded-lg overflow-hidden hover:border-brand-primary hover:shadow-sm transition-all"
+                >
+                  {a.featured_image && (
+                    /* eslint-disable-next-line @next/next/no-img-element */
+                    <img
+                      src={a.featured_image}
+                      alt=""
+                      className="w-full aspect-video object-cover group-hover:scale-[1.02] transition-transform"
+                      loading="lazy"
+                    />
+                  )}
+                  <div className="p-3">
+                    <h3 className="font-semibold text-ink text-sm leading-snug group-hover:text-brand-primary line-clamp-3 mb-1">
+                      {a.title}
+                    </h3>
+                    {a.wp_published_at && (
+                      <p className="text-[10px] text-ink/50">
+                        {new Date(a.wp_published_at).toLocaleDateString("en-US", { month: "short", day: "numeric" })}
+                      </p>
+                    )}
+                  </div>
+                </Link>
+              ))}
+            </div>
+          </section>
+        )}
+
+        {/* Full exhibitor list */}
+        <section>
+          <header className="flex items-baseline justify-between mb-4">
+            <h2 className="text-xl font-display font-bold text-ink">
+              All NAB 2026 exhibitors
+            </h2>
+            <Link href="/manufacturers" className="text-xs text-brand-primary hover:underline">
+              Full directory →
+            </Link>
+          </header>
+          <div className="grid grid-cols-1 sm:grid-cols-2 md:grid-cols-3 lg:grid-cols-4 gap-3">
+            {otherRows.slice(0, 200).map((e) => (
+              <Link
+                key={e.slug}
+                href={`/manufacturers/${e.slug}`}
+                data-company-slug={e.slug}
+                className="bg-white border border-ink/10 rounded-md p-2.5 hover:border-brand-primary transition-all flex items-center gap-2.5"
+              >
+                {e.logo_url ? (
+                  /* eslint-disable-next-line @next/next/no-img-element */
+                  <img src={e.logo_url} alt="" className="w-10 h-10 rounded bg-ink/5 object-contain flex-shrink-0" loading="lazy" />
+                ) : (
+                  <div className="w-10 h-10 rounded bg-ink/5 flex items-center justify-center text-ink/40 font-bold text-sm flex-shrink-0">
+                    {e.company_name.charAt(0).toUpperCase()}
+                  </div>
+                )}
+                <span className="font-medium text-ink text-xs truncate">{e.company_name}</span>
+              </Link>
+            ))}
+          </div>
+          {otherRows.length > 200 && (
+            <p className="text-center text-xs text-ink/50 mt-4">
+              Showing 200 of {otherRows.length.toLocaleString()} exhibitors.{" "}
+              <Link href="/manufacturers" className="text-brand-primary hover:underline">Browse the full directory →</Link>
+            </p>
+          )}
+        </section>
+      </div>
+
+      <Footer />
+    </div>
+  );
+}
diff --git a/src/components/LinkifyPlainText.tsx b/src/components/LinkifyPlainText.tsx
new file mode 100644
index 0000000..f40398f
--- /dev/null
+++ b/src/components/LinkifyPlainText.tsx
@@ -0,0 +1,125 @@
+"use client";
+
+import Link from "next/link";
+import { useEffect, useState } from "react";
+
+type Company = { name: string; slug: string; needle: string };
+
+// Module-level cache: fetched once per page load, reused across every
+// LinkifyPlainText instance on the page.
+let companyListPromise: Promise<Company[]> | null = null;
+
+function loadCompanies(): Promise<Company[]> {
+  if (companyListPromise) return companyListPromise;
+  companyListPromise = (async () => {
+    try {
+      const r = await fetch("/api/public/companies/list");
+      if (!r.ok) return [];
+      const j = await r.json();
+      const rows: Company[] = (j.companies || []).map((c: any) => ({
+        name: c.name,
+        slug: c.slug,
+        needle: String(c.name).toLowerCase(),
+      }));
+      // Longest first so "Sony Pictures" beats "Sony"
+      rows.sort((a, b) => b.needle.length - a.needle.length);
+      return rows;
+    } catch {
+      return [];
+    }
+  })();
+  return companyListPromise;
+}
+
+function escapeRegex(s: string): string {
+  return s.replace(/[.*+?^${}()|[\]\\]/g, "\\$&");
+}
+
+interface Segment {
+  type: "text" | "link";
+  text: string;
+  slug?: string;
+}
+
+function buildSegments(text: string, companies: Company[], maxLinks = 10): Segment[] {
+  if (!text) return [];
+  if (companies.length === 0) return [{ type: "text", text }];
+
+  const out: Segment[] = [];
+  let cursor = 0;
+  const seen = new Set<string>();
+  let linkCount = 0;
+
+  while (cursor < text.length && linkCount < maxLinks) {
+    // Find earliest match starting at or after cursor
+    let best: { start: number; end: number; company: Company } | null = null;
+    for (const c of companies) {
+      if (seen.has(c.slug)) continue;
+      const re = new RegExp(`(^|[^A-Za-z0-9])(${escapeRegex(c.name)})(?![A-Za-z0-9])`, "i");
+      re.lastIndex = 0;
+      const m = re.exec(text.slice(cursor));
+      if (!m) continue;
+      const absStart = cursor + m.index + m[1].length;
+      const absEnd = absStart + m[2].length;
+      if (!best || absStart < best.start || (absStart === best.start && absEnd - absStart > best.end - best.start)) {
+        best = { start: absStart, end: absEnd, company: c };
+      }
+    }
+    if (!best) break;
+    if (best.start > cursor) {
+      out.push({ type: "text", text: text.slice(cursor, best.start) });
+    }
+    out.push({ type: "link", text: text.slice(best.start, best.end), slug: best.company.slug });
+    seen.add(best.company.slug);
+    linkCount++;
+    cursor = best.end;
+  }
+  if (cursor < text.length) out.push({ type: "text", text: text.slice(cursor) });
+  return out;
+}
+
+export default function LinkifyPlainText({
+  body,
+  className,
+  preserveWhitespace = true,
+}: {
+  body: string;
+  className?: string;
+  preserveWhitespace?: boolean;
+}) {
+  const [companies, setCompanies] = useState<Company[] | null>(null);
+
+  useEffect(() => {
+    let alive = true;
+    loadCompanies().then((c) => { if (alive) setCompanies(c); });
+    return () => { alive = false; };
+  }, []);
+
+  const segments = companies ? buildSegments(body || "", companies) : null;
+  const wsClass = preserveWhitespace ? "whitespace-pre-wrap" : "";
+  const combined = `${wsClass} ${className || ""}`.trim();
+
+  if (!segments) {
+    // Companies still loading — render raw text so we don't FOUC.
+    return <span className={combined}>{body}</span>;
+  }
+
+  return (
+    <span className={combined}>
+      {segments.map((s, i) =>
+        s.type === "link" && s.slug ? (
+          <Link
+            key={i}
+            href={`/manufacturers/${s.slug}`}
+            data-company-slug={s.slug}
+            className="company-mention"
+          >
+            {s.text}
+          </Link>
+        ) : (
+          <span key={i}>{s.text}</span>
+        ),
+      )}
+    </span>
+  );
+}
diff --git a/src/components/SponsorLogoStrip.tsx b/src/components/SponsorLogoStrip.tsx
new file mode 100644
index 0000000..4044751
--- /dev/null
+++ b/src/components/SponsorLogoStrip.tsx
@@ -0,0 +1,89 @@
+import Link from "next/link";
+import { createAdminClient } from "@/lib/supabase/admin";
+
+type Sponsor = {
+  slug: string;
+  name: string;
+  logoUrl: string | null;
+};
+
+async function fetchSponsors(): Promise<Sponsor[]> {
+  try {
+    const adv = createAdminClient("adv");
+    const { data: ads } = await adv
+      .from("active_advertisers_by_property")
+      .select("company_name_lower")
+      .eq("property", "broadcastbeat");
+    const names = Array.from(new Set((ads || []).map((r: any) => String(r.company_name_lower))));
+    if (names.length === 0) return [];
+
+    const bb = createAdminClient();
+    const { data: dir } = await bb
+      .from("tracked_companies")
+      .select("slug, company_name, logo_url")
+      .eq("directory_visible", true)
+      .in("company_name", names.map((n) => n)); // case-sensitive — directory should match
+    // Some directory entries may have slightly different casing — fall back
+    // to a case-insensitive single-name lookup for anything missed.
+    const bySlug = new Map<string, Sponsor>();
+    for (const d of (dir || []) as any[]) {
+      bySlug.set(d.slug, { slug: d.slug, name: d.company_name, logoUrl: d.logo_url || null });
+    }
+    const matchedNames = new Set((dir || []).map((d: any) => String(d.company_name).toLowerCase()));
+    const missing = names.filter((n) => !matchedNames.has(n));
+    if (missing.length > 0) {
+      for (const n of missing) {
+        const { data: hit } = await bb
+          .from("tracked_companies")
+          .select("slug, company_name, logo_url")
+          .eq("directory_visible", true)
+          .ilike("company_name", n)
+          .limit(1)
+          .maybeSingle();
+        if (hit) bySlug.set(hit.slug, { slug: hit.slug, name: hit.company_name, logoUrl: hit.logo_url || null });
+      }
+    }
+
+    return Array.from(bySlug.values()).filter((s) => s.logoUrl); // only show those with a logo
+  } catch {
+    return [];
+  }
+}
+
+export default async function SponsorLogoStrip() {
+  const sponsors = await fetchSponsors();
+  if (sponsors.length === 0) return null;
+
+  return (
+    <section className="max-w-container mx-auto px-4 py-6 border-t border-b border-[#1a1a1a]" aria-label="Coverage partners">
+      <div className="flex items-center gap-4 mb-3">
+        <span className="text-[10px] uppercase tracking-widest text-[#3b82f6] font-bold">
+          Coverage Partners
+        </span>
+        <div className="flex-1 h-px bg-[#1a1a1a]" />
+        <Link href="/advertise" className="text-[10px] text-[#666] hover:text-[#3b82f6] font-mono">
+          Advertise →
+        </Link>
+      </div>
+      <div className="flex flex-wrap items-center justify-center gap-x-8 gap-y-4">
+        {sponsors.map((s) => (
+          <Link
+            key={s.slug}
+            href={`/manufacturers/${s.slug}`}
+            data-company-slug={s.slug}
+            className="block opacity-70 hover:opacity-100 transition-opacity"
+            title={s.name}
+          >
+            {/* eslint-disable-next-line @next/next/no-img-element */}
+            <img
+              src={s.logoUrl || ""}
+              alt={s.name}
+              className="h-10 md:h-12 w-auto object-contain max-w-[140px] bg-white p-1.5 rounded"
+              loading="lazy"
+            />
+          </Link>
+        ))}
+      </div>
+    </section>
+  );
+}