feat: landing redesign in resources aesthetic; fix KB search crash

Landing: - Rebuilt app/(landing)/page.tsx from a 539-line client monolith to a ~150-line server component in the /resources editorial style. - New scoped app/(landing)/landing.css mirrors the resources palette (#0c0c0c / lime #d4ff00 / #252525), IBM Plex Mono + Libre Baskerville loaded in (landing)/layout.tsx, faint grid overlay. - Removed the animated Mini* previews and inline Ico* set (clashed with the editorial look). Split into components/landing/icons.tsx and components/landing/resource-showcase.tsx for separation. - Resource showcase: one row of six square tiles with the real project SVG logos linking to atlas/space-after-dark/proposal-duel/ zine/learner/governance. Responsive 6 -> 3 -> 2. - BrandMark accepts an optional style prop. Fix: - KB search crashed the Ops page. filteredLeads referenced l.member_name (the column is lead_handle), so undefined.toLowerCase() threw on every keystroke since the filter memos recompute on shared search state across tabs. All Ops filter predicates are now null-safe via a shared has() helper; filteredSecrets no longer assumes a non-null title. Docs: - docs/PERMISSIONS_DESIGN.md: concrete plan for customizable permissions, per-item Ops ACLs, and area-lead roles. That work is security-sensitive (RLS rewrites on secrets/knowledge_base) and is scoped as its own next pass, not bundled here. 266/266 tests pass. Production build clean. No migration this pass.
2026-05-15 16:15:56 -07:00
parent 71d5e243cf
commit 43f9c09d70
10 changed files with 534 additions and 506 deletions
@@ -0,0 +1,27 @@
+import type { SVGProps } from 'react'
+
+type IconProps = SVGProps<SVGSVGElement>
+
+export function GithubIcon({ className }: { className?: string }) {
+  return (
+    <svg className={className} viewBox="0 0 24 24" fill="currentColor" aria-hidden="true">
+      <path fillRule="evenodd" clipRule="evenodd" d="M12 .5C5.65.5.5 5.65.5 12c0 5.08 3.29 9.39 7.86 10.91.58.11.79-.25.79-.56 0-.27-.01-1.01-.02-1.98-3.2.7-3.88-1.54-3.88-1.54-.52-1.33-1.27-1.69-1.27-1.69-1.04-.71.08-.7.08-.7 1.15.08 1.76 1.18 1.76 1.18 1.03 1.76 2.7 1.25 3.36.96.1-.75.4-1.25.73-1.54-2.55-.29-5.24-1.28-5.24-5.69 0-1.26.45-2.29 1.18-3.09-.12-.29-.51-1.45.11-3.02 0 0 .97-.31 3.18 1.18.92-.26 1.91-.39 2.89-.39.98 0 1.97.13 2.89.39 2.2-1.49 3.17-1.18 3.17-1.18.63 1.57.23 2.73.11 3.02.74.8 1.18 1.83 1.18 3.09 0 4.42-2.69 5.4-5.25 5.68.41.35.78 1.04.78 2.11 0 1.52-.01 2.74-.01 3.11 0 .31.21.68.8.56 4.57-1.52 7.85-5.83 7.85-10.91C23.5 5.65 18.35.5 12 .5z" />
+    </svg>
+  )
+}
+
+export function ArrowIcon(props: IconProps) {
+  return (
+    <svg viewBox="0 0 16 16" fill="none" stroke="currentColor" strokeWidth={1.5} {...props}>
+      <path d="M3 8h10M9 4l4 4-4 4" />
+    </svg>
+  )
+}
+
+export function ExternalArrowIcon(props: IconProps) {
+  return (
+    <svg viewBox="0 0 16 16" fill="none" stroke="currentColor" strokeWidth={1.5} {...props}>
+      <path d="M4 12L12 4M12 4H6M12 4v6" />
+    </svg>
+  )
+}
@@ -0,0 +1,43 @@
+import Link from 'next/link'
+import { AtlasLogo } from '@/components/resources/atlas-logo'
+import { CubeIcon, TraceIcon, SpaceIcon, GridIcon, KeyIcon } from '@/components/resources/icons'
+
+// The six hackerspace.sh research/game projects, shown as a single row of
+// square tiles at the foot of the landing page. Internal routes use next/link;
+// the interactive learner is an external app.
+const RESOURCES = [
+  { title: 'Atlas', href: '/atlas', external: false, visual: <AtlasLogo /> },
+  { title: 'Space After Dark', href: '/space-after-dark', external: false, visual: <CubeIcon /> },
+  { title: 'Proposal Duel', href: '/proposal-duel', external: false, visual: <TraceIcon /> },
+  { title: 'The Hackerspace Game', href: '/zine', external: false, visual: <SpaceIcon /> },
+  { title: 'Interactive Learner', href: 'https://hackerspacegame.netlify.app/', external: true, visual: <GridIcon /> },
+  { title: 'Governance in a Box', href: '/governance', external: false, visual: <KeyIcon /> },
+]
+
+export function ResourceShowcase() {
+  return (
+    <section className="landing-section">
+      <div className="landing-container">
+        <div className="landing-section-head">
+          <span className="landing-section-label">From hackerspace.sh</span>
+          <span className="landing-section-note">06 projects</span>
+        </div>
+        <div className="landing-showcase">
+          {RESOURCES.map(r =>
+            r.external ? (
+              <a key={r.title} href={r.href} target="_blank" rel="noopener noreferrer" className="landing-tile">
+                <span className="landing-tile-visual">{r.visual}</span>
+                <span className="landing-tile-title">{r.title}</span>
+              </a>
+            ) : (
+              <Link key={r.title} href={r.href} className="landing-tile">
+                <span className="landing-tile-visual">{r.visual}</span>
+                <span className="landing-tile-title">{r.title}</span>
+              </Link>
+            ),
+          )}
+        </div>
+      </div>
+    </section>
+  )
+}