From 28ced660c021b15a71171508a04a714f3dbd371d Mon Sep 17 00:00:00 2001
From: Z8MB1E <jason@onyxsimple.com>
Date: Sat, 5 Sep 2026 00:02:20 -0400
Subject: [PATCH] feat(wiki): add wiki navigation and styles

Extract the static sidebar nav data into sidebarData.ts and add a Wiki
entry (BookOpen) to the main nav. Adds scoped markdown styles
(columns, footnotes, note/warning callouts) under .wiki-markdown.
---
 src/app/(frontend)/styles.css                 |  59 +++++++++
 src/components/frontend/blocks/AppSidebar.tsx | 121 +-----------------
 src/components/frontend/blocks/sidebarData.ts | 119 +++++++++++++++++
 3 files changed, 185 insertions(+), 114 deletions(-)
 create mode 100644 src/components/frontend/blocks/sidebarData.ts

diff --git a/src/app/(frontend)/styles.css b/src/app/(frontend)/styles.css
index 5afc001..086c29e 100644
--- a/src/app/(frontend)/styles.css
+++ b/src/app/(frontend)/styles.css
@@ -500,3 +500,62 @@
 *::-webkit-scrollbar-corner {
   background: transparent;
 }
+
+/* Wiki markdown — directives, footnotes, callouts (scoped to .wiki-markdown) */
+.wiki-markdown .columns {
+  display: grid;
+  grid-template-columns: repeat(auto-fit, minmax(0, 1fr));
+  gap: 1rem;
+}
+
+.wiki-markdown .columns.cols-2 {
+  grid-template-columns: repeat(2, 1fr);
+}
+
+.wiki-markdown .columns.cols-3 {
+  grid-template-columns: repeat(3, 1fr);
+}
+
+.wiki-markdown .column {
+  min-width: 0;
+}
+
+.wiki-markdown .footnotes {
+  font-size: 0.875rem;
+  color: var(--color-muted-foreground);
+  margin-top: 2rem;
+  border-top: 1px solid var(--color-border);
+  padding-top: 1rem;
+}
+
+.wiki-markdown .note,
+.wiki-markdown .warning {
+  position: relative;
+  border-left: 3px solid var(--color-border);
+  border-radius: 0.375rem;
+  padding: 0.75rem 1rem 0.75rem 2.5rem;
+}
+
+.wiki-markdown .note .callout-icon {
+  position: absolute;
+  left: 0.75rem;
+  top: 1.125rem;
+  color: var(--color-primary);
+}
+
+.wiki-markdown .warning .callout-icon {
+  position: absolute;
+  left: 0.75rem;
+  top: 1.125rem;
+  color: var(--color-destructive);
+}
+
+.wiki-markdown .note {
+  border-left-color: var(--color-primary);
+  background: color-mix(in oklch, var(--color-primary) 8%, transparent);
+}
+
+.wiki-markdown .warning {
+  border-left-color: var(--color-destructive);
+  background: color-mix(in oklch, var(--color-destructive) 8%, transparent);
+}
diff --git a/src/components/frontend/blocks/AppSidebar.tsx b/src/components/frontend/blocks/AppSidebar.tsx
index d89b528..aa2cd07 100644
--- a/src/components/frontend/blocks/AppSidebar.tsx
+++ b/src/components/frontend/blocks/AppSidebar.tsx
@@ -2,22 +2,11 @@
 
 import * as React from "react";
 import {
-  Award,
   ArrowLeftRight,
-  ArrowLeftRightIcon,
-  Backpack,
+  BookOpen,
   Bolt,
-  Crosshair,
-  Kanban,
-  LifeBuoy,
-  Search,
-  Send,
   Shield,
-  ShoppingBag,
-  TrendingUp,
-  UserCog,
   Users,
-  Warehouse,
   Maximize,
   Minimize,
   SparkleIcon,
@@ -39,10 +28,11 @@ import Image from "next/image";
 import Link from "next/link";
 import XPDisplay from "@/components/frontend/blocks/XPDisplay";
 import type { ResolvedLevel } from "@/utils/xp/resolveLevel";
-import { Rank, User } from "@/payload-types";
+import type { User } from "@/payload-types";
 import { Progress } from "@/components/ui/progress";
 import { Tooltip, TooltipContent, TooltipTrigger } from "@/components/ui/tooltip";
 import { updatePreferences } from "@/app/(frontend)/account/actions";
+import { sidebarData } from "@/components/frontend/blocks/sidebarData";
 
 const data = {
   navMain: [
@@ -61,110 +51,13 @@ const data = {
       url: "/transfers",
       icon: ArrowLeftRight,
     },
-  ],
-  navHelpdesk: [
     {
-      title: "Helpdesk",
-      url: "/helpdesk",
-      icon: LifeBuoy,
-    },
-    {
-      title: "Projects",
-      url: "/projects",
-      icon: Kanban,
-    },
-    {
-      title: "Search",
-      url: "/projects/search",
-      icon: Search,
-    },
-  ],
-  navIntelligence: [
-    {
-      title: "Intelligence",
-      url: "#",
-      icon: Crosshair,
-      items: [
-        {
-          title: "Campaigns",
-          url: "/intelligence/campaigns",
-        },
-        {
-          title: "Missions",
-          url: "/intelligence/missions",
-        },
-        {
-          title: "Factions",
-          url: "/intelligence/factions",
-        },
-      ],
-    },
-  ],
-  navLogistics: [
-    {
-      title: "Logistics",
-      url: "#",
-      icon: Warehouse,
-      items: [
-        {
-          title: "Structures",
-          url: "/logistics",
-        },
-        {
-          title: "Resources",
-          url: "/logistics/resources",
-        },
-        {
-          title: "Vehicles",
-          url: "/logistics/vehicles",
-        },
-        {
-          title: "Shipments",
-          url: "/logistics/shipments",
-        },
-        {
-          title: "Deployed Vehicles",
-          url: "/logistics/game-vehicles",
-        },
-      ],
-    },
-  ],
-  navCommerce: [
-    {
-      title: "Banking",
-      url: "/logistics/banking",
-      icon: TrendingUp,
-    },
-    {
-      title: "Market",
-      url: "/logistics/market",
-      icon: ShoppingBag,
-    },
-  ],
-  navPersonal: [
-    {
-      title: "Awards",
-      url: "/awards",
-      icon: Award,
-    },
-    {
-      title: "Locker",
-      url: "/locker",
-      icon: Backpack,
-    },
-    {
-      title: "Account",
-      url: "/account",
-      icon: UserCog,
-    },
-  ],
-  navSecondary: [
-    {
-      title: "Feedback",
-      url: "https://onyxsimple.youtrack.cloud",
-      icon: Send,
+      title: "Wiki",
+      url: "/wiki",
+      icon: BookOpen,
     },
   ],
+  ...sidebarData,
 };
 
 export function AppSidebar({
diff --git a/src/components/frontend/blocks/sidebarData.ts b/src/components/frontend/blocks/sidebarData.ts
new file mode 100644
index 0000000..bced781
--- /dev/null
+++ b/src/components/frontend/blocks/sidebarData.ts
@@ -0,0 +1,119 @@
+import {
+  Award,
+  Backpack,
+  Crosshair,
+  Kanban,
+  LifeBuoy,
+  Search,
+  Send,
+  ShoppingBag,
+  TrendingUp,
+  UserCog,
+  Warehouse,
+} from "lucide-react";
+
+export const sidebarData = {
+  navHelpdesk: [
+    {
+      title: "Helpdesk",
+      url: "/helpdesk",
+      icon: LifeBuoy,
+    },
+    {
+      title: "Projects",
+      url: "/projects",
+      icon: Kanban,
+    },
+    {
+      title: "Search",
+      url: "/projects/search",
+      icon: Search,
+    },
+  ],
+  navIntelligence: [
+    {
+      title: "Intelligence",
+      url: "#",
+      icon: Crosshair,
+      items: [
+        {
+          title: "Campaigns",
+          url: "/intelligence/campaigns",
+        },
+        {
+          title: "Missions",
+          url: "/intelligence/missions",
+        },
+        {
+          title: "Factions",
+          url: "/intelligence/factions",
+        },
+      ],
+    },
+  ],
+  navLogistics: [
+    {
+      title: "Logistics",
+      url: "#",
+      icon: Warehouse,
+      items: [
+        {
+          title: "Structures",
+          url: "/logistics",
+        },
+        {
+          title: "Resources",
+          url: "/logistics/resources",
+        },
+        {
+          title: "Vehicles",
+          url: "/logistics/vehicles",
+        },
+        {
+          title: "Shipments",
+          url: "/logistics/shipments",
+        },
+        {
+          title: "Deployed Vehicles",
+          url: "/logistics/game-vehicles",
+        },
+      ],
+    },
+  ],
+  navCommerce: [
+    {
+      title: "Banking",
+      url: "/logistics/banking",
+      icon: TrendingUp,
+    },
+    {
+      title: "Market",
+      url: "/logistics/market",
+      icon: ShoppingBag,
+    },
+  ],
+  navPersonal: [
+    {
+      title: "Awards",
+      url: "/awards",
+      icon: Award,
+    },
+    {
+      title: "Locker",
+      url: "/locker",
+      icon: Backpack,
+    },
+    {
+      title: "Account",
+      url: "/account",
+      icon: UserCog,
+    },
+  ],
+  navSecondary: [
+    {
+      title: "Feedback",
+      url: "https://onyxsimple.youtrack.cloud",
+      icon: Send,
+    },
+  ],
+};