From 1d5316e88184f622c3bb9fded26919d0faa56bd3 Mon Sep 17 00:00:00 2001
From: Dan Stepanov <danstepanov@users.noreply.github.com>
Date: Wed, 23 Sep 2026 01:52:42 -0400
Subject: [PATCH 1/2] Add Nativewind design from Discord request
 1552188733791543327

Design-Input: be0851d95767c013445986b150ed3044aee43d58a6edd6a32bbdab2cca5b0b7a
---
 app/(home)/ShowcaseItem.tsx                |  25 +-
 app/(home)/TestimonialsSection.tsx         |   4 +-
 app/(home)/TestimonialsSectionContents.tsx | 273 ++++++---------------
 app/(home)/archived-showcase-data.ts       | 213 ++++++++++++++++
 4 files changed, 300 insertions(+), 215 deletions(-)
 create mode 100644 app/(home)/archived-showcase-data.ts

diff --git a/app/(home)/ShowcaseItem.tsx b/app/(home)/ShowcaseItem.tsx
index ea4ec25..9b24348 100644
--- a/app/(home)/ShowcaseItem.tsx
+++ b/app/(home)/ShowcaseItem.tsx
@@ -1,4 +1,4 @@
-import Image, { StaticImageData } from "next/image";
+import Image, { type StaticImageData } from "next/image";
 import { ExternalLink } from "lucide-react";
 
 export interface ShowcaseItemProps {
@@ -6,7 +6,7 @@ export interface ShowcaseItemProps {
   website?: string;
   appstore?: string;
   playstore?: string;
-  logo: StaticImageData;
+  logo: StaticImageData | string;
   description: string;
 }
 
@@ -15,25 +15,32 @@ export default function ShowcaseItem({ name, website, appstore, playstore, logo,
     <div className={`group pt-12 ${website && 'pb-14'}`}>
       <div className="rounded-2xl border border-dashed p-4 flex-1 bg-fd-card relative">
 
-        <Image src={logo} className="rounded-2xl h-16 w-16 -mt-12 mb-4 backdrop-blur left-4 border border-dashed bg-fd-muted object-cover" alt={`${name} logo`} />
+        <Image
+          src={logo}
+          width={64}
+          height={64}
+          unoptimized={typeof logo === "string"}
+          className="rounded-2xl h-16 w-16 -mt-12 mb-4 backdrop-blur left-4 border border-dashed bg-fd-muted object-cover"
+          alt=""
+        />
         <b className="font-bold text-xl">{name}</b>
         <p className="opacity-50 mt-2 text-pretty line-clamp-3">{description}</p>
           
         {website && (
-          <a href={website} target="_blank" rel="noopener noreferrer" className="absolute left-0 bottom-0 translate-y-12 group/link border px-3 py-1.5 shadow-xl dark:shadow-2xl group-hover:translate-y-1/2 group-hover:translate-x-4 duration-300 bg-fd-accent hover:bg-fd-background hover:border-black dark:hover:border-fd-primary dark:hover:shadow-fd-primary rounded-xl font-mono text-sm w-fit ease-[cubic-bezier(0.175,0.885,0.32,1.275)] flex gap-2">
-            {website}
-            <ExternalLink className="w-4 h-4 opacity-0 inline-block group-hover/link:opacity-100 group-hover/link:translate-0 -translate-x-1/2 translate-y-1/2 scale-50 group-hover/link:scale-100 duration-300" />
+          <a href={website} target="_blank" rel="noopener noreferrer" aria-label={`Visit the ${name} website`} className="absolute left-0 bottom-0 translate-y-12 group/link border px-3 py-1.5 shadow-xl dark:shadow-2xl group-hover:translate-y-1/2 group-hover:translate-x-4 duration-300 bg-fd-accent hover:bg-fd-background hover:border-black dark:hover:border-fd-primary dark:hover:shadow-fd-primary rounded-xl font-mono text-sm w-fit max-w-[calc(100%-1rem)] ease-[cubic-bezier(0.175,0.885,0.32,1.275)] flex gap-2 focus-visible:outline-2 focus-visible:outline-offset-2 focus-visible:outline-fd-primary">
+            <span className="truncate">{website}</span>
+            <ExternalLink className="w-4 h-4 shrink-0 opacity-0 inline-block group-hover/link:opacity-100 group-hover/link:translate-0 -translate-x-1/2 translate-y-1/2 scale-50 group-hover/link:scale-100 duration-300" />
           </a>
         )}
 
         <div className="absolute top-3 right-3 flex gap-3">
           {playstore && (
-            <a href={playstore} target="_blank" rel="noopener noreferrer" className="border p-1.5 shadow-xl dark:shadow-2xl duration-300 bg-fd-accent hover:bg-fd-background hover:border-black dark:hover:border-fd-primary dark:hover:shadow-fd-primary rounded-xl font-mono text-sm w-fit group-hover:-translate-y-8 ease-[cubic-bezier(0.175,0.885,0.32,1.275)] delay-75 hover:delay-0 hover:scale-105 hover:rounded-xl active:duration-75 active:scale-95 active:-translate-y-7 group-hover:rotate-6 hover:text-fd-foreground dark:hover:text-fd-primary">
+            <a href={playstore} target="_blank" rel="noopener noreferrer" aria-label={`View ${name} on Google Play`} className="border p-1.5 shadow-xl dark:shadow-2xl duration-300 bg-fd-accent hover:bg-fd-background hover:border-black dark:hover:border-fd-primary dark:hover:shadow-fd-primary rounded-xl font-mono text-sm w-fit group-hover:-translate-y-8 ease-[cubic-bezier(0.175,0.885,0.32,1.275)] delay-75 hover:delay-0 hover:scale-105 hover:rounded-xl active:duration-75 active:scale-95 active:-translate-y-7 group-hover:rotate-6 hover:text-fd-foreground dark:hover:text-fd-primary focus-visible:outline-2 focus-visible:outline-offset-2 focus-visible:outline-fd-primary">
               <PlayStoreIcon className="w-8 h-8 fill-current" />
             </a>
           )}
           {appstore && (
-            <a href={appstore} target="_blank" rel="noopener noreferrer" className="border p-1.5 shadow-xl dark:shadow-2xl duration-300 bg-fd-accent hover:bg-fd-background hover:border-black dark:hover:border-fd-primary dark:hover:shadow-fd-primary rounded-xl font-mono text-sm w-fit group-hover:-translate-y-6 ease-[cubic-bezier(0.175,0.885,0.32,1.275)] delay-0 hover:delay-0 hover:scale-105 hover:rounded-xl active:duration-75 active:scale-95 active:-translate-y-5 group-hover:rotate-3 hover:text-fd-foreground dark:hover:text-fd-primary">
+            <a href={appstore} target="_blank" rel="noopener noreferrer" aria-label={`View ${name} on the App Store`} className="border p-1.5 shadow-xl dark:shadow-2xl duration-300 bg-fd-accent hover:bg-fd-background hover:border-black dark:hover:border-fd-primary dark:hover:shadow-fd-primary rounded-xl font-mono text-sm w-fit group-hover:-translate-y-6 ease-[cubic-bezier(0.175,0.885,0.32,1.275)] delay-0 hover:delay-0 hover:scale-105 hover:rounded-xl active:duration-75 active:scale-95 active:-translate-y-5 group-hover:rotate-3 hover:text-fd-foreground dark:hover:text-fd-primary focus-visible:outline-2 focus-visible:outline-offset-2 focus-visible:outline-fd-primary">
               <AppStoreIcon className="w-8 h-8 fill-current" />
             </a>
           )}
@@ -55,4 +62,4 @@ function PlayStoreIcon(props: React.SVGProps<SVGSVGElement>) {
   return (
     <svg role="img" viewBox="0 0 24 24" xmlns="http://www.w3.org/2000/svg" {...props}><title>Google Play</title><path d="M22.018 13.298l-3.919 2.218-3.515-3.493 3.543-3.521 3.891 2.202a1.49 1.49 0 0 1 0 2.594zM1.337.924a1.486 1.486 0 0 0-.112.568v21.017c0 .217.045.419.124.6l11.155-11.087L1.337.924zm12.207 10.065l3.258-3.238L3.45.195a1.466 1.466 0 0 0-.946-.179l11.04 10.973zm0 2.067l-11 10.933c.298.036.612-.016.906-.183l13.324-7.54-3.23-3.21z"/></svg>
   );
-}
\ No newline at end of file
+}
diff --git a/app/(home)/TestimonialsSection.tsx b/app/(home)/TestimonialsSection.tsx
index bf1b7ec..6980054 100644
--- a/app/(home)/TestimonialsSection.tsx
+++ b/app/(home)/TestimonialsSection.tsx
@@ -15,7 +15,7 @@ export default function TestimonialsSection({
     <>
       <SectionTitle id="showcase" title="Who is using Nativewind?" />
 
-      <section className={`relative flex flex-col w-full max-w-fd-container mx-auto -mt-[1px] border-y border-dashed ${
+      <section id="showcase-content" className={`relative flex flex-col w-full max-w-fd-container mx-auto -mt-[1px] border-y border-dashed ${
         showMore ? 'overflow-clip' : 'max-h-[50vh] overflow-hidden'
         }`}>
         {children}
@@ -25,7 +25,7 @@ export default function TestimonialsSection({
           </div>
         )}
         <div className="sticky z-10 bottom-0 w-full pointer-events-none">
-          <button className="group pointer-events-auto mx-auto mb-4 w-30 font-semibold text-fd-background justify-between pl-3 p-1.5 rounded-xl border border-fd-background/30 shadow-lg flex items-center gap-1 bg-fd-primary hover:bg-fd-card active:bg-fd-accent cursor-pointer hover:text-fd-primary hover:scale-110 hover:-translate-y-0.5 hover:shadow-xl dark:hover:shadow-2xl active:duration-75 active:translate-y-0.5 duration-300 dark:hover:shadow-fd-primary hover:border-fd-primary ease-[cubic-bezier(0.175,0.885,0.32,1.275)] hover:border-dashed text-sm"
+          <button type="button" aria-expanded={showMore} aria-controls="showcase-content" className="group pointer-events-auto mx-auto mb-4 w-30 font-semibold text-fd-background justify-between pl-3 p-1.5 rounded-xl border border-fd-background/30 shadow-lg flex items-center gap-1 bg-fd-primary hover:bg-fd-card active:bg-fd-accent cursor-pointer hover:text-fd-primary hover:scale-110 hover:-translate-y-0.5 hover:shadow-xl dark:hover:shadow-2xl active:duration-75 active:translate-y-0.5 duration-300 dark:hover:shadow-fd-primary hover:border-fd-primary ease-[cubic-bezier(0.175,0.885,0.32,1.275)] hover:border-dashed text-sm focus-visible:outline-2 focus-visible:outline-offset-2 focus-visible:outline-fd-primary"
             onClick={() => {
               setShowMore(!showMore)
               document.getElementById('showcase')?.scrollIntoView({ behavior: 'smooth' })
diff --git a/app/(home)/TestimonialsSectionContents.tsx b/app/(home)/TestimonialsSectionContents.tsx
index cef8b1d..3d8a398 100644
--- a/app/(home)/TestimonialsSectionContents.tsx
+++ b/app/(home)/TestimonialsSectionContents.tsx
@@ -1,65 +1,37 @@
-import BICLogo from "../assets/BIC.png";
-import WaveLogo from "../assets/wave.png";
-import MyloLogo from "../assets/mylo.png";
-import NoonaLogo from "../assets/noona.png";
-import HyppeLogo from "../assets/hyppe.png";
-import ReemiLogo from "../assets/reemi.png";
-import SwipeyLogo from "../assets/swipey.png";
-import RambleLogo from "../assets/ramble.png";
-import QuiztrLogo from "../assets/quiztr.png";
-import AvocadoLogo from "../assets/avocado.png";
-import SewaYouLogo from "../assets/sewayou.png";
-import KnowhereLogo from "../assets/knowhere.png";
-import RovelistLogo from "../assets/rovelist.png";
-import DayStackLogo from "../assets/daystack.png";
-import FluentlyLogo from "../assets/fluently.png";
-import HivemindLogo from "../assets/hivemind.png";
-import MindLumenLogo from "../assets/MindLumen.png";
-import BrainnotesLogo from "../assets/brainnotes.png";
-import FocusminnyLogo from "../assets/focusminny.png";
-import GoTogetherLogo from "../assets/gotogether.png";
-import ShutterMateLogo from "../assets/shuttermate.png";
-import FoloLogo from "../assets/folo.png";
-import VibeCodeLogo from "../assets/vibecode.png"
-import NeonCityLogo from "../assets/neoncity.png"
-import ShowcaseItem, { ShowcaseItemProps } from "./ShowcaseItem";
+import ShowcaseItem, { type ShowcaseItemProps } from "./ShowcaseItem";
 
 export default function TestimonialsSectionContents() {
   return (
     <div className="grid grid-cols-1 sm:grid-cols-2 lg:grid-cols-3 flex-wrap text-left gap-8 justify-around p-8 [mask:linear-gradient(to_right,transparent,red_1rem,red_calc(100%-1rem),transparent)] max-w-full">
-      {/* col 1.1 */}
       <div className="flex sm:hidden flex-col">
-        {col11.map((item) => (
+        {items.map((item) => (
           <ShowcaseItem key={item.name} {...item} />
         ))}
       </div>
-      {/* col 2.1 */}
+
       <div className="hidden sm:flex lg:hidden flex-col">
-        {col21.map((item) => (
+        {items.slice(0, 5).map((item) => (
           <ShowcaseItem key={item.name} {...item} />
         ))}
       </div>
-      {/* col 2.2 */}
       <div className="hidden sm:flex lg:hidden flex-col">
-        {col22.map((item) => (
+        {items.slice(5).map((item) => (
           <ShowcaseItem key={item.name} {...item} />
         ))}
       </div>
-      {/* col 3.1 */}
+
       <div className="hidden lg:flex flex-col">
-        {col31.map((item) => (
+        {items.slice(0, 4).map((item) => (
           <ShowcaseItem key={item.name} {...item} />
         ))}
       </div>
-      {/* col 3.2 */}
       <div className="hidden lg:flex flex-col">
-        {col32.map((item) => (
+        {items.slice(4, 7).map((item) => (
           <ShowcaseItem key={item.name} {...item} />
         ))}
       </div>
-      {/* col 3.3 */}
       <div className="hidden lg:flex flex-col">
-        {col33.map((item) => (
+        {items.slice(7).map((item) => (
           <ShowcaseItem key={item.name} {...item} />
         ))}
       </div>
@@ -67,191 +39,84 @@ export default function TestimonialsSectionContents() {
   );
 }
 
-const items : ShowcaseItemProps[] = [
-	{
-		name: "NeonCity",
-		description:
-			"NeonCity: CityRunner is a high-quality mobile game built with React Native created by Daehyeon Mun.",
-		logo: NeonCityLogo,		
-		appstore:
-			"https://apps.apple.com/us/app/neoncity-cityrunner/id6477771151?platform=iphone",
-	},
-  {
-    name: "Noona",
-    description: "Noona is a marketplace for services and experiences.",
-    logo: NoonaLogo,
-    website: "https://noona.app/hq",
-    appstore: "https://apps.apple.com/us/app/noona-book-anything/id1448498295",
-  },
-  {
-    name: "Hyppe",
-    description: "Hyppe es más que una aplicación de fitness, es una comunidad vibrante de personas apasionadas dedicadas a alcanzar sus metas de salud y bienestar.",
-    logo: HyppeLogo,
-    appstore: "https://apps.apple.com/us/app/hyppe/id6473208513",
-  },
-  {
-    name: "SewaYou",
-    description: "SewaYou is a location-based social app that helps you easily find and connect with new friends both online and in person, anywhere in the world.",
-    logo: SewaYouLogo,
-    appstore: "https://apps.apple.com/us/app/sewayou-make-new-friends/id1455473510",
-    playstore: "https://play.google.com/store/apps/details?id=com.sewayou",
-  },
-  {
-    name: "Brainnotes",
-    description: "Summarize anything, videos & PDFs and audios all in one app.",
-    logo: BrainnotesLogo,
-    website: "https://brainnotes.app/",
-    appstore: "https://apps.apple.com/us/app/brainnotes-summarizer/id6744852497",
-  },
-  {
-    name: "Reemi",
-    description: "Get notifications to check in with your favorite people.",
-    logo: ReemiLogo,
-    appstore: " https://apps.apple.com/us/app/reemi-social-reminders/id6742418635",
-  },
-  {
-    name: "Swipey",
-    description: "Swipey is the next-gen financial OS that helps you manage all your business finances in one place.",
-    logo: SwipeyLogo,
-    website: "https://swipey.co/",
-    appstore: "https://apps.apple.com/id/app/swipey-fin-os-for-modern-biz/id1589412706",
-  },
-  {
-    name: "Wave",
-    description: "Wave is the AI-powered transcription and summarization app for audio recordings and phone calls.",
-    logo: WaveLogo,
-    website: "https://wave.co/",
-    appstore: "https://apps.apple.com/us/app/wave-ai-note-taker/id6451491556",
-    playstore: "https://play.google.com/store/apps/details?id=com.ma.waveapp",
-  },
+// Brand snapshot: 8fedabcab4bb480b40a0d84002c12e32e03e6e23.
+// Ordered by the saved public repository ranking verified on 2026-09-21.
+// Each repository below declared Nativewind in its dependency manifest.
+const items: ShowcaseItemProps[] = [
   {
-    name: "Knowhere",
-    description: "Easily discover what you and your friends want to do, all in your hand, all in one place.",
-    logo: KnowhereLogo,
-    website: "https://knowheresocial.com/",
-    appstore: "https://apps.apple.com/us/app/knowhere/id6467689920",
+    name: "PostHog",
+    description:
+      "PostHog gives product teams analytics, session replay, feature flags, experiments, and more.",
+    logo: "https://github.com/PostHog.png?size=256",
+    website: "https://posthog.com/",
   },
   {
-    name: "Rovelist",
-    description: "Sustainable change through habits repeated daily. It's not about perfection, it's about consistency.",
-    logo: RovelistLogo,
-    website: "https://www.rovelist.app/",
-    appstore: "https://apps.apple.com/us/app/habit-tracker-rovelist/id6468539586",
-  },
-  {
-    name: "Avocado",
-    description: "Easily log your meals with the Avocado App, set flexible goals, and stay on track with your nutrition like never before.",
-    logo: AvocadoLogo,
-    appstore: "https://apps.apple.com/us/app/avocado-calorie-goal-tracker/id6739069296",
-  },
-  {
-    name: "DayStack",
-    description: "Take control of your daily routines. Track habits and never miss your supplements with smart reminders.",
-    logo: DayStackLogo,
-    appstore: "https://apps.apple.com/us/app/daystack-pro/id6741811908",
-    website: "https://www.daystack.co/",
-  },
-  {
-    name: "Ramble",
-    description: "Community app for the modern van traveler.",
-    logo: RambleLogo,
-    website: "https://ramble.guide/",
-    appstore: "https://apps.apple.com/us/app/ramble-van-travel-app/id6468265289",
-    playstore: "https://play.google.com/store/apps/details?id=co.noquarter.ramble",
-  },
-  {
-    name: "Quiztr",
-    description: "Learn anything for school, work or fun.",
-    logo: QuiztrLogo,
-    website: "https://quiztr.com/",
-    appstore: "https://apps.apple.com/fr/app/quiztr-fiche-de-r%C3%A9vision/id6503441928",
-    playstore: "https://play.google.com/store/apps/details?id=com.quiztr.mobile.app",
-  },
-  {
-    name: "Mylo",
-    description: "Mylo är appen som gör juridiken enkel. Skapa juridiska avtal på egen hand, signera säkert med BankID och spara allt i ett tryggt moln.",
-    logo: MyloLogo,
-    website: "https://mylo.law/",
-    appstore: "https://apps.apple.com/se/app/mylo-avtal-och-dokument/id6733253272",
-    playstore: "https://play.google.com/store/apps/details?id=io.happycart.app",
+    name: "Folo",
+    description:
+      "Folo is a personalized RSS reader and content hub for following everything in one place.",
+    logo: "https://github.com/RSSNext.png?size=256",
+    website: "https://folo.is/",
+    appstore:
+      "https://apps.apple.com/us/app/folo-follow-everything/id6739802604",
   },
   {
-    name: "Focusminny",
-    description: "Turn Your Phone into a Productivity Companion—Not a Distraction!",
-    logo: FocusminnyLogo,
-    website: "https://www.focusminny.app/",
-    appstore: "https://apps.apple.com/us/app/focusminny-stay-focused-ai/id6738607046",
+    name: "Onyx",
+    description:
+      "Onyx is an open source AI assistant that connects to a company’s documents, apps, and people.",
+    logo: "https://github.com/onyx-dot-app.png?size=256",
+    website: "https://www.onyx.app/",
   },
   {
-    name: "BIC Group",
-    description: "Beincom (BIC Group) is a social platform focused on community building.",
-    logo: BICLogo,
-    appstore: "https://apps.apple.com/vn/app/bic-group/id6444276276",
+    name: "Karakeep",
+    description:
+      "Karakeep is an open source app for saving, organizing, and rediscovering links, notes, and images.",
+    logo: "https://github.com/karakeep-app.png?size=256",
+    website: "https://karakeep.app/",
+    appstore: "https://apps.apple.com/us/app/karakeep-app/id6479258022",
+    playstore:
+      "https://play.google.com/store/apps/details?id=app.hoarder.hoardermobile",
   },
   {
-    name: "Fluently",
-    description: "AI-powered English coach.",
-    logo: FluentlyLogo,
-    website: "https://getfluently.app/",
-    appstore: "https://apps.apple.com/us/app/fluently-ai-english-tutor/id6683289805",
+    name: "Kortix",
+    description:
+      "Kortix is an open source AI management system for agents, shared skills, company memory, and connectors.",
+    logo: "https://github.com/kortix-ai.png?size=256",
+    website: "https://www.kortix.com/",
   },
   {
-    name: "Shutter Mate",
-    description: "ShutterMate is your ultimate photography companion!",
-    logo: ShutterMateLogo,
-    appstore: "https://apps.apple.com/in/app/shutter-mate/id6738705813",
-    playstore: "https://play.google.com/store/apps/details?id=com.shuttermate.app",
+    name: "Linkwarden",
+    description:
+      "Linkwarden is a collaborative bookmark manager that preserves webpages and organizes saved links.",
+    logo: "https://github.com/linkwarden.png?size=256",
+    website: "https://linkwarden.app/",
   },
   {
-    name: "GoTogether",
-    description: "Discover events and find people to join you—make solo events a thing of the past.",
-    logo: GoTogetherLogo,
-    website: "https://gogether.app/",
-    appstore: "https://apps.apple.com/in/app/gogether/id6739421081",
-    playstore: "https://play.google.com/store/apps/details?id=com.gogether.app",
+    name: "Polar",
+    description:
+      "Polar provides billing infrastructure for subscriptions, usage, invoicing, and global sales tax.",
+    logo: "https://github.com/polarsource.png?size=256",
+    website: "https://polar.sh/",
   },
   {
-    name: "MindLumen",
-    description: "Your personal AI therapist for mental wellbeing",
-    logo: MindLumenLogo,
-    website: "https://mindlumen.ai/",
-    appstore: "https://apps.apple.com/nl/app/ai-therapist-mindlumen/id6738006220",
+    name: "Founded Labs",
+    description:
+      "Founded Labs builds React Native Reusables, an open source component registry crafted with Nativewind.",
+    logo: "https://github.com/founded-labs.png?size=256",
+    website: "https://reactnativereusables.com/",
   },
   {
-    name: "Hivemind",
-    description: "Turn any topic into your personal social media feed with AI.",
-    logo: HivemindLogo,
-    website: "https://gethivemind.app/",
-    appstore: "https://apps.apple.com/de/app/hivemind-study-by-scrolling/id6737344456",
+    name: "gluestack",
+    description:
+      "gluestack offers customizable components and patterns for React, Next.js, and React Native.",
+    logo: "https://github.com/gluestack.png?size=256",
+    website: "https://gluestack.io/",
   },
   {
-    name: "Folo",
-    description: "🧡 Follow everything in one place",
-    logo: FoloLogo,
-    website: "https://follow.is/",
-    appstore: "https://apps.apple.com/us/app/folo-follow-everything/id6739802604",
+    name: "Streamyfin",
+    description:
+      "Streamyfin is an open source Jellyfin client for streaming media on iOS, tvOS, and Android.",
+    logo: "https://github.com/streamyfin.png?size=256",
+    website: "https://streamyfin.app/",
+    appstore: "https://apps.apple.com/gb/app/streamyfin/id6593660679",
   },
-    {
-    name: "VibeCode",
-    description: "The mobile app that builds mobile apps",
-    logo: VibeCodeLogo,
-    website: "https://vibecodeapp.com/",
-    appstore: "https://apps.apple.com/us/app/vibecode/id6742912146",
-  }
 ];
-
-// NOTE: this needs to be done in a server component to avoid hydration errors
-function shuffleArray(array : ShowcaseItemProps[]) {
-  for (let i = array.length - 1; i > 0; i--) {
-    const j = Math.floor(Math.random() * (i + 1));
-    [array[i], array[j]] = [array[j], array[i]];
-  }
-  return array;
-}
-
-const col11 = shuffleArray(items);
-const col21 = shuffleArray(items.slice(0, items.length / 2));
-const col22 = shuffleArray(items.slice(items.length / 2, items.length));
-const col31 = shuffleArray(items.slice(0, items.length / 3));
-const col32 = shuffleArray(items.slice(items.length / 3, 2 * items.length / 3));
-const col33 = shuffleArray(items.slice(2 * items.length / 3, items.length));
\ No newline at end of file
diff --git a/app/(home)/archived-showcase-data.ts b/app/(home)/archived-showcase-data.ts
new file mode 100644
index 0000000..3f66ce7
--- /dev/null
+++ b/app/(home)/archived-showcase-data.ts
@@ -0,0 +1,213 @@
+interface ArchivedShowcaseItem {
+  name: string;
+  website?: string;
+  appstore?: string;
+  playstore?: string;
+  logoAsset: string;
+  description: string;
+}
+
+// Preserved from the previous homepage showcase for possible future use.
+export const archivedShowcaseItems: ArchivedShowcaseItem[] = [
+  {
+    name: "NeonCity",
+    description:
+      "NeonCity: CityRunner is a high-quality mobile game built with React Native created by Daehyeon Mun.",
+    logoAsset: "../assets/neoncity.png",
+    appstore:
+      "https://apps.apple.com/us/app/neoncity-cityrunner/id6477771151?platform=iphone",
+  },
+  {
+    name: "Noona",
+    description: "Noona is a marketplace for services and experiences.",
+    logoAsset: "../assets/noona.png",
+    website: "https://noona.app/hq",
+    appstore: "https://apps.apple.com/us/app/noona-book-anything/id1448498295",
+  },
+  {
+    name: "Hyppe",
+    description:
+      "Hyppe es más que una aplicación de fitness, es una comunidad vibrante de personas apasionadas dedicadas a alcanzar sus metas de salud y bienestar.",
+    logoAsset: "../assets/hyppe.png",
+    appstore: "https://apps.apple.com/us/app/hyppe/id6473208513",
+  },
+  {
+    name: "SewaYou",
+    description:
+      "SewaYou is a location-based social app that helps you easily find and connect with new friends both online and in person, anywhere in the world.",
+    logoAsset: "../assets/sewayou.png",
+    appstore:
+      "https://apps.apple.com/us/app/sewayou-make-new-friends/id1455473510",
+    playstore: "https://play.google.com/store/apps/details?id=com.sewayou",
+  },
+  {
+    name: "Brainnotes",
+    description: "Summarize anything, videos & PDFs and audios all in one app.",
+    logoAsset: "../assets/brainnotes.png",
+    website: "https://brainnotes.app/",
+    appstore:
+      "https://apps.apple.com/us/app/brainnotes-summarizer/id6744852497",
+  },
+  {
+    name: "Reemi",
+    description: "Get notifications to check in with your favorite people.",
+    logoAsset: "../assets/reemi.png",
+    appstore:
+      " https://apps.apple.com/us/app/reemi-social-reminders/id6742418635",
+  },
+  {
+    name: "Swipey",
+    description:
+      "Swipey is the next-gen financial OS that helps you manage all your business finances in one place.",
+    logoAsset: "../assets/swipey.png",
+    website: "https://swipey.co/",
+    appstore:
+      "https://apps.apple.com/id/app/swipey-fin-os-for-modern-biz/id1589412706",
+  },
+  {
+    name: "Wave",
+    description:
+      "Wave is the AI-powered transcription and summarization app for audio recordings and phone calls.",
+    logoAsset: "../assets/wave.png",
+    website: "https://wave.co/",
+    appstore:
+      "https://apps.apple.com/us/app/wave-ai-note-taker/id6451491556",
+    playstore: "https://play.google.com/store/apps/details?id=com.ma.waveapp",
+  },
+  {
+    name: "Knowhere",
+    description:
+      "Easily discover what you and your friends want to do, all in your hand, all in one place.",
+    logoAsset: "../assets/knowhere.png",
+    website: "https://knowheresocial.com/",
+    appstore: "https://apps.apple.com/us/app/knowhere/id6467689920",
+  },
+  {
+    name: "Rovelist",
+    description:
+      "Sustainable change through habits repeated daily. It's not about perfection, it's about consistency.",
+    logoAsset: "../assets/rovelist.png",
+    website: "https://www.rovelist.app/",
+    appstore:
+      "https://apps.apple.com/us/app/habit-tracker-rovelist/id6468539586",
+  },
+  {
+    name: "Avocado",
+    description:
+      "Easily log your meals with the Avocado App, set flexible goals, and stay on track with your nutrition like never before.",
+    logoAsset: "../assets/avocado.png",
+    appstore:
+      "https://apps.apple.com/us/app/avocado-calorie-goal-tracker/id6739069296",
+  },
+  {
+    name: "DayStack",
+    description:
+      "Take control of your daily routines. Track habits and never miss your supplements with smart reminders.",
+    logoAsset: "../assets/daystack.png",
+    appstore: "https://apps.apple.com/us/app/daystack-pro/id6741811908",
+    website: "https://www.daystack.co/",
+  },
+  {
+    name: "Ramble",
+    description: "Community app for the modern van traveler.",
+    logoAsset: "../assets/ramble.png",
+    website: "https://ramble.guide/",
+    appstore:
+      "https://apps.apple.com/us/app/ramble-van-travel-app/id6468265289",
+    playstore:
+      "https://play.google.com/store/apps/details?id=co.noquarter.ramble",
+  },
+  {
+    name: "Quiztr",
+    description: "Learn anything for school, work or fun.",
+    logoAsset: "../assets/quiztr.png",
+    website: "https://quiztr.com/",
+    appstore:
+      "https://apps.apple.com/fr/app/quiztr-fiche-de-r%C3%A9vision/id6503441928",
+    playstore:
+      "https://play.google.com/store/apps/details?id=com.quiztr.mobile.app",
+  },
+  {
+    name: "Mylo",
+    description:
+      "Mylo är appen som gör juridiken enkel. Skapa juridiska avtal på egen hand, signera säkert med BankID och spara allt i ett tryggt moln.",
+    logoAsset: "../assets/mylo.png",
+    website: "https://mylo.law/",
+    appstore:
+      "https://apps.apple.com/se/app/mylo-avtal-och-dokument/id6733253272",
+    playstore:
+      "https://play.google.com/store/apps/details?id=io.happycart.app",
+  },
+  {
+    name: "Focusminny",
+    description: "Turn Your Phone into a Productivity Companion—Not a Distraction!",
+    logoAsset: "../assets/focusminny.png",
+    website: "https://www.focusminny.app/",
+    appstore:
+      "https://apps.apple.com/us/app/focusminny-stay-focused-ai/id6738607046",
+  },
+  {
+    name: "BIC Group",
+    description:
+      "Beincom (BIC Group) is a social platform focused on community building.",
+    logoAsset: "../assets/BIC.png",
+    appstore: "https://apps.apple.com/vn/app/bic-group/id6444276276",
+  },
+  {
+    name: "Fluently",
+    description: "AI-powered English coach.",
+    logoAsset: "../assets/fluently.png",
+    website: "https://getfluently.app/",
+    appstore:
+      "https://apps.apple.com/us/app/fluently-ai-english-tutor/id6683289805",
+  },
+  {
+    name: "Shutter Mate",
+    description: "ShutterMate is your ultimate photography companion!",
+    logoAsset: "../assets/shuttermate.png",
+    appstore: "https://apps.apple.com/in/app/shutter-mate/id6738705813",
+    playstore:
+      "https://play.google.com/store/apps/details?id=com.shuttermate.app",
+  },
+  {
+    name: "GoTogether",
+    description:
+      "Discover events and find people to join you—make solo events a thing of the past.",
+    logoAsset: "../assets/gotogether.png",
+    website: "https://gogether.app/",
+    appstore: "https://apps.apple.com/in/app/gogether/id6739421081",
+    playstore:
+      "https://play.google.com/store/apps/details?id=com.gogether.app",
+  },
+  {
+    name: "MindLumen",
+    description: "Your personal AI therapist for mental wellbeing",
+    logoAsset: "../assets/MindLumen.png",
+    website: "https://mindlumen.ai/",
+    appstore:
+      "https://apps.apple.com/nl/app/ai-therapist-mindlumen/id6738006220",
+  },
+  {
+    name: "Hivemind",
+    description: "Turn any topic into your personal social media feed with AI.",
+    logoAsset: "../assets/hivemind.png",
+    website: "https://gethivemind.app/",
+    appstore:
+      "https://apps.apple.com/de/app/hivemind-study-by-scrolling/id6737344456",
+  },
+  {
+    name: "Folo",
+    description: "🧡 Follow everything in one place",
+    logoAsset: "../assets/folo.png",
+    website: "https://follow.is/",
+    appstore:
+      "https://apps.apple.com/us/app/folo-follow-everything/id6739802604",
+  },
+  {
+    name: "VibeCode",
+    description: "The mobile app that builds mobile apps",
+    logoAsset: "../assets/vibecode.png",
+    website: "https://vibecodeapp.com/",
+    appstore: "https://apps.apple.com/us/app/vibecode/id6742912146",
+  },
+];

From 58b8ee044dcb439bc2e7c0c6ff3ab373f456aa12 Mon Sep 17 00:00:00 2001
From: Dan Stepanov <danstepanov@users.noreply.github.com>
Date: Wed, 23 Sep 2026 02:47:49 -0400
Subject: [PATCH 2/2] Add Nativewind design from Discord request
 1552188733791543327

Design-Input: 2cf0f1c45ac356e1142dd451baaf9eb7a13b06eb7f3a8f04ed4ff84d7cbcc7d6
---
 app/(home)/TestimonialsSectionContents.tsx | 279 ++++++++++++++++++---
 1 file changed, 242 insertions(+), 37 deletions(-)

diff --git a/app/(home)/TestimonialsSectionContents.tsx b/app/(home)/TestimonialsSectionContents.tsx
index 3d8a398..8f9bbb9 100644
--- a/app/(home)/TestimonialsSectionContents.tsx
+++ b/app/(home)/TestimonialsSectionContents.tsx
@@ -1,3 +1,26 @@
+import AvocadoLogo from "../assets/avocado.png";
+import BICLogo from "../assets/BIC.png";
+import BrainnotesLogo from "../assets/brainnotes.png";
+import DayStackLogo from "../assets/daystack.png";
+import FluentlyLogo from "../assets/fluently.png";
+import FocusminnyLogo from "../assets/focusminny.png";
+import GoTogetherLogo from "../assets/gotogether.png";
+import HivemindLogo from "../assets/hivemind.png";
+import HyppeLogo from "../assets/hyppe.png";
+import KnowhereLogo from "../assets/knowhere.png";
+import MindLumenLogo from "../assets/MindLumen.png";
+import MyloLogo from "../assets/mylo.png";
+import NeonCityLogo from "../assets/neoncity.png";
+import NoonaLogo from "../assets/noona.png";
+import QuiztrLogo from "../assets/quiztr.png";
+import RambleLogo from "../assets/ramble.png";
+import ReemiLogo from "../assets/reemi.png";
+import RovelistLogo from "../assets/rovelist.png";
+import SewaYouLogo from "../assets/sewayou.png";
+import ShutterMateLogo from "../assets/shuttermate.png";
+import SwipeyLogo from "../assets/swipey.png";
+import VibeCodeLogo from "../assets/vibecode.png";
+import WaveLogo from "../assets/wave.png";
 import ShowcaseItem, { type ShowcaseItemProps } from "./ShowcaseItem";
 
 export default function TestimonialsSectionContents() {
@@ -10,28 +33,28 @@ export default function TestimonialsSectionContents() {
       </div>
 
       <div className="hidden sm:flex lg:hidden flex-col">
-        {items.slice(0, 5).map((item) => (
+        {getColumnItems(0, 2).map((item) => (
           <ShowcaseItem key={item.name} {...item} />
         ))}
       </div>
       <div className="hidden sm:flex lg:hidden flex-col">
-        {items.slice(5).map((item) => (
+        {getColumnItems(1, 2).map((item) => (
           <ShowcaseItem key={item.name} {...item} />
         ))}
       </div>
 
       <div className="hidden lg:flex flex-col">
-        {items.slice(0, 4).map((item) => (
+        {getColumnItems(0, 3).map((item) => (
           <ShowcaseItem key={item.name} {...item} />
         ))}
       </div>
       <div className="hidden lg:flex flex-col">
-        {items.slice(4, 7).map((item) => (
+        {getColumnItems(1, 3).map((item) => (
           <ShowcaseItem key={item.name} {...item} />
         ))}
       </div>
       <div className="hidden lg:flex flex-col">
-        {items.slice(7).map((item) => (
+        {getColumnItems(2, 3).map((item) => (
           <ShowcaseItem key={item.name} {...item} />
         ))}
       </div>
@@ -39,9 +62,14 @@ export default function TestimonialsSectionContents() {
   );
 }
 
+function getColumnItems(columnIndex: number, columnCount: number) {
+  return items.filter((_, itemIndex) => itemIndex % columnCount === columnIndex);
+}
+
 // Brand snapshot: 8fedabcab4bb480b40a0d84002c12e32e03e6e23.
-// Ordered by the saved public repository ranking verified on 2026-09-21.
-// Each repository below declared Nativewind in its dependency manifest.
+// The first six entries follow the showcase order requested for this revision.
+// The remaining researched entries retain their verified order, followed by the
+// earlier showcase entries restored from the preserved data.
 const items: ShowcaseItemProps[] = [
   {
     name: "PostHog",
@@ -51,13 +79,18 @@ const items: ShowcaseItemProps[] = [
     website: "https://posthog.com/",
   },
   {
-    name: "Folo",
+    name: "Polar",
     description:
-      "Folo is a personalized RSS reader and content hub for following everything in one place.",
-    logo: "https://github.com/RSSNext.png?size=256",
-    website: "https://folo.is/",
-    appstore:
-      "https://apps.apple.com/us/app/folo-follow-everything/id6739802604",
+      "Polar provides billing infrastructure for subscriptions, usage, invoicing, and global sales tax.",
+    logo: "https://github.com/polarsource.png?size=256",
+    website: "https://polar.sh/",
+  },
+  {
+    name: "Kortix",
+    description:
+      "Kortix is an open source AI management system for agents, shared skills, company memory, and connectors.",
+    logo: "https://github.com/kortix-ai.png?size=256",
+    website: "https://www.kortix.com/",
   },
   {
     name: "Onyx",
@@ -66,6 +99,25 @@ const items: ShowcaseItemProps[] = [
     logo: "https://github.com/onyx-dot-app.png?size=256",
     website: "https://www.onyx.app/",
   },
+  {
+    name: "Wave",
+    description:
+      "Wave is the AI-powered transcription and summarization app for audio recordings and phone calls.",
+    logo: WaveLogo,
+    website: "https://wave.co/",
+    appstore:
+      "https://apps.apple.com/us/app/wave-ai-note-taker/id6451491556",
+    playstore: "https://play.google.com/store/apps/details?id=com.ma.waveapp",
+  },
+  {
+    name: "Folo",
+    description:
+      "Folo is a personalized RSS reader and content hub for following everything in one place.",
+    logo: "https://github.com/RSSNext.png?size=256",
+    website: "https://folo.is/",
+    appstore:
+      "https://apps.apple.com/us/app/folo-follow-everything/id6739802604",
+  },
   {
     name: "Karakeep",
     description:
@@ -76,13 +128,6 @@ const items: ShowcaseItemProps[] = [
     playstore:
       "https://play.google.com/store/apps/details?id=app.hoarder.hoardermobile",
   },
-  {
-    name: "Kortix",
-    description:
-      "Kortix is an open source AI management system for agents, shared skills, company memory, and connectors.",
-    logo: "https://github.com/kortix-ai.png?size=256",
-    website: "https://www.kortix.com/",
-  },
   {
     name: "Linkwarden",
     description:
@@ -91,32 +136,192 @@ const items: ShowcaseItemProps[] = [
     website: "https://linkwarden.app/",
   },
   {
-    name: "Polar",
+    name: "Streamyfin",
     description:
-      "Polar provides billing infrastructure for subscriptions, usage, invoicing, and global sales tax.",
-    logo: "https://github.com/polarsource.png?size=256",
-    website: "https://polar.sh/",
+      "Streamyfin is an open source Jellyfin client for streaming media on iOS, tvOS, and Android.",
+    logo: "https://github.com/streamyfin.png?size=256",
+    website: "https://streamyfin.app/",
+    appstore: "https://apps.apple.com/gb/app/streamyfin/id6593660679",
   },
   {
-    name: "Founded Labs",
+    name: "NeonCity",
     description:
-      "Founded Labs builds React Native Reusables, an open source component registry crafted with Nativewind.",
-    logo: "https://github.com/founded-labs.png?size=256",
-    website: "https://reactnativereusables.com/",
+      "NeonCity: CityRunner is a high-quality mobile game built with React Native created by Daehyeon Mun.",
+    logo: NeonCityLogo,
+    appstore:
+      "https://apps.apple.com/us/app/neoncity-cityrunner/id6477771151?platform=iphone",
+  },
+  {
+    name: "Noona",
+    description: "Noona is a marketplace for services and experiences.",
+    logo: NoonaLogo,
+    website: "https://noona.app/hq",
+    appstore: "https://apps.apple.com/us/app/noona-book-anything/id1448498295",
   },
   {
-    name: "gluestack",
+    name: "Hyppe",
     description:
-      "gluestack offers customizable components and patterns for React, Next.js, and React Native.",
-    logo: "https://github.com/gluestack.png?size=256",
-    website: "https://gluestack.io/",
+      "Hyppe es más que una aplicación de fitness, es una comunidad vibrante de personas apasionadas dedicadas a alcanzar sus metas de salud y bienestar.",
+    logo: HyppeLogo,
+    appstore: "https://apps.apple.com/us/app/hyppe/id6473208513",
   },
   {
-    name: "Streamyfin",
+    name: "SewaYou",
     description:
-      "Streamyfin is an open source Jellyfin client for streaming media on iOS, tvOS, and Android.",
-    logo: "https://github.com/streamyfin.png?size=256",
-    website: "https://streamyfin.app/",
-    appstore: "https://apps.apple.com/gb/app/streamyfin/id6593660679",
+      "SewaYou is a location-based social app that helps you easily find and connect with new friends both online and in person, anywhere in the world.",
+    logo: SewaYouLogo,
+    appstore:
+      "https://apps.apple.com/us/app/sewayou-make-new-friends/id1455473510",
+    playstore: "https://play.google.com/store/apps/details?id=com.sewayou",
+  },
+  {
+    name: "Brainnotes",
+    description: "Summarize anything, videos & PDFs and audios all in one app.",
+    logo: BrainnotesLogo,
+    website: "https://brainnotes.app/",
+    appstore:
+      "https://apps.apple.com/us/app/brainnotes-summarizer/id6744852497",
+  },
+  {
+    name: "Reemi",
+    description: "Get notifications to check in with your favorite people.",
+    logo: ReemiLogo,
+    appstore:
+      "https://apps.apple.com/us/app/reemi-social-reminders/id6742418635",
+  },
+  {
+    name: "Swipey",
+    description:
+      "Swipey is the next-gen financial OS that helps you manage all your business finances in one place.",
+    logo: SwipeyLogo,
+    website: "https://swipey.co/",
+    appstore:
+      "https://apps.apple.com/id/app/swipey-fin-os-for-modern-biz/id1589412706",
+  },
+  {
+    name: "Knowhere",
+    description:
+      "Easily discover what you and your friends want to do, all in your hand, all in one place.",
+    logo: KnowhereLogo,
+    website: "https://knowheresocial.com/",
+    appstore: "https://apps.apple.com/us/app/knowhere/id6467689920",
+  },
+  {
+    name: "Rovelist",
+    description:
+      "Sustainable change through habits repeated daily. It's not about perfection, it's about consistency.",
+    logo: RovelistLogo,
+    website: "https://www.rovelist.app/",
+    appstore:
+      "https://apps.apple.com/us/app/habit-tracker-rovelist/id6468539586",
+  },
+  {
+    name: "Avocado",
+    description:
+      "Easily log your meals with the Avocado App, set flexible goals, and stay on track with your nutrition like never before.",
+    logo: AvocadoLogo,
+    appstore:
+      "https://apps.apple.com/us/app/avocado-calorie-goal-tracker/id6739069296",
+  },
+  {
+    name: "DayStack",
+    description:
+      "Take control of your daily routines. Track habits and never miss your supplements with smart reminders.",
+    logo: DayStackLogo,
+    appstore: "https://apps.apple.com/us/app/daystack-pro/id6741811908",
+    website: "https://www.daystack.co/",
+  },
+  {
+    name: "Ramble",
+    description: "Community app for the modern van traveler.",
+    logo: RambleLogo,
+    website: "https://ramble.guide/",
+    appstore:
+      "https://apps.apple.com/us/app/ramble-van-travel-app/id6468265289",
+    playstore:
+      "https://play.google.com/store/apps/details?id=co.noquarter.ramble",
+  },
+  {
+    name: "Quiztr",
+    description: "Learn anything for school, work or fun.",
+    logo: QuiztrLogo,
+    website: "https://quiztr.com/",
+    appstore:
+      "https://apps.apple.com/fr/app/quiztr-fiche-de-r%C3%A9vision/id6503441928",
+    playstore:
+      "https://play.google.com/store/apps/details?id=com.quiztr.mobile.app",
+  },
+  {
+    name: "Mylo",
+    description:
+      "Mylo är appen som gör juridiken enkel. Skapa juridiska avtal på egen hand, signera säkert med BankID och spara allt i ett tryggt moln.",
+    logo: MyloLogo,
+    website: "https://mylo.law/",
+    appstore:
+      "https://apps.apple.com/se/app/mylo-avtal-och-dokument/id6733253272",
+    playstore: "https://play.google.com/store/apps/details?id=io.happycart.app",
+  },
+  {
+    name: "Focusminny",
+    description: "Turn Your Phone into a Productivity Companion—Not a Distraction!",
+    logo: FocusminnyLogo,
+    website: "https://www.focusminny.app/",
+    appstore:
+      "https://apps.apple.com/us/app/focusminny-stay-focused-ai/id6738607046",
+  },
+  {
+    name: "BIC Group",
+    description:
+      "Beincom (BIC Group) is a social platform focused on community building.",
+    logo: BICLogo,
+    appstore: "https://apps.apple.com/vn/app/bic-group/id6444276276",
+  },
+  {
+    name: "Fluently",
+    description: "AI-powered English coach.",
+    logo: FluentlyLogo,
+    website: "https://getfluently.app/",
+    appstore:
+      "https://apps.apple.com/us/app/fluently-ai-english-tutor/id6683289805",
+  },
+  {
+    name: "Shutter Mate",
+    description: "ShutterMate is your ultimate photography companion!",
+    logo: ShutterMateLogo,
+    appstore: "https://apps.apple.com/in/app/shutter-mate/id6738705813",
+    playstore:
+      "https://play.google.com/store/apps/details?id=com.shuttermate.app",
+  },
+  {
+    name: "GoTogether",
+    description:
+      "Discover events and find people to join you—make solo events a thing of the past.",
+    logo: GoTogetherLogo,
+    website: "https://gogether.app/",
+    appstore: "https://apps.apple.com/in/app/gogether/id6739421081",
+    playstore: "https://play.google.com/store/apps/details?id=com.gogether.app",
+  },
+  {
+    name: "MindLumen",
+    description: "Your personal AI therapist for mental wellbeing",
+    logo: MindLumenLogo,
+    website: "https://mindlumen.ai/",
+    appstore:
+      "https://apps.apple.com/nl/app/ai-therapist-mindlumen/id6738006220",
+  },
+  {
+    name: "Hivemind",
+    description: "Turn any topic into your personal social media feed with AI.",
+    logo: HivemindLogo,
+    website: "https://gethivemind.app/",
+    appstore:
+      "https://apps.apple.com/de/app/hivemind-study-by-scrolling/id6737344456",
+  },
+  {
+    name: "VibeCode",
+    description: "The mobile app that builds mobile apps",
+    logo: VibeCodeLogo,
+    website: "https://vibecodeapp.com/",
+    appstore: "https://apps.apple.com/us/app/vibecode/id6742912146",
   },
 ];