Schwitzz
79 lines
3.3 KiB
TypeScript
79 lines
3.3 KiB
TypeScript
import { useState, useEffect } from "react";
|
|
import { Routes, Route } from "react-router-dom";
|
|
import { Sidebar, Topbar, CommandPalette, SplashScreen } from "./components/index.js";
|
|
import { AuthGate } from "./components/AuthGate.js";
|
|
import { ExportDialog } from "./features/export/ExportDialog.js";
|
|
import { AISidebar } from "./features/ai/AISidebar.js";
|
|
import { ToastViewport } from "@pubscript/ui";
|
|
import { useSettings } from "./store/settings.js";
|
|
import Write from "./routes/Write.js";
|
|
import { Characters } from "./routes/Characters.js";
|
|
import { Plot } from "./routes/Plot.js";
|
|
import { Timeline } from "./routes/Timeline.js";
|
|
import { Whiteboard } from "./routes/Whiteboard.js";
|
|
import { AI } from "./routes/AI.js";
|
|
import { Projects } from "./routes/Projects.js";
|
|
import { Settings } from "./routes/Settings.js";
|
|
import { Admin } from "./routes/Admin.js";
|
|
|
|
const NAV = [
|
|
{ to: "/", label: "Write", icon: "✎", end: true },
|
|
{ to: "/characters", label: "Entities", icon: "👥", end: false },
|
|
{ to: "/plot", label: "Plot", icon: "🗺", end: false },
|
|
{ to: "/timeline", label: "Timeline", icon: "📅", end: false },
|
|
{ to: "/whiteboard", label: "Whiteboard", icon: "🧩", end: false },
|
|
{ to: "/projects", label: "Projects", icon: "📁", end: false },
|
|
{ to: "/settings", label: "Settings", icon: "⚙", end: false },
|
|
{ to: "/admin", label: "Admin", icon: "🛠", end: false },
|
|
];
|
|
|
|
export default function App() {
|
|
const [paletteOpen, setPaletteOpen] = useState(false);
|
|
const [exportOpen, setExportOpen] = useState(false);
|
|
const navCollapsed = useSettings((s) => s.navCollapsed);
|
|
const aiSidebarOpen = useSettings((s) => s.aiSidebarOpen);
|
|
const focusMode = useSettings((s) => s.focusMode);
|
|
|
|
useEffect(() => {
|
|
const onKey = (e: KeyboardEvent) => {
|
|
if ((e.metaKey || e.ctrlKey) && e.key.toLowerCase() === "k") {
|
|
e.preventDefault();
|
|
setPaletteOpen((o) => !o);
|
|
}
|
|
};
|
|
document.addEventListener("keydown", onKey);
|
|
return () => document.removeEventListener("keydown", onKey);
|
|
}, []);
|
|
|
|
return (
|
|
<AuthGate>
|
|
<div className={`ps-app${navCollapsed ? " is-nav-collapsed" : ""}${aiSidebarOpen ? " is-ai-open" : ""}${focusMode ? " is-focus-mode" : ""}`}>
|
|
<SplashScreen />
|
|
<Sidebar nav={NAV} />
|
|
<Topbar onOpenPalette={() => setPaletteOpen(true)} onOpenExport={() => setExportOpen(true)} />
|
|
<div className="ps-workspace-row">
|
|
<main className="ps-main">
|
|
<Routes>
|
|
<Route path="/" element={<Write />} />
|
|
<Route path="/characters" element={<Characters />} />
|
|
<Route path="/plot" element={<Plot />} />
|
|
<Route path="/timeline" element={<Timeline />} />
|
|
<Route path="/whiteboard" element={<Whiteboard />} />
|
|
<Route path="/ai" element={<AI />} />
|
|
<Route path="/projects" element={<Projects />} />
|
|
<Route path="/settings" element={<Settings />} />
|
|
<Route path="/admin" element={<Admin />} />
|
|
<Route path="*" element={<Write />} />
|
|
</Routes>
|
|
</main>
|
|
{aiSidebarOpen && <AISidebar />}
|
|
</div>
|
|
|
|
<CommandPalette open={paletteOpen} onClose={() => setPaletteOpen(false)} nav={NAV} />
|
|
<ExportDialog open={exportOpen} onClose={() => setExportOpen(false)} />
|
|
<ToastViewport />
|
|
</div>
|
|
</AuthGate>
|
|
);
|
|
}
|