LoVisual/frontend
loki5512344 5e76b6176a
feat(frontend): 'Remove avatar' button wired to DELETE /avatars
Part of the avatar-settings rebuild (research: every product except Figma
ships a remove button; Figma gets complaints for missing it). Backend DELETE
route shipped in the previous commit.

- api.ts: removeAvatar() calls DELETE /avatars. Cache invalidation lives in
  the caller so button-side side effects (progress state, history tick) can
  chain in the same handler.
- AvatarUpload: 'Удалить аватар' / 'Remove avatar' appears in the same row as
  'Change' and 'Recrop' when an avatar is set. Two-step inline confirm:
  first click arms and swaps the label to 'Точно удалить?' with an ember
  border, second click sends DELETE. The armed state auto-reverts after 4 s
  so a forgotten armed button never stays one click from destructive.
- i18n: avatar.remove / .removeConfirm / .removed / .removeFailed in ru+en.
  en.ts uses , so a missing key on
  either side would fail the type check.

Not yet: a real Modal with X / ESC / backdrop (comes with the AvatarEditDialog
chunk), preview-in-3-sizes, and cropper keyboard/wheel/pinch. Tests stay at
140/140, tsc and oxlint clean.
2026-10-12 22:44:51 +02:00
..
public feat: frontend perf and a11y pass, plus mod visuals, hero main menu, Simple Voice Chat and vanilla chat autocomplete 2026-10-01 21:29:54 +02:00
scripts chore(history): squash 67 commit(s) from 2026-09-25 2026-09-25 20:22:13 +02:00
src feat(frontend): 'Remove avatar' button wired to DELETE /avatars 2026-10-12 22:44:51 +02:00
.env.example chore(history): squash 67 commit(s) from 2026-09-25 2026-09-25 20:22:13 +02:00
.gitignore test(frontend): lock the style invariants a QA pass keeps re-finding 2026-09-28 13:27:15 +02:00
.oxlintrc.json chore(history): squash 59 commit(s) from 2026-09-23 2026-09-23 22:38:08 +02:00
ARCHITECTURE.md refactor(frontend): bring shared/ui and pages/public under the 4-file rule 2026-09-28 13:21:18 +02:00
bun.lock feat: frontend perf and a11y pass, plus mod visuals, hero main menu, Simple Voice Chat and vanilla chat autocomplete 2026-10-01 21:29:54 +02:00
index.html feat(frontend): SEO — sitemap, canonical link, structured data 2026-09-30 15:48:44 +02:00
package.json feat: frontend perf and a11y pass, plus mod visuals, hero main menu, Simple Voice Chat and vanilla chat autocomplete 2026-10-01 21:29:54 +02:00
PLAN.md feat(frontend): avatar upload QOL — feedback, re-crop, drop, progress, history 2026-09-28 22:56:01 +02:00
README.md docs: add a real root README and rewrite the frontend one 2026-09-28 17:28:41 +02:00
tsconfig.app.json feat(frontend): avatar upload QOL — feedback, re-crop, drop, progress, history 2026-09-28 22:56:01 +02:00
tsconfig.json test(frontend): lock the style invariants a QA pass keeps re-finding 2026-09-28 13:27:15 +02:00
tsconfig.node.json chore(history): squash 67 commit(s) from 2026-09-25 2026-09-25 20:22:13 +02:00
tsconfig.test.json feat(frontend): avatar upload QOL — feedback, re-crop, drop, progress, history 2026-09-28 22:56:01 +02:00
vite.config.ts perf(frontend): route-level code splitting, main chunk 538 -> 491 KB 2026-09-30 16:06:45 +02:00

LoVisual Website

The frontend for LoVisual - a marketing site with a live in-game GUI demo, download page, documentation, themes/showcase pages, and an account dashboard with a cloud config manager. UI is fully bilingual (Russian default, English toggle, persisted in the URL).

Stack

  • React 19 + TypeScript + Vite, package manager: bun
  • Tailwind CSS v4 with custom design tokens (radii, glass panels, control sizing)
  • TanStack Query for backend calls, react-router for pages
  • react-i18next - ru/en resources per feature, compile-time key parity via satisfies
  • motion/react for animation, vitest + Testing Library for tests
  • oxlint for linting

Layout

src/
├── app/         router, providers, App shell
├── features/    one folder per domain (account, cloud, demo, themes, ...)
│   └── <f>/     api.ts · i18n/{ru,en}.ts · components/ · tests/
├── pages/       route-level pages composing features
├── shared/      ui primitives, i18n bootstrap, easter eggs, helpers
└── test/        vitest setup and utilities

Feature-folder rules: API calls, translations and components live together; no cross-feature imports except through shared/.

Scripts

bun install        # install dependencies
bun run dev        # dev server on http://localhost:5173 (proxies /api to the backend)
bun run test       # vitest run
bun run build      # tsc -b + vite build → dist/
bun run lint       # oxlint
bun run gen:themes # regenerate theme tokens from the mod palette (scripts/extract-themes.ts)

The dev server expects the Rust gateway on 127.0.0.1:8080 (see backend/); without it, API-backed pages degrade to demo/offline states by design.

Testing

Unit and component tests are colocated in features/*/tests/ and shared/**/tests/; run a single file with bunx vitest run src/features/account/tests/account.test.tsx. Translation parity (ru ↔ en key sets) is enforced at compile time and in tests.