diff --git a/src/App.tsx b/src/App.tsx index d4ebc32..9d387ca 100644 --- a/src/App.tsx +++ b/src/App.tsx @@ -7,48 +7,129 @@ import { Volume2, Settings, ChevronDown, + ChevronLeft, + Sparkles, + Timer, + Calendar, } from "lucide-react"; import { useState } from "react"; import { Dashboard } from "./components/Dashboard"; import { SettingsPanel } from "./components/SettingsPanel"; +import { NpcGenerator } from "./components/NpcGenerator"; +import { DiceRoller } from "./components/DiceRoller"; +import { SessionLogger } from "./components/SessionLogger"; +import { EncounterBuilder } from "./components/EncounterBuilder"; +import { InitiativeTracker } from "./components/InitiativeTracker"; +import { RandomTables } from "./components/RandomTables"; +import { CalendarWidget } from "./components/CalendarWidget"; -type View = "dashboard" | "settings"; +export type View = + | "dashboard" + | "world" + | "npcs" + | "encounter" + | "dice" + | "session" + | "sound" + | "initiative" + | "tables" + | "calendar" + | "quest" + | "settings"; -const navItems = [ - { icon: Map, label: "World" }, - { icon: User, label: "NPCs" }, - { icon: Swords, label: "Encounter" }, - { icon: Dice5, label: "Dice" }, - { icon: ScrollText, label: "Session" }, - { icon: Volume2, label: "Sound" }, +const navItems: { icon: typeof Map; label: string; view: View }[] = [ + { icon: Map, label: "World", view: "world" }, + { icon: User, label: "NPCs", view: "npcs" }, + { icon: Swords, label: "Encounter", view: "encounter" }, + { icon: Dice5, label: "Dice", view: "dice" }, + { icon: ScrollText, label: "Session", view: "session" }, + { icon: Volume2, label: "Sound", view: "sound" }, ]; +function renderView(view: View): React.ReactNode { + switch (view) { + case "npcs": + return ; + case "dice": + return ; + case "session": + return ; + case "encounter": + return ; + case "initiative": + return ; + case "tables": + return ; + case "calendar": + return ; + case "settings": + return ; + case "world": + return ( +
+
+ +

World Map

+

Interactive map canvas coming soon

+

react-konva integration pending

+
+
+ ); + case "quest": + return ( +
+
+ +

Quest Designer

+

Branching flowchart coming soon

+

react-flow integration pending

+
+
+ ); + case "sound": + return ( +
+
+ +

Soundboard

+

Local audio clips for ambience

+

Coming soon

+
+
+ ); + default: + return null; + } +} + export default function App() { const [view, setView] = useState("dashboard"); - const [activeNav, setActiveNav] = useState(0); + + const isDetailView = view !== "dashboard" && view !== "settings"; return (
{/* Left Rail */}
diff --git a/src/components/Dashboard.tsx b/src/components/Dashboard.tsx index 3afeccd..c8f9dba 100644 --- a/src/components/Dashboard.tsx +++ b/src/components/Dashboard.tsx @@ -8,78 +8,167 @@ import { Timer, Volume2, Calendar, + Maximize2, } from "lucide-react"; import { BentoCard } from "./BentoCard"; +import type { View } from "../App"; + +interface DashboardProps { + onNavigate: (view: View) => void; +} + +export function Dashboard({ onNavigate }: DashboardProps) { + return ( +
+ {/* World Map — 2×2 */} + } span="col-span-2 row-span-2"> +
+ +

Map canvas coming soon

+ +
+ + + {/* NPC Sheet — 1×1 */} + } span="col-span-1 row-span-1"> +
+
+ +
+ +
+ + + {/* Dice Roller — 1×1 */} + } span="col-span-1 row-span-1"> +
+
+ +
+ +
+ + + {/* Encounter Builder — 1×1 */} + } span="col-span-1 row-span-1"> +
+
+ +
+ +
+ + + {/* Session Log — 2×1 */} + } span="col-span-2 row-span-1"> +
+
+ +
+ +
+ + + {/* Quest Designer — 2×1 */} + } span="col-span-2 row-span-1"> +
+ +

Quest flowchart coming soon

+ +
+ + + {/* Initiative Tracker — 1×1 */} + } span="col-span-1 row-span-1"> +
+
+ +
+ +
+ + + {/* Random Tables — 1×1 */} + } span="col-span-1 row-span-1"> +
+
+ +
+ +
+ + + {/* Calendar — 1×1 */} + } span="col-span-1 row-span-1"> +
+
+ +
+ +
+ + + {/* Soundboard — 1×1 */} + } span="col-span-1 row-span-1"> +
+ +

Soundboard coming soon

+
+ +
+ ); +} + +// Inline imports for dashboard cards (compact versions) import { NpcGenerator } from "./NpcGenerator"; import { DiceRoller } from "./DiceRoller"; import { SessionLogger } from "./SessionLogger"; import { EncounterBuilder } from "./EncounterBuilder"; import { InitiativeTracker } from "./InitiativeTracker"; import { RandomTables } from "./RandomTables"; -import { CalendarWidget } from "./CalendarWidget"; - -export function Dashboard() { - return ( -
- {/* World Map — 2×2 */} - } span="col-span-2 row-span-2"> -
-
- -

Map canvas coming soon

-

react-konva integration pending

-
-
- - - {/* NPC Sheet — 1×1 */} - } span="col-span-1 row-span-1"> - - - - {/* Dice Roller — 1×1 */} - } span="col-span-1 row-span-1"> - - - - {/* Encounter Builder — 1×1 */} - } span="col-span-1 row-span-1"> - - - - {/* Session Log — 2×1 */} - } span="col-span-2 row-span-1"> - - - - {/* Quest Designer — 2×1 */} - } span="col-span-2 row-span-1"> -
- Quest flowchart coming soon — react-flow integration pending -
- - - {/* Initiative Tracker — 1×1 */} - } span="col-span-1 row-span-1"> - - - - {/* Random Tables — 1×1 */} - } span="col-span-1 row-span-1"> - - - - {/* Calendar — 1×1 */} - } span="col-span-1 row-span-1"> - - - - {/* Soundboard — 1×1 */} - } span="col-span-1 row-span-1"> -
- Soundboard coming soon -
- -
- ); -} \ No newline at end of file +import { CalendarWidget } from "./CalendarWidget"; \ No newline at end of file