Maxim Dolgolyov
bd3020067b
Add user-detail.js (~370L) and session-detail.js (~180L) section modules that render full pages for #users/:id and #sessions/:id, plus admin.js dispatch and HTML tab-panes. The legacy .user-panel overlay is intentionally still in place — sub-commit 2 will remove it once the deep pages are verified. * admin.js: DEEP_ROUTES map + activateDeepPane(); activate(route, params) signature; initial dispatch respects hash params (so F5 on #users/123 goes straight to the deep page). * admin.html: new tab-panes #tab-user-detail / #tab-session-detail and two script tags. Old #user-panel overlay untouched. * user-detail.js: header (avatar/role/email/meta) + sub-tabs (Обзор/Сессии/Классы/Audit) with URL-synced sub-tab routing (#users/N/sessions etc). Overview: 4 stat cards + per-subject SVG bar chart. Sessions: clickable rows that navigate to #sessions/N. Classes: placeholder empty-state (no per-user classes endpoint). Audit: client-side filter of /admin/audit-log by uid match. Header action buttons (Изменить/Права/История/Бан/Удалить) call existing overlay handlers; window.activeUid is set before opening any modal. * session-detail.js: full header (user/subject/score/stats) + per- question correctness layout reusing the drawer renderer. Delete button uses LS.adminDeleteSession then navigates to #sessions. Clicking the user name opens the user deep page. * users.js: quickOpenUserSessions now navigates to #users/<uid>/sessions instead of the bare #sessions list. Verified node --check on all new/modified JS. baseline npm test still shows pre-existing 3 auth failures unrelated to this change. Co-Authored-By: Claude Opus 4.7 (1M context) <noreply@anthropic.com>
4.7 KiB
4.7 KiB
Feature: Admin Panel Redesign
Branch: feature/admin-redesign
Base branch: master
Created: 2026-05-16
Status: 🟡 In Progress
Strategy: Incremental
Mode: Automated
Execution: Orchestrator
Summary
Превратить admin-панель LearnSpace из монолитного tab-роутера (1900L HTML + 3500L JS в одном модуле) в master-detail SPA с hash-routing, lazy-loaded per-section модулями, dashboard-landing, Cmd+K command palette, per-row quick actions и deep entity pages вместо overlay-панели.
Текущее состояние:
frontend/admin.html~1900Lfrontend/js/admin/admin.js~3500L (после недавнего extract из inline<script>)- 13 табов: stats, questions, tests, assignments, subjects, users, sessions, permissions, shop, gam, tpl, sims, games, sublog
switchTab()ручной tab-роутер, состояние теряется при F5- User detail = выезжающая
.user-paneloverlay внутри tab-users
Цели:
- F5/bookmark на
#users/123работают - admin.js ≤ 800L
- Dashboard + Ctrl+K + hover-actions для частых сценариев
- Полноценная страница user/session вместо overlay
Build & Test Commands
- Start:
cd backend && npm start(vanilla JS, нет бандлера — server раздаёт static) - Dev:
cd backend && npm run dev(nodemon) - Test:
cd backend && npm test(node --test) - Lint:
cd backend && npm run lint:routes(route auth checker) - Manual verify: открыть
http://localhost:3000/adminи пройти основные сценарии
Phases
- Phase 1: Hash-router [domain: frontend] → subplan
- Phase 2: Split admin.html → per-section modules [domain: frontend] → subplan
- Phase 3: Dashboard #overview [domain: fullstack] → subplan (parallelizable with 4, 5)
- Phase 4: Cmd+K command palette [domain: fullstack] → subplan (parallelizable with 3, 5)
- Phase 5: Per-row quick actions [domain: frontend] → subplan (parallelizable with 3, 4)
- Phase 6: Deep entity pages [domain: frontend] → subplan
Параллелизация: фазы 3, 4, 5 независимы (touch different files, no shared state) — выполняются параллельно после завершения фазы 2.
Phase Progress Log
| Phase | Domain | Status | Review | Build | Committed |
|---|---|---|---|---|---|
| Phase 1: Hash-router | frontend | ✅ Done | ✅ PASS w/ notes | ✅ | ✅ 8a7bed4 |
| Phase 2: Split sections | frontend | ✅ Done | ✅ PASS (1 blocker fixed: fa67ad1) |
✅ node --check | ✅ 92030b4 + fa67ad1 |
| Phase 3: Dashboard | fullstack | ✅ Done | ✅ PASS w/ 3 SQL warnings (post-merge polish) | ✅ | ✅ 41acbdd |
| Phase 4: Palette | fullstack | ✅ Done | ✅ PASS w/ notes (limit param cleanup applied) | ✅ | ✅ f562fe4 |
| Phase 5: Quick actions | frontend | ✅ Done | ✅ PASS w/ notes | ✅ | ✅ 69113ab |
| Phase 6: Deep pages | frontend | 🟡 In Progress | ⬜ | ✅ node --check | ⬜ |
Final Review
- Comprehensive code review (final-reviewer agent)
- Security review (auth-touching changes in new endpoints)
- Full build passes (server starts, no errors)
- Manual smoke test
- Merged to
master
Acceptance Criteria (whole feature)
- F5 на любом
#sub-routeвосстанавливает state - admin.js ≤ 800L
- Ctrl+K находит пользователя по имени за <100ms
- Dashboard
#overviewпоказывает данные за 24ч - Per-row hover-actions на users/sessions
#users/123= полноценная страница, не overlay- Все existing onclick handlers продолжают работать (backward compat в фазах 1-5)
- Нет регрессий в тестах
Tech Stack & Conventions Reference
- Stack: vanilla JS, Express 4, SQLite (better-sqlite3 sync), JWT, WebSocket+SSE, KaTeX, Lucide
- Frontend: pages =
frontend/*.html, JS =/js/*илиfrontend/js/*, все API черезwindow.LS.* - UI primitives:
LS.modal,LS.confirm,LS.toast,LS.state,LS.skeleton,LS.esc - localStorage prefix:
ls_* - Icons: inline SVG
.icили Lucide CDN — эмоджи запрещены - Search в коде: только ast-index (пользователь категорически запретил Grep)
- Backend: layer-based —
controllers/,routes/,services/,db/migrations/NNN_*.sql