TDvorak/Dash
1
0 Fork 0
mirror of https://github.com/Dvorinka/Dash.git synced 2026-10-29 00:01:24 +00:00
Code Issues Actions Packages Projects Releases Wiki Activity

feat: phase 1 MVP — sections, services, drag-drop, renderers

Browse Source 
Backend: migration 0002 (sections/items/urls/settings), CRUD +
fractional reorder, icon upload, settings, export/import, cached
status pings. Handler tests cover reorder, URL scheme validation,
settings round-trip.

Frontend: shared board store over the generated client, dnd-kit
layer (same-section, cross-section, section reorder persisted),
URL chooser popover, add/edit service dialog, settings dialog,
Bento + Cards renderers behind the shared seam, dark/light theme.

Generated with [Devin](https://devin.ai)

Authored By: TDvorak <[email protected]>
Co-Authored-By: Devin <158243242+devin-ai-integration[bot]@users.noreply.github.com>
This commit is contained in:
Tomas Dvorak committed 2026-09-17 20:29:22 +02:00
1 parent b60821350a
commit 6004105038
37 files changed
+4187 -66
Download Patch File Download Diff File Expand all files Collapse all files

No files matched your search

apps/frontend/src/App.tsx
+42 -34
View File
@@ -1,20 +1,25 @@
import { useEffect, useState } from "react";
import { Moon, Plus, Sun } from "lucide-react";
type Theme = "dark" | "light";
function initialTheme(): Theme {
const saved = localStorage.getItem("dash.theme");
return saved === "light" ? "light" : "dark";
}
import { useState } from "react";
import { Moon, Plus, Settings, Sun } from "lucide-react";
import { BoardProvider, useBoard } from "@/board/store";
import { Board } from "@/board/Board";
import { ServiceDialog } from "@/components/ServiceDialog";
import { SettingsDialog } from "@/components/SettingsDialog";
import { Button } from "@/components/ui/button";
import type { Item } from "@/types";
export default function App() {
const [theme, setTheme] = useState<Theme>(initialTheme);
return (
<BoardProvider>
<Shell />
</BoardProvider>
);
}
useEffect(() => {
document.documentElement.dataset.theme = theme;
localStorage.setItem("dash.theme", theme);
}, [theme]);
function Shell() {
const board = useBoard();
const [settingsOpen, setSettingsOpen] = useState(false);
const [svcOpen, setSvcOpen] = useState(false);
const [editing, setEditing] = useState<Item | undefined>();
return (
<div className="font-sans">
@@ -28,27 +33,30 @@ export default function App() {
</svg>
Dash
</div>
<button
type="button"
onClick={() => setTheme(theme === "dark" ? "light" : "dark")}
aria-label="Toggle theme"
className="ml-auto flex size-[34px] items-center justify-center rounded-lg border border-border bg-surface text-text-dim transition-colors hover:border-border-strong hover:text-text active:scale-95"
>
{theme === "dark" ? <Moon size={15} strokeWidth={1.8} /> : <Sun size={15} strokeWidth={1.8} />}
</button>
<button
type="button"
className="flex h-[34px] items-center gap-1.5 rounded-lg bg-text px-3.5 text-[13px] font-medium text-bg transition-transform active:scale-95"
>
<Plus size={13} strokeWidth={2.2} />
Add service
</button>
<div className="ml-auto flex items-center gap-2">
<Button
variant="outline" size="icon" aria-label="Settings"
onClick={() => setSettingsOpen(true)}
>
<Settings size={15} strokeWidth={1.8} />
</Button>
<Button
variant="outline" size="icon" aria-label="Toggle theme"
onClick={() => void board.setSetting("theme", board.theme === "dark" ? "light" : "dark")}
>
{board.theme === "dark" ? <Moon size={15} strokeWidth={1.8} /> : <Sun size={15} strokeWidth={1.8} />}
</Button>
<Button onClick={() => { setEditing(undefined); setSvcOpen(true); }}>
<Plus size={13} strokeWidth={2.2} />
Add service
</Button>
</div>
</header>
<main className="mx-auto max-w-[1140px] px-7 pb-24 pt-9">
<p className="text-center text-[13px] text-text-faint">
No sections yet. Add a service to get started.
</p>
</main>
<Board onEditItem={(it) => { setEditing(it); setSvcOpen(true); }} />
<ServiceDialog open={svcOpen} onOpenChange={setSvcOpen} item={editing} />
<SettingsDialog open={settingsOpen} onOpenChange={setSettingsOpen} />
</div>
);
}