"use client";

import Link from "next/link";

type WikiItem = {
  title: string;
  note: string;
  href: string;
  external: boolean;
};

const ENTRIES: { cat: string; items: WikiItem[] }[] = [
  {
    cat: "Reference",
    items: [
      {
        title: "Tor Project (documentation)",
        note: "Official browser and onion-service documentation (clearnet).",
        href: "https://www.torproject.org/",
        external: true,
      },
      {
        title: "CyberLux primary hub",
        note: "Main storefront — verify hostname against signed mirror list.",
        href: "/",
        external: false,
      },
      {
        title: "Darknet Atlas (taxonomy)",
        note: "Intel-style map of underground verticals — swap in vetted onions after PGP cross-check.",
        href: "/darknet-atlas",
        external: false,
      },
      {
        title: "Account & dashboard",
        note: "Client-side vault unlock; dashboard aggregates forum, exchange, and barter handles.",
        href: "/dashboard",
        external: false,
      },
      {
        title: "Add funds (Bitcoin)",
        note: "Verified on-chain deposits credit USD to your signed-in handle.",
        href: "/account/add-funds",
        external: false,
      },
      {
        title: "Account on every hidden mirror",
        note: "Each .onion hostname has its own storage — register on each host or import a portable bundle.",
        href: "/account/hidden-services",
        external: false,
      },
      {
        title: "Void crawler (internal search)",
        note: "Ring-local crawler — indexes signed CyberLux routes only; no outbound onions.",
        href: "/search",
        external: false,
      },
    ],
  },
  {
    cat: "Directories & indexes",
    items: [
      {
        title: "Void crawler",
        note: "Search this deployment’s signed routes.",
        href: "/search",
        external: false,
      },
      {
        title: "Link garden",
        note: "Curated internal link board.",
        href: "/links",
        external: false,
      },
      {
        title: "Darknet Atlas",
        note: "Taxonomy with links back into CyberLux surfaces.",
        href: "/darknet-atlas",
        external: false,
      },
      {
        title: "Onion mirror map",
        note: "Per-host identity + portable account bundle.",
        href: "/account/hidden-services",
        external: false,
      },
    ],
  },
  {
    cat: "Markets & trading",
    items: [
      {
        title: "Market catalog",
        note: "Primary storefront SKUs.",
        href: "/market",
        external: false,
      },
      {
        title: "Classifieds (exchange)",
        note: "WTS / WTB listings on this host.",
        href: "/exchange",
        external: false,
      },
      {
        title: "Vendor hall",
        note: "Seller index and stall applications.",
        href: "/vendors",
        external: false,
      },
    ],
  },
  {
    cat: "Comms & privacy",
    items: [
      {
        title: "Messages (stub)",
        note: "Local UI shell — no remote mailbox yet.",
        href: "/messages",
        external: false,
      },
      {
        title: "Trust center",
        note: "Mirror hygiene and safety copy.",
        href: "/trust",
        external: false,
      },
      {
        title: "Support",
        note: "Contact and routing notes.",
        href: "/support",
        external: false,
      },
    ],
  },
  {
    cat: "Hosting & infrastructure",
    items: [
      {
        title: "Launch / deploy notes",
        note: "Tor + nginx operator entry.",
        href: "/launch",
        external: false,
      },
      {
        title: "Security analysis",
        note: "In-app security framing.",
        href: "/security-analysis",
        external: false,
      },
    ],
  },
  {
    cat: "Forums & social",
    items: [
      {
        title: "Void Aggregate (forums)",
        note: "Ringed boards on this build.",
        href: "/forum",
        external: false,
      },
      {
        title: "Chatter archive",
        note: "Hub commentary index.",
        href: "/chatter",
        external: false,
      },
    ],
  },
  {
    cat: "This deployment (internal)",
    items: [
      { title: "Relay grid", note: "Themed entry nodes — same wallet session as hub.", href: "/syndicate", external: false },
      { title: "Sign up (local)", note: "Create a handle on this hostname for forum, listings, and dashboard.", href: "/sign-up", external: false },
      { title: "Void Aggregate (forums)", note: "Ringed boards — local session data.", href: "/forum", external: false },
      { title: "Hub chatter archive", note: "Paged index of threads about the main storefront.", href: "/chatter", external: false },
      { title: "Classifieds", note: "WTS / WTB — same deployment.", href: "/exchange", external: false },
      { title: "Ash Pit (barter)", note: "Have / want swap board — dark trading floor.", href: "/barter", external: false },
      { title: "Link garden", note: "Alternate directory layout.", href: "/links", external: false },
      { title: "Checkout", note: "Bitcoin-funded USD balance.", href: "/checkout", external: false },
      { title: "Add funds", note: "Deposit flow + txid verify.", href: "/account/add-funds", external: false },
    ],
  },
];

export default function HiddenWikiPage() {
  return (
    <div className="min-h-screen bg-[#080a0e] text-[#c5d0e0] selection:bg-[#3d5a80] selection:text-white">
      <div
        className="pointer-events-none fixed inset-0 z-0 opacity-[0.12]"
        style={{
          backgroundImage: `url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='80' height='80'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.9' numOctaves='3' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='80' height='80' filter='url(%23n)' opacity='0.15'/%3E%3C/svg%3E")`,
        }}
      />
      <div className="pointer-events-none fixed inset-0 z-0 bg-[radial-gradient(ellipse_at_50%_0%,rgba(61,90,128,0.2),transparent_50%)]" />

      <header className="relative z-10 border-b border-[#2a3444] bg-[#0c1018]/95 px-4 py-6 backdrop-blur-sm">
        <div className="mx-auto max-w-3xl">
          <p className="font-mono text-[10px] uppercase tracking-[0.4em] text-[#5b8def]/80">mirror — wiki layer</p>
          <h1 className="mt-2 font-serif text-3xl font-bold tracking-tight text-[#e2e8f0] md:text-4xl">
            Scrapbook <span className="font-normal italic text-[#94a3b8]">directory</span>
          </h1>
          <p className="mt-3 border-l-4 border-[#e07a5f]/80 pl-4 text-sm leading-relaxed text-[#94a8b8]">
            <strong className="text-[#e2e8f0]">Unvetted links.</strong> Anyone can paste an .onion string — that does not
            mean it is safe, online, or honest. Verify hostnames against signed posts from sources you already trust.
          </p>
          <p className="mt-3 font-mono text-[11px] text-[#6b7c91]">
            External rows ship with a boilerplate{" "}
            <code className="rounded bg-[#1a2332] px-1.5 py-0.5 text-[#7eb8ff]">111111111111111111111.onion</code> stub until an
            operator publishes a signed replacement list.
          </p>
          <nav className="mt-5 flex flex-wrap gap-2 font-mono text-xs">
            <Link
              href="/"
              className="border border-[#3d5a80]/60 bg-[#141c2c] px-3 py-1.5 text-[#7eb8ff] hover:border-[#5b8def] hover:bg-[#1a2740]"
            >
              Hub
            </Link>
            <Link
              href="/sign-up"
              className="border border-[#2a4a32]/60 bg-[#0f1a14] px-3 py-1.5 text-[#7ef9b9] hover:border-[#3ddf8c]/50"
            >
              Sign up
            </Link>
            <Link
              href="/account/hidden-services"
              className="border border-[#2a3444] bg-[#0f141c] px-3 py-1.5 text-[#94a8b8] hover:border-[#3d5a80]/50"
            >
              All mirrors
            </Link>
            <Link
              href="/syndicate"
              className="border border-[#2a3444] bg-[#0f141c] px-3 py-1.5 text-[#94a8b8] hover:border-[#3d5a80]/50"
            >
              Relay grid
            </Link>
          </nav>
        </div>
      </header>

      <main className="relative z-10 mx-auto max-w-3xl px-4 pb-20 pt-10">
        {ENTRIES.map((section) => (
          <section key={section.cat} className="mb-12">
            <h2 className="font-mono text-xs font-bold uppercase tracking-widest text-[#e07a5f]/90">{section.cat}</h2>
            <ul className="mt-4 space-y-4 border-t border-[#2a3444] pt-4">
              {section.items.map((item) => (
                <li key={`${section.cat}-${item.title}`} className="border-b border-[#2a3444]/80 pb-4 last:border-0">
                  {item.external ? (
                    <a
                      href={item.href}
                      className="font-mono text-sm font-semibold text-[#7eb8ff] underline decoration-[#5b8def]/40 underline-offset-4 hover:decoration-[#7eb8ff]"
                      rel="noopener noreferrer"
                    >
                      {item.title}
                    </a>
                  ) : (
                    <Link
                      href={item.href}
                      className="font-mono text-sm font-semibold text-[#7eb8ff] underline decoration-[#5b8def]/40 underline-offset-4 hover:decoration-[#7eb8ff]"
                    >
                      {item.title}
                    </Link>
                  )}
                  <p className="mt-1 font-serif text-sm text-[#94a8b8]">{item.note}</p>
                  {item.external ? (
                    <p className="mt-1.5 font-mono text-xs break-all text-[#6b7c91]">{item.href}</p>
                  ) : null}
                </li>
              ))}
            </ul>
          </section>
        ))}
      </main>
    </div>
  );
}

