Add EarlyHunt footer badge

apps/web/components/landing-page.test.tsx

@@ -213,6 +213,45 @@ describe('LandingPage', () => {
         expect(toolfioDarkBadgeImage?.className).toContain('hidden');
         expect(toolfioDarkBadgeImage?.className).toContain('dark:block');
 
+        const earlyHuntBadgeLink = screen.getByRole('link', {
+            name: /Featured on EarlyHunt/i
+        });
+        expect(earlyHuntBadgeLink).toHaveProperty(
+            'href',
+            'https://earlyhunt.com/project/xpenser'
+        );
+        expect(earlyHuntBadgeLink.getAttribute('target')).toBe('_blank');
+        expect(earlyHuntBadgeLink.getAttribute('rel')).toBe(
+            'noopener noreferrer'
+        );
+
+        const earlyHuntBadgeImages = screen.getAllByAltText(
+            'Featured on EarlyHunt'
+        );
+        expect(earlyHuntBadgeImages).toHaveLength(2);
+
+        const earlyHuntLightBadgeImage = earlyHuntBadgeImages.find(
+            image =>
+                image.getAttribute('src') ===
+                'https://earlyhunt.com/badges/earlyhunt-badge-light.svg'
+        );
+        expect(earlyHuntLightBadgeImage).toBeTruthy();
+        expect(earlyHuntLightBadgeImage?.getAttribute('width')).toBe('265');
+        expect(earlyHuntLightBadgeImage?.getAttribute('height')).toBe('58');
+        expect(earlyHuntLightBadgeImage?.className).toContain('block');
+        expect(earlyHuntLightBadgeImage?.className).toContain('dark:hidden');
+
+        const earlyHuntDarkBadgeImage = earlyHuntBadgeImages.find(
+            image =>
+                image.getAttribute('src') ===
+                'https://earlyhunt.com/badges/earlyhunt-badge-dark.svg'
+        );
+        expect(earlyHuntDarkBadgeImage).toBeTruthy();
+        expect(earlyHuntDarkBadgeImage?.getAttribute('width')).toBe('265');
+        expect(earlyHuntDarkBadgeImage?.getAttribute('height')).toBe('58');
+        expect(earlyHuntDarkBadgeImage?.className).toContain('hidden');
+        expect(earlyHuntDarkBadgeImage?.className).toContain('dark:block');
+
         const openHuntsBadgeLink = screen.getByRole('link', {
             name: /OpenHunts Club Member/i
         });

apps/web/components/landing-page.tsx

@@ -204,6 +204,15 @@ const toolfioBadge = {
     width: 200
 } as const;
 
+const earlyHuntBadge = {
+    alt: 'Featured on EarlyHunt',
+    darkSrc: 'https://earlyhunt.com/badges/earlyhunt-badge-dark.svg',
+    height: 58,
+    href: 'https://earlyhunt.com/project/xpenser',
+    lightSrc: 'https://earlyhunt.com/badges/earlyhunt-badge-light.svg',
+    width: 265
+} as const;
+
 const openHuntsBadge = {
     alt: 'OpenHunts Club Member',
     height: 105,
@@ -646,6 +655,35 @@ function ToolfioBadge() {
     );
 }
 
+function EarlyHuntBadge() {
+    return (
+        <a
+            aria-label={earlyHuntBadge.alt}
+            className="block w-fit rounded-md focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring"
+            href={earlyHuntBadge.href}
+            rel="noopener noreferrer"
+            target="_blank"
+        >
+            {/* biome-ignore lint/performance/noImgElement: EarlyHunt provides this hosted badge snippet, and next/image would need remote config for a tiny footer badge. */}
+            <img
+                alt={earlyHuntBadge.alt}
+                className="block dark:hidden"
+                height={earlyHuntBadge.height}
+                src={earlyHuntBadge.lightSrc}
+                width={earlyHuntBadge.width}
+            />
+            {/* biome-ignore lint/performance/noImgElement: EarlyHunt provides this hosted badge snippet, and next/image would need remote config for a tiny footer badge. */}
+            <img
+                alt={earlyHuntBadge.alt}
+                className="hidden dark:block"
+                height={earlyHuntBadge.height}
+                src={earlyHuntBadge.darkSrc}
+                width={earlyHuntBadge.width}
+            />
+        </a>
+    );
+}
+
 function OpenHuntsBadge() {
     return (
         <a
@@ -676,6 +714,7 @@ function FooterBadges() {
             <ScrollLaunchBadge />
             <AuraPlusPlusBadge />
             <ToolfioBadge />
+            <EarlyHuntBadge />
             <OpenHuntsBadge />
         </div>
     );