From 5336bcf0c2fd077b1e3a32058f3c4bad142d659c Mon Sep 17 00:00:00 2001
From: "Builder.io" <builder-bot@builder.io>
Date: Sat, 18 Oct 2025 22:41:08 +0000
Subject: [PATCH] Prettier format pending files

---
 client/components/admin/AdminSystemMap.tsx | 171 +++++++++++++++++----
 client/pages/Realms.tsx                    |  76 ++++++---
 2 files changed, 198 insertions(+), 49 deletions(-)

diff --git a/client/components/admin/AdminSystemMap.tsx b/client/components/admin/AdminSystemMap.tsx
index 2e493230..9d840483 100644
--- a/client/components/admin/AdminSystemMap.tsx
+++ b/client/components/admin/AdminSystemMap.tsx
@@ -1,7 +1,24 @@
-import { Card, CardContent, CardHeader, CardTitle, CardDescription } from "@/components/ui/card";
+import {
+  Card,
+  CardContent,
+  CardHeader,
+  CardTitle,
+  CardDescription,
+} from "@/components/ui/card";
 import { Badge } from "@/components/ui/badge";
 import { cn } from "@/lib/utils";
-import { Database, Globe, Layers, Network, Route, ServerCog, ShieldCheck, Spline, Users, Workflow } from "lucide-react";
+import {
+  Database,
+  Globe,
+  Layers,
+  Network,
+  Route,
+  ServerCog,
+  ShieldCheck,
+  Spline,
+  Users,
+  Workflow,
+} from "lucide-react";
 
 type Node = {
   id: string;
@@ -13,25 +30,91 @@ type Node = {
 
 const NODES: Node[] = [
   // Entry/realms
-  { id: "realms", label: "Realms", subtitle: "GD / Consulting / Community / Get Started", icon: Workflow, group: "entry" },
-  { id: "onboarding", label: "Onboarding", subtitle: "Profile • Interests • Path", icon: Users, group: "entry" },
+  {
+    id: "realms",
+    label: "Realms",
+    subtitle: "GD / Consulting / Community / Get Started",
+    icon: Workflow,
+    group: "entry",
+  },
+  {
+    id: "onboarding",
+    label: "Onboarding",
+    subtitle: "Profile • Interests • Path",
+    icon: Users,
+    group: "entry",
+  },
 
   // Frontend app
-  { id: "dashboard", label: "Dashboard", subtitle: "Realm‑aware UI", icon: Globe, group: "frontend" },
-  { id: "routes", label: "Routes", subtitle: "/feed • /status • /teams • /docs", icon: Route, group: "frontend" },
+  {
+    id: "dashboard",
+    label: "Dashboard",
+    subtitle: "Realm‑aware UI",
+    icon: Globe,
+    group: "frontend",
+  },
+  {
+    id: "routes",
+    label: "Routes",
+    subtitle: "/feed • /status • /teams • /docs",
+    icon: Route,
+    group: "frontend",
+  },
 
   // Product services (frontend+api)
-  { id: "feed", label: "Social Feed", subtitle: "Posts • Likes • Comments • Tags", icon: Layers, group: "services" },
-  { id: "mentorship", label: "Mentorship", subtitle: "Requests • Mentors • Moderation", icon: Users, group: "services" },
-  { id: "status", label: "Status", subtitle: "Live health from /api/status", icon: ShieldCheck, group: "services" },
-  { id: "investors", label: "Investors", subtitle: "Interest • Client realm", icon: Network, group: "services" },
+  {
+    id: "feed",
+    label: "Social Feed",
+    subtitle: "Posts • Likes • Comments • Tags",
+    icon: Layers,
+    group: "services",
+  },
+  {
+    id: "mentorship",
+    label: "Mentorship",
+    subtitle: "Requests • Mentors • Moderation",
+    icon: Users,
+    group: "services",
+  },
+  {
+    id: "status",
+    label: "Status",
+    subtitle: "Live health from /api/status",
+    icon: ShieldCheck,
+    group: "services",
+  },
+  {
+    id: "investors",
+    label: "Investors",
+    subtitle: "Interest • Client realm",
+    icon: Network,
+    group: "services",
+  },
 
   // Backend
-  { id: "api", label: "API", subtitle: "Node/Express server routes", icon: ServerCog, group: "backend" },
-  { id: "db", label: "Supabase", subtitle: "Auth • Profiles • Content • Migrations", icon: Database, group: "backend" },
+  {
+    id: "api",
+    label: "API",
+    subtitle: "Node/Express server routes",
+    icon: ServerCog,
+    group: "backend",
+  },
+  {
+    id: "db",
+    label: "Supabase",
+    subtitle: "Auth • Profiles • Content • Migrations",
+    icon: Database,
+    group: "backend",
+  },
 
   // Infra
-  { id: "hosting", label: "Hosting/CDN", subtitle: "Vercel/Netlify + Edge", icon: Spline, group: "infra" },
+  {
+    id: "hosting",
+    label: "Hosting/CDN",
+    subtitle: "Vercel/Netlify + Edge",
+    icon: Spline,
+    group: "infra",
+  },
 ];
 
 // Directed edges between nodes
@@ -65,11 +148,13 @@ const groupStyles: Record<Node["group"], string> = {
 function NodeCard({ node }: { node: Node }) {
   const Icon = node.icon ?? Globe;
   return (
-    <div className={cn(
-      "rounded-xl border p-3 text-sm shadow-sm",
-      "bg-gradient-to-br",
-      groupStyles[node.group],
-    )}>
+    <div
+      className={cn(
+        "rounded-xl border p-3 text-sm shadow-sm",
+        "bg-gradient-to-br",
+        groupStyles[node.group],
+      )}
+    >
       <div className="flex items-center gap-2">
         <div className="rounded-lg bg-black/30 p-1.5">
           <Icon className="h-4 w-4 text-white/90" />
@@ -90,53 +175,79 @@ export default function AdminSystemMap() {
     <Card className="bg-card/60 border-border/40 backdrop-blur">
       <CardHeader>
         <CardTitle>System map</CardTitle>
-        <CardDescription>High‑level architecture and primary flows</CardDescription>
+        <CardDescription>
+          High‑level architecture and primary flows
+        </CardDescription>
       </CardHeader>
       <CardContent>
         <div className="grid gap-4">
           {/* Row: entry */}
           <div className="grid grid-cols-1 sm:grid-cols-2 lg:grid-cols-4 gap-3">
-            {NODES.filter(n => n.group === "entry").map(n => (
+            {NODES.filter((n) => n.group === "entry").map((n) => (
               <NodeCard key={n.id} node={n} />
             ))}
           </div>
 
           {/* Row: frontend */}
           <div className="grid grid-cols-1 sm:grid-cols-2 gap-3">
-            {NODES.filter(n => n.group === "frontend").map(n => (
+            {NODES.filter((n) => n.group === "frontend").map((n) => (
               <NodeCard key={n.id} node={n} />
             ))}
           </div>
 
           {/* Row: services */}
           <div className="grid grid-cols-1 sm:grid-cols-2 lg:grid-cols-4 gap-3">
-            {NODES.filter(n => n.group === "services").map(n => (
+            {NODES.filter((n) => n.group === "services").map((n) => (
               <NodeCard key={n.id} node={n} />
             ))}
           </div>
 
           {/* Row: backend + infra */}
           <div className="grid grid-cols-1 sm:grid-cols-2 lg:grid-cols-3 gap-3">
-            {NODES.filter(n => n.group === "backend").map(n => (
+            {NODES.filter((n) => n.group === "backend").map((n) => (
               <NodeCard key={n.id} node={n} />
             ))}
-            {NODES.filter(n => n.group === "infra").map(n => (
+            {NODES.filter((n) => n.group === "infra").map((n) => (
               <NodeCard key={n.id} node={n} />
             ))}
           </div>
 
           {/* Legend */}
           <div className="mt-2 flex flex-wrap gap-2 text-[11px] text-muted-foreground">
-            <Badge variant="outline" className="border-emerald-500/30 text-emerald-200">Entry</Badge>
-            <Badge variant="outline" className="border-indigo-500/30 text-indigo-200">Frontend</Badge>
-            <Badge variant="outline" className="border-fuchsia-500/30 text-fuchsia-200">Services</Badge>
-            <Badge variant="outline" className="border-sky-500/30 text-sky-200">Backend</Badge>
-            <Badge variant="outline" className="border-amber-500/30 text-amber-200">Infra</Badge>
+            <Badge
+              variant="outline"
+              className="border-emerald-500/30 text-emerald-200"
+            >
+              Entry
+            </Badge>
+            <Badge
+              variant="outline"
+              className="border-indigo-500/30 text-indigo-200"
+            >
+              Frontend
+            </Badge>
+            <Badge
+              variant="outline"
+              className="border-fuchsia-500/30 text-fuchsia-200"
+            >
+              Services
+            </Badge>
+            <Badge variant="outline" className="border-sky-500/30 text-sky-200">
+              Backend
+            </Badge>
+            <Badge
+              variant="outline"
+              className="border-amber-500/30 text-amber-200"
+            >
+              Infra
+            </Badge>
           </div>
 
           {/* Edges list (readable relationships) */}
           <div className="mt-4 rounded-xl border border-border/40 bg-background/40 p-3">
-            <div className="text-xs font-medium text-foreground mb-2">Flows</div>
+            <div className="text-xs font-medium text-foreground mb-2">
+              Flows
+            </div>
             <ul className="grid gap-1 text-xs text-muted-foreground sm:grid-cols-2 lg:grid-cols-3">
               {EDGES.map(([from, to, note]) => (
                 <li key={`${from}-${to}`}>
diff --git a/client/pages/Realms.tsx b/client/pages/Realms.tsx
index 97481073..cd7a54ef 100644
--- a/client/pages/Realms.tsx
+++ b/client/pages/Realms.tsx
@@ -98,38 +98,63 @@ export default function Realms() {
         <section className="mt-12 space-y-6">
           <div>
             <Badge variant="outline">Contributor network</Badge>
-            <h2 className="mt-2 text-2xl font-semibold">Mentors, Maintainers, and Shipmates</h2>
-            <p className="text-muted-foreground">Grow the platform with us—teach, steward projects, and ship products together.</p>
+            <h2 className="mt-2 text-2xl font-semibold">
+              Mentors, Maintainers, and Shipmates
+            </h2>
+            <p className="text-muted-foreground">
+              Grow the platform with us—teach, steward projects, and ship
+              products together.
+            </p>
           </div>
           <div className="grid grid-cols-1 md:grid-cols-3 gap-4">
             <Card className="border-border/50 bg-card/50">
               <CardHeader>
                 <CardTitle>Mentors</CardTitle>
-                <CardDescription>Guide builders through 1:1 sessions, clinics, and code reviews.</CardDescription>
+                <CardDescription>
+                  Guide builders through 1:1 sessions, clinics, and code
+                  reviews.
+                </CardDescription>
               </CardHeader>
               <CardContent className="flex gap-2">
-                <Button asChild><Link to="/community/mentorship/apply">Become a mentor</Link></Button>
-                <Button asChild variant="outline"><Link to="/community/mentorship">Request mentorship</Link></Button>
+                <Button asChild>
+                  <Link to="/community/mentorship/apply">Become a mentor</Link>
+                </Button>
+                <Button asChild variant="outline">
+                  <Link to="/community/mentorship">Request mentorship</Link>
+                </Button>
               </CardContent>
             </Card>
             <Card className="border-border/50 bg-card/50">
               <CardHeader>
                 <CardTitle>Maintainers</CardTitle>
-                <CardDescription>Own modules, triage issues, and lead roadmap execution.</CardDescription>
+                <CardDescription>
+                  Own modules, triage issues, and lead roadmap execution.
+                </CardDescription>
               </CardHeader>
               <CardContent className="flex gap-2">
-                <Button asChild variant="outline"><Link to="/developers">Browse developers</Link></Button>
-                <Button asChild><Link to="/projects/new">Start a project</Link></Button>
+                <Button asChild variant="outline">
+                  <Link to="/developers">Browse developers</Link>
+                </Button>
+                <Button asChild>
+                  <Link to="/projects/new">Start a project</Link>
+                </Button>
               </CardContent>
             </Card>
             <Card className="border-border/50 bg-card/50">
               <CardHeader>
                 <CardTitle>Shipmates</CardTitle>
-                <CardDescription>Join product squads shipping across Labs, Platform, and Community.</CardDescription>
+                <CardDescription>
+                  Join product squads shipping across Labs, Platform, and
+                  Community.
+                </CardDescription>
               </CardHeader>
               <CardContent className="flex gap-2">
-                <Button asChild><Link to="/teams">Open Teams</Link></Button>
-                <Button asChild variant="outline"><Link to="/labs">Explore Labs</Link></Button>
+                <Button asChild>
+                  <Link to="/teams">Open Teams</Link>
+                </Button>
+                <Button asChild variant="outline">
+                  <Link to="/labs">Explore Labs</Link>
+                </Button>
               </CardContent>
             </Card>
           </div>
@@ -138,14 +163,20 @@ export default function Realms() {
         <section className="mt-12 space-y-6">
           <div>
             <Badge variant="outline">Teams hiring now</Badge>
-            <h2 className="mt-2 text-2xl font-semibold">Across Labs, Platform, and Community</h2>
-            <p className="text-muted-foreground">Apply to active squads and help us accelerate delivery.</p>
+            <h2 className="mt-2 text-2xl font-semibold">
+              Across Labs, Platform, and Community
+            </h2>
+            <p className="text-muted-foreground">
+              Apply to active squads and help us accelerate delivery.
+            </p>
           </div>
           <div className="grid grid-cols-1 md:grid-cols-3 gap-4">
             <Card className="border-border/50 bg-card/50">
               <CardHeader>
                 <CardTitle>Labs squads</CardTitle>
-                <CardDescription>R&amp;D and experimental products.</CardDescription>
+                <CardDescription>
+                  R&amp;D and experimental products.
+                </CardDescription>
               </CardHeader>
               <CardContent>
                 <ul className="list-disc pl-5 text-sm text-muted-foreground space-y-1">
@@ -154,14 +185,18 @@ export default function Realms() {
                   <li>Mentorship Programs</li>
                 </ul>
                 <div className="mt-3">
-                  <Button asChild size="sm"><Link to="/teams">View openings</Link></Button>
+                  <Button asChild size="sm">
+                    <Link to="/teams">View openings</Link>
+                  </Button>
                 </div>
               </CardContent>
             </Card>
             <Card className="border-border/50 bg-card/50">
               <CardHeader>
                 <CardTitle>Platform squads</CardTitle>
-                <CardDescription>Core app, APIs, and reliability.</CardDescription>
+                <CardDescription>
+                  Core app, APIs, and reliability.
+                </CardDescription>
               </CardHeader>
               <CardContent>
                 <ul className="list-disc pl-5 text-sm text-muted-foreground space-y-1">
@@ -170,7 +205,9 @@ export default function Realms() {
                   <li>Content &amp; Docs</li>
                 </ul>
                 <div className="mt-3">
-                  <Button asChild size="sm"><Link to="/teams">View openings</Link></Button>
+                  <Button asChild size="sm">
+                    <Link to="/teams">View openings</Link>
+                  </Button>
                 </div>
               </CardContent>
             </Card>
@@ -186,13 +223,14 @@ export default function Realms() {
                   <li>Creator Success</li>
                 </ul>
                 <div className="mt-3">
-                  <Button asChild size="sm" variant="outline"><Link to="/community">Open community</Link></Button>
+                  <Button asChild size="sm" variant="outline">
+                    <Link to="/community">Open community</Link>
+                  </Button>
                 </div>
               </CardContent>
             </Card>
           </div>
         </section>
-
       </div>
     </Layout>
   );