Maxim Dolgolyov
85 lines
4.6 KiB
Markdown
85 lines
4.6 KiB
Markdown
# 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` ~1900L
|
||
- `frontend/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-panel` overlay внутри 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
|
||
|
||
- [x] Phase 1: Hash-router [domain: frontend] → [subplan](./phase-1-hash-router.md)
|
||
- [x] Phase 2: Split admin.html → per-section modules [domain: frontend] → [subplan](./phase-2-split-sections.md)
|
||
- [ ] Phase 3: Dashboard #overview [domain: fullstack] → [subplan](./phase-3-dashboard.md) (parallelizable with 4, 5)
|
||
- [ ] Phase 4: Cmd+K command palette [domain: fullstack] → [subplan](./phase-4-palette.md) (parallelizable with 3, 5)
|
||
- [ ] Phase 5: Per-row quick actions [domain: frontend] → [subplan](./phase-5-quick-actions.md) (parallelizable with 3, 4)
|
||
- [ ] Phase 6: Deep entity pages [domain: frontend] → [subplan](./phase-6-deep-pages.md)
|
||
|
||
**Параллелизация:** фазы 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 | ⬜ pending | ✅ node --check | ✅ 92030b4 |
|
||
| Phase 3: Dashboard | fullstack | ⬜ Not Started | ⬜ | ⬜ | ⬜ |
|
||
| Phase 4: Palette | fullstack | ⬜ Not Started | ⬜ | ⬜ | ⬜ |
|
||
| Phase 5: Quick actions | frontend | ⬜ Not Started | ⬜ | ⬜ | ⬜ |
|
||
| Phase 6: Deep pages | frontend | ⬜ Not Started | ⬜ | ⬜ | ⬜ |
|
||
|
||
## 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`
|