27465089b5
- concepts/board-viewer.md (design, promoted from .workshop) - .tasks/STATUS.md + 5 per-task files: - board-viewer-pointers (pre-impl, status=ready) - board-viewer-gitea-reader (impl, TDD, status=ready) - board-viewer-html-render (impl, TDD, blocker=gitea-reader) - board-viewer-cron-deploy (impl, infra carve-out, blocker=html-render) - board-viewer-review (umbrella, status=blocked) TDD-mode embedded in impl-tasks per follow tdd-criteria trigger in CLAUDE.md. MCP write-side workaround per memory reference_projects_meta_resolveTarget_bug.md. Co-Authored-By: Claude Opus 4.7 (1M context) <noreply@anthropic.com>
49 lines
3.6 KiB
Markdown
49 lines
3.6 KiB
Markdown
# board-viewer-html-render
|
||
|
||
## Goal
|
||
|
||
Рендер 5-колоночного kanban-board из нормализованной структуры (продукт `board-viewer-gitea-reader`). Статический HTML + минимальный клиент-сайд JS для фильтра / drawer / refresh-таймера. Без write-side, без realtime.
|
||
|
||
**TDD-mode:** обязательно по `follow tdd-criteria`. Снапшот-тесты на HTML-output из фиксированных reader-фикстур. Не модифицировать assert'ы без `[test-modify: ...]` маркера. Визуальная отделка (CSS) — под carve-out «visual CSS», но логика рендера (распределение по колонкам, age-расчёт, drawer-привязка) — TDD.
|
||
|
||
## Key files
|
||
|
||
- (TBD) `src/render.{ts,py}` — main renderer
|
||
- (TBD) `templates/board.html` — template (Mustache / Jinja / template literals — выбор имплементера)
|
||
- (TBD) `static/board.css`, `static/board.js` — styling + filter/drawer client-side
|
||
- (TBD) `tests/render.test.{ts,py}` — snapshot tests
|
||
|
||
## Acceptance criteria
|
||
|
||
- **5 колонок** по статусам: ⚪ open / 🟡 in-progress / 🟣 paused / 🔴 blocked / 🟢 done. Названия колонок — emoji + слово.
|
||
- **Карточка:**
|
||
- title (truncate на 80 chars в default-view),
|
||
- project badge (e.g. `books`, `board-viewer`),
|
||
- owner (если есть) — pill,
|
||
- age — относительное (`3d`, `2w`, `5mo`) от `last_commit_iso`,
|
||
- last-commit-marker — короткий hash или дата.
|
||
- **Группировка по проекту** — toggle вверху: «по статусам» (5 колонок × проекты внутри) vs «по проектам» (per-project колонки × статусы внутри).
|
||
- **Поиск/фильтр** — клиент-сайд input: substring по `slug`, `title`, `project`; multi-select по статусам.
|
||
- **Per-card drawer** — клик по карточке → side panel с full markdown из per-task `<slug>.md` (lazy-fetch из `raw_url`). Markdown рендерится клиент-сайд (e.g. `marked` для TS, `markdown-it` для Py-side-rendered).
|
||
- **Refresh-таймер** видно в header: «refreshed Xm ago, next in Ym» (data attribute из generation timestamp).
|
||
- **Output:** один `index.html` файл + sidecar `static/`. Открывается локально без сервера для smoke-test.
|
||
- **Tests:** snapshot-тесты на 3 reader-фикстуры (пустая доска / 1-2 таски / N≥10 тасок). Snapshots checked-in.
|
||
|
||
## Decisions log
|
||
|
||
- 2026-05-22: task создан промоушеном; зависит от `board-viewer-gitea-reader` контракта.
|
||
|
||
## Open questions
|
||
|
||
- [ ] Markdown-renderer: client-side (`marked`) или server-side (Jinja с pre-rendered HTML вшито в data-attr)? Client-side проще — но добавляет ~50KB JS.
|
||
- [ ] CSS framework: ничего (raw CSS) / Pico / Tailwind via CDN? Минимализм — за raw. Раздёргать через первый прототип.
|
||
- [ ] Архивные таски (🟢 done старше N дней) скрывать по умолчанию? Toggle?
|
||
|
||
## Completed steps
|
||
|
||
- [ ] (фиксируется при выполнении)
|
||
|
||
## Notes
|
||
|
||
Стиль: минимализм без аватарок/гифок/анимаций. Это инструмент глядеть на доску, не дашборд для презентации. Whitespace + типографика.
|