feat(sprint-5.5): add page preview section with Create button

- New route /pages/preview with empty state ("Создать") and assembled preview
- Preview assembles real site blocks in order (Hero + Doctors ready, rest placeholders)
- localStorage persists created state; "Пересобрать" resets it
- Extracted HeroBlock and DoctorsBlock as reusable components
- Refactored hero and doctors pages to import from components/blocks/
- Sidebar: added "Просмотр страницы" link, bumped to Sprint 5.5 · v0.5.5
- SPRINTS.md: added Sprint 5.5 plan with summary table row

Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>
This commit is contained in:
AR 15 M4
2026-03-23 16:21:40 +05:00
parent 60619114a5
commit 72829b5d46
8 changed files with 496 additions and 222 deletions
+63
View File
@@ -229,6 +229,68 @@
---
## Sprint 5.5 — «Просмотр текущей страницы» (внеочередной)
**Цель:** Добавить интерактивный раздел брендбука, который собирает главную страницу из уже задокументированных блоков.
Показывает живой превью того, как выглядит сайт на основе данных брендбука.
### Концепция UX
**Маршрут:** `/pages/preview`
**Сайдбар:** добавить в раздел «Страницы» с пометкой (если ещё нет блоков — показывает заглушку с кнопкой)
**Два состояния страницы:**
1. **Пустое состояние** (первый вход, или если превью не создавалось):
- Заголовок «Просмотр текущей страницы»
- Описание: «Здесь будет собрана главная страница из задокументированных блоков»
- Активная кнопка «Создать» (`.bb-btn bb-btn-primary`)
- После нажатия → переход в «созданное» состояние
2. **Созданное состояние** (после нажатия «Создать»):
- Превью главной страницы из всех доступных блоков в порядке сверху вниз, как на perm.oclinica.ru/lor
- Кнопка «Пересобрать» в шапке (сбрасывает до исходного состояния)
- Сборка только из блоков, у которых есть готовый компонент (не mock-заглушки)
- Блоки рендерятся как реальные React-компоненты внутри `<section>`
**Порядок блоков в превью** (по perm.oclinica.ru/lor, только готовые):
1. Hero-баннер (`/blocks/hero` → компонент HeroBlock)
2. Блок врачей (`/blocks/doctors` → компонент DoctorsBlock)
3. Блок отзывов (`/blocks/reviews` → когда будет готов)
4. Форма записи (`/blocks/contact-forms` → когда будет готова)
5. Блок новостей (`/blocks/news` → когда будет готов)
6. Footer (`/blocks/contact` → когда будет готов)
**Техническая реализация (FE only, без бэкенда):**
- Состояние сохраняется в `localStorage` (`preview-created: true/false`)
- Каждый задокументированный блок выносится в переиспользуемый React-компонент
- Страница `/pages/preview` импортирует компоненты и рендерит их в нужном порядке
- Блоки, которых ещё нет → показывается placeholder с текстом «Блок в разработке»
### Задачи
- [ ] FE: Страница `/pages/preview` — пустое состояние с кнопкой «Создать»
- [ ] FE: Логика `localStorage` — сохранение/сброс состояния превью
- [ ] FE: Рефактор `/blocks/hero/page.tsx` — вынести баннер в компонент `HeroBlock` (переиспользуемый)
- [ ] FE: Рефактор `/blocks/doctors/page.tsx` — вынести в компонент `DoctorsBlock`
- [ ] FE: Placeholder-компонент для блоков, которые ещё не готовы (серая рамка с названием блока)
- [ ] FE: Сборка превью: рендер всех доступных компонентов в порядке реального сайта
- [ ] FE: Sidebar — добавить «Просмотр страницы» в раздел «Страницы»
- [ ] FE: Кнопка «Пересобрать» в созданном состоянии
- [ ] Docs: Добавить `/pages/preview` v1.0 в LLM_CONTEXT.md
### Зависимости
- Зависит от: Sprint 5 (блоки hero и doctors уже готовы — ✅)
- По мере добавления новых блоков в Sprint 5 — они автоматически подключаются к превью
### Ожидаемый результат
- Раздел «Просмотр текущей страницы» работает в браузере
- Кнопка «Создать» собирает главную страницу из задокументированных блоков
- Отсутствующие блоки отображаются как плейсхолдеры
- Кнопка «Пересобрать» позволяет сбросить и пересоздать
---
## Sprint 6 — Страницы (сборки из блоков)
**Цель:** Задокументировать полные страницы как сборки уже готовых блоков.
@@ -355,6 +417,7 @@
| 3 | Кнопки и форм-контролы | FE | CSS реального сайта |
| 4 | Карточки, бейджи, алерты | FE | CSS реального сайта |
| 5 | ВСЕ блоки сайта | FE | Все блоки /lor, mock-данные |
| 5.5 | Просмотр текущей страницы | FE | Кнопка «Создать», сборка из блоков, localStorage |
| 6 | Все страницы (сборки) | FE | Сборки из блоков, mock-данные |
| 7 | Авторизация (viewer / editor) | BE + FE | JWT, роли, login-страница, шапка с именем |
| 8 | Реальные данные | BE + FE | NestJS прокси → oclinica.ru, кэш 15 мин |