marcandClaude Opus 5
92d525b3ab
The app is meant to run in daily private use now, so this pass was mostly
about the ways it could quietly lose data.
Reliability and security:
- the server no longer invents a JWT_SECRET or ENCRYPTION_KEY when one is
missing; it refuses to start. The old fallback silently made every stored
note unreadable after a restart.
- notes are encrypted with AES-256-GCM (v2:); existing CBC bodies still read.
- login is rate limited and compares against a dummy hash when the user does
not exist, so timing does not reveal who is registered.
- a server response issued before a local save is never adopted. This had
already eaten drawing strokes and note links; sync.hasPendingWrites() now
guards every path that takes a body from the server.
Editor and features:
- TipTap replaces the contenteditable editor: tables, task lists, and links
to other notes and notebooks, with a backlinks bar on the target.
- content format v2 ({v:2,doc}); v1 {html,tasks} bodies migrate on open.
- version history: the state before each write is snapshotted, coalesced
into 5-minute windows, 50 versions or 90 days per note.
- full-text search runs in the client, because the server cannot read
encrypted bodies and a server index would defeat the encryption.
- image attachments are stored by SHA-256 and deduplicated; the client
fetches them authenticated and caches the blob, so they work offline.
- drawings are vector strokes in a fixed 1200x1600 page space and now look
the same on every screen (0.0-0.2% deviation across four widths).
- login is by username; existing email accounts migrate automatically.
Operations:
- data lives on host bind mounts, not Docker volumes, so Proxmox Backup
covers it. Back up .env with it — without ENCRYPTION_KEY the dump is
unreadable.
Structure:
- NoteApp.jsx is gone. App.jsx now holds only where the user is; note data,
search, layout, history and drag each live behind a hook, and the four
panes are stateless.
- the whole data layer is TypeScript, with 81 unit tests concentrated on
the places that have actually broken.
- fixed along the way: the browser back button had a dead press, because
restoring a history entry pushed a duplicate one.
Co-Authored-By: Claude Opus 5 <noreply@anthropic.com>
81 lines
1.8 KiB
TypeScript
81 lines
1.8 KiB
TypeScript
/**
|
|
* The application palette.
|
|
*
|
|
* Colours live here rather than inline so that a change to, say, the danger red
|
|
* happens in one place. Modal components still carry small local palettes of
|
|
* their own — their key names mean different things (a modal's `bg` is a raised
|
|
* surface, the app's `bg` is the page behind it), so they are deliberately not
|
|
* folded in here.
|
|
*/
|
|
|
|
export interface Theme {
|
|
bg: string;
|
|
sidebar: string;
|
|
sidebarActive: string;
|
|
card: string;
|
|
toolbar: string;
|
|
border: string;
|
|
borderLight: string;
|
|
text: string;
|
|
textSec: string;
|
|
muted: string;
|
|
faint: string;
|
|
accent: string;
|
|
accentSoft: string;
|
|
accentText: string;
|
|
danger: string;
|
|
success: string;
|
|
warning: string;
|
|
inputBg: string;
|
|
dashBg: string;
|
|
}
|
|
|
|
const DARK: Theme = {
|
|
bg: "#0d1117",
|
|
sidebar: "#010409",
|
|
sidebarActive: "#161b22",
|
|
card: "#161b22",
|
|
toolbar: "#161b22",
|
|
border: "#30363d",
|
|
borderLight: "#21262d",
|
|
text: "#e6edf3",
|
|
textSec: "#c9d1d9",
|
|
muted: "#8b949e",
|
|
faint: "#484f58",
|
|
accent: "#388bfd",
|
|
accentSoft: "#388bfd22",
|
|
accentText: "#58a6ff",
|
|
danger: "#f85149",
|
|
success: "#3fb950",
|
|
warning: "#d29922",
|
|
inputBg: "#0d1117",
|
|
dashBg: "#0d1117",
|
|
};
|
|
|
|
const LIGHT: Theme = {
|
|
bg: "#f6f8fa",
|
|
sidebar: "#ffffff",
|
|
sidebarActive: "#eef2ff",
|
|
card: "#ffffff",
|
|
toolbar: "#ffffff",
|
|
border: "#d0d7de",
|
|
borderLight: "#e5e7eb",
|
|
text: "#1f2328",
|
|
textSec: "#424a53",
|
|
muted: "#656d76",
|
|
faint: "#afb8c1",
|
|
accent: "#0969da",
|
|
accentSoft: "#0969da18",
|
|
accentText: "#0550ae",
|
|
danger: "#cf222e",
|
|
success: "#1a7f37",
|
|
warning: "#9a6700",
|
|
inputBg: "#f6f8fa",
|
|
dashBg: "#f0f2f5",
|
|
};
|
|
|
|
export const makeTheme = (dark: boolean): Theme => (dark ? DARK : LIGHT);
|
|
|
|
export const FONT_UI = "'DM Sans',sans-serif";
|
|
export const FONT_SERIF = "'Newsreader',Georgia,serif";
|