Function SponsorsPage

src/pages/SponsorsPage.jsx:38–143

()

].filter(tier => tier.sponsors.length > 0);

const SponsorsPage = () => {
  useScrollToTop();

  return (
    <>
      <Navbar showDocs />
      <div className="sponsors-dotfield">
        <DotField sparkle waveAmplitude={5} dotRadius={2} />
      </div>
      <section className="sponsors-page">
        <title>React Bits - Sponsors</title>

        {/* ── Header ──────────────────────────────────────────────── */}
        <div className="sponsors-page-header">
          <div className="sponsors-page-header-left">
            <h1 className="sponsors-page-title">Sponsors</h1>
            <p className="sponsors-page-subtitle">
              Your support keeps React Bits free and open-source for developers everywhere.
            </p>
          </div>
          <a
            href="mailto:contact@davidhaz.com?subject=React%20Bits%20Sponsorship%20Inquiry"
            className="sponsors-page-cta"
          >
            Become a Sponsor <FaArrowRight size={12} />
          </a>
        </div>

        {/* ── Tiers ───────────────────────────────────────────────── */}
        {TIERS.map(tier => (
          <div className="sponsors-tier-section" key={tier.key}>
            <div className="sponsors-tier-header">
              <span className={`sponsors-tier-badge sponsors-tier-badge--${tier.key}`}>
                <tier.icon size={13} />
                {tier.label}
              </span>
            </div>

            {tier.sponsors.length > 0 ? (
              <div className={`sponsors-tier-grid sponsors-tier-grid--${tier.key}`}>
                {tier.sponsors.map(sponsor => {
                  const href = buildSponsorUrl(sponsor.url, tier.key);
                  return (
                    <a
                      key={sponsor.id}
                      href={href}
                      target="_blank"
                      rel="noopener"
                      className="sponsors-page-card"
                    >
                      <div className={`sponsors-card-banner sponsors-card-banner--${tier.key}`}>
                        <img
                          className="sponsors-card-logo"
                          src={sponsor.imageUrl}
                          alt={sponsor.name}
                        />
                      </div>
                      <div className="sponsors-card-body">