Files
soulseek-rs-modded/website/README.md
T
Michel de Graaf 33bfc34dc8 feat(website): add the project site and deploy it to GitHub Pages
A Vite + React + TypeScript + Tailwind v4 site under website/, built from
the soulseek-rs design system so the site and the TUI stay one product.
The colour tokens in src/index.css are the same values as
soulseek-rs/src/ui/styles.rs; change one, change both.

The hero is a working recreation of the TUI: it plays one scripted run and
then takes the keyboard, or lands on the resting state directly under
prefers-reduced-motion. Its sample data is invented or public domain, per
the tone-of-voice guardrail against naming copyrighted material.

Static output rather than an SPA shell. `bun run build` compiles the client,
compiles the same app for Node, then renders every route in src/lib/routes.ts
to its own file with that route's title, description and canonical URL. A
direct link to /install therefore answers 200 with real markup instead of
GitHub's 404 page. routes.ts is keyed into App.tsx by literal path, so adding
one without the other fails typecheck rather than shipping a page whose body
says "not found" under the right title.

Theme is resolved once by an inline script before first paint and adopted by
React through useSyncExternalStore, so there is no flash and no hydration
mismatch on the toggle. Light mode re-cuts the semantic hues darker: phosphor
and tape read on vinyl but wash out on manila.

CI and release skip website-only pushes, and Pages skips Rust-only ones. The
two Rust workflows share one paths-ignore list so they can only skip
together, which keeps the release ci-gate from polling for a run that was
never queued. That gate also now treats a cancelled CI as "keep waiting"
rather than a failure, since cancel-in-progress cancels the older SHA on
every back-to-back push.
2026-07-24 23:42:41 +02:00

2.1 KiB

website

The soulseek-rs project site. Vite + React + TypeScript + Tailwind v4, deployed to GitHub Pages by .github/workflows/pages.yml.

bun install
bun run dev        # http://localhost:5173/soulseek-rs/
bun run build      # client build, SSR build, then prerender
bun run typecheck
bun run lint

How the static site is produced

bun run build runs three steps:

  1. vite build — the client bundle, plus dist/index.html as the template.
  2. vite build --ssr src/entry-server.tsx — the same app compiled for Node.
  3. bun scripts/prerender.ts — renders every route in src/lib/routes.ts to its own file (dist/install/index.html, and so on) with that route's title and description substituted in, plus a 404.html.

Without step 3 GitHub Pages has no file at /install and answers a direct link with a 404. With it, every URL returns 200 with fully rendered markup, and the client hydrates that markup rather than replacing it.

Adding a page means: a component in src/pages/, a <Route> in src/App.tsx, and an entry in src/lib/routes.ts. The last one is what the prerenderer walks.

Design system

Tokens live in src/index.css, ported from the Claude Design project's tokens/colors.css. They are the same values that back the TUI in soulseek-rs/src/ui/styles.rs — change one, change both.

Dark is the native theme; light re-cuts the semantic hues roughly 10% darker, because phosphor and tape are legible on vinyl but wash out on manila. Theme selection is [data-theme] on <html>, defaulting to the OS setting, with an inline script in index.html applying it before first paint so the page never flashes the wrong background.

Notes

  • base in vite.config.ts is /soulseek-rs/ because this is a project site. Pointing a custom domain at it means setting that to / (the router reads import.meta.env.BASE_URL, so it follows automatically).
  • Copy in src/pages/ follows the project's tone of voice: plainspoken, precise, honest about limits first. No copyrighted artist or album names anywhere, including the TUI demo data in src/components/tui/data.ts.