From 21ff64d571fe559bbda7430ec2eae544560d5b0c Mon Sep 17 00:00:00 2001 From: "Claude (backend session)" Date: Sun, 9 Aug 2026 21:58:54 +0300 Subject: [PATCH] Issue the S3.5 shell fixpack prompt built from the owner's 24 complaints and log it in the frontend zone journal --- frontend/docs/S35_SESSION_PROMPT.md | 241 ++++++++++++++++++++++++++++ frontend/docs/frontend-PROGRESS.md | 10 ++ 2 files changed, 251 insertions(+) create mode 100644 frontend/docs/S35_SESSION_PROMPT.md diff --git a/frontend/docs/S35_SESSION_PROMPT.md b/frontend/docs/S35_SESSION_PROMPT.md new file mode 100644 index 00000000..c2cec96f --- /dev/null +++ b/frontend/docs/S35_SESSION_PROMPT.md @@ -0,0 +1,241 @@ +# Промт: фронт-сессия S3.5 — фикс-пак оболочки (гейт S4) + +Ты — фронтенд-сессия TextMachine, шестая по счёту. Зона записи — **только `frontend/`**; сессия +НЕ коммитит — дерево готовит и передаёт на лендинг оркестратору. Протокол зоны — стоящий промт +`FRONTEND_SESSION_PROMPT.md` §«Зона и git», он в силе целиком; итоги, пинги и вопросы владельцу — +ТОЛЬКО зонный журнал `frontend-PROGRESS.md` (в `docs/PROGRESS.md` фронт не пишет). В дереве живут +незакоммиченные файлы ДРУГИХ зон (полигон: `eval/*`, `docs/experiments/22*|23*`) — не трогать +и не «прибирать». + +> Промт написан оркестратором №16 (09.08.2026) из **24 замечаний владельца**, снятых с живого +> прогона витрины. Замечания пронумерованы номерами владельца — **(1)…(24)**, номера локальны +> этому промту (как Q-номера паков). В отчёте пройтись по ВСЕМ 24: сделано (кадр ДО/ПОСЛЕ) / +> диспозиция с обоснованием / вопрос В-строкой. Молча пропустить номер нельзя. + +## Зачем эта сессия (рамка) + +Владельцу НЕ нравится текущее качество оболочки, и **S4 гейчен до её починки** (D39.119 п.4). +Скоуп S3.5 зафиксирован там же: **вкладки по VS Code-модели + Ф-19 + полный список владельца** — +список ниже и есть. Это фикс-пак ОБОЛОЧКИ И ВИТРИНЫ: настоящие экраны S4–S7 (загрузка книги, +механизм подписи банка, содержимое настроек, экспорт) НЕ строить. Общее замечание владельца, +рамка всего пака: модель до сих пор «не понимает связанность между элементами, их визуальную +ценность и не видит картину целиком» — каждый пункт чинить не изолированной заплаткой, +а глядя на весь экран. + +## Обязательное чтение до кода (порядок) + +1. `FRONTEND_SESSION_PROMPT.md` — стоящий промт: сценарий, жёсткие ограничения, зона и git. +2. Шапка `frontend-PROGRESS.md` + `BACKLOG.md` — пак прямо касается Ф-7, Ф-11, Ф-19, Ф-20, Ф-21, + Ф-30, Ф-32; их диспозиции не переизобретать. +3. `FRONTEND_PLAN.md` §5 — гейты, замеры, скриншот-цикл (что уже стоит и как расширять). +4. Референсы `frontend/references/`: **fleet.png — главный** (пропорции, зазоры, верхняя полоса, + статус-полоса) · **antigravity_add_folder.png** — модал добавления (свежий, докинут владельцем + 09.08) · antigravity_chat.png · antigravity_main.png. +5. `docs/product-requirements.md` — продуктовые требования (из реестра, не из памяти). +6. Контракт: зонная копия `frontend/docs/api-contract/openapi.yaml` — формы данных берутся оттуда. + +## Инструментальная рамка (обязательна) + +- **Скриншот-цикл стоит и остаётся законом:** `npm run shot`, «смотреть на снимок — обязательная + часть цикла» (`scripts/shot.mjs` шапка). Для этого пака статики МАЛО: половина замечаний — про + ИНТЕРАКЦИЮ (клики по вкладкам, драг ручки, модалы, ховеры). Playwright уже в зависимостях + (`playwright` 1.62.1) — писать сценарии интеракций (клик → кадр → проверка состояния) и гонять + их частью самопроверки; долгоживущие — в `scripts/`, replayable, не в /tmp. Вердикт «сделано» + без кадра ДО/ПОСЛЕ не принимается. +- **Сверка с референсом:** `npm run shot --size 1280x764` — вьюпорт fleet.png для прямого + наложения. Замечание (1) дополнительно требует кадра **2560×1440** — владелец смотрит + на 27" 2K, и дефолтные масштабы не понравились именно там. +- Если в окружении установлен плагин **frontend-design** (официальный Anthropic) — он активируется + на фронт-задачах сам; его гайды по типографике/палитре применять, но пины `STACK_DECISIONS.md` + и токен-гейты (одно место для цвета и размера) первичны. +- **Мандат самопроверки:** ревью ИСПОЛНЕНИЕМ своего кода и своих кадров + адверсариальное ревью + диффа (author≠reviewer) в конце — как в S2/S3. `npm run check` и `npm run check:full` зелёные + на сдаче; гейт доступности axe зелёный (⚠ при смене фонов пересчитывать контраст — Ф-11 уже + на пороге WCAG). + +## Замечания владельца + +### Вкладки — модель VS Code (2, 3; сюда же Ф-19) + +**(2) Спам вкладками.** Любой клик по главе плодит вкладку по центру. Сделать ровно модель +VS Code для текстовых файлов: +- одиночный клик по главе → **preview-вкладка** (одна на панель, заголовок курсивом); +- одиночный клик по другой главе **замещает содержимое** preview-вкладки — новая не создаётся; +- **пин** (превращение в постоянную): двойной клик по главе, двойной клик по самой вкладке, + либо содержательное взаимодействие с открытым содержимым (в VS Code — правка; что считать + содержательным у нас — реши и запиши в отчёт; простая прокрутка пинить не должна); +- закрытие — как сейчас (крестик/Delete, Ф-17 в силе). + +**Ф-19 чинится здесь же:** переключение вкладки размонтирует панель и теряет прокрутку +(`react-aria-components` не рендерит невыбранную TabPanel), пересборка 2284 узлов стоит +70–140 мс. Строка откладывала лекарство «до решения об устройстве оболочки» — это решение +принимается СЕЙЧАС, под задачу: keep-alive панелей или запоминание офсета на вкладку — выбрать +по замеру и записать почему. + +Приёмка playwright-сценарием: пять одиночных кликов по разным главам → в ряду ровно ОДНА +preview-вкладка; двойной клик → пин, следующий одиночный клик открывает НОВУЮ preview рядом; +на `/scale` прокрутка дерева до 9000 → уход на другую вкладку → возврат → офсет жив. + +**(3) Вид вкладок.** Слишком мелкие, «не отделимы для глаза», слиты с панелью. Вписать вкладки +в панель аккуратнее: активная читается мгновенно (фон/подчёрк/контраст), высота и отступы — +по референсу, а не меньше. Это не «скопировать Fleet ещё точнее», а передать аккуратнее — см. (14). + +### Геометрия, масштабы, зазоры (1, 5) + +**(1) Дефолтные масштабы великоваты**, особенно на 27" 2K (на 24" терпимее). Ориентир — пропорции +fleet.png ОТНОСИТЕЛЬНО кадра: доли панелей, высоты строк дерева/списков, плотность элементов +внутри панелей («элементы как будто не тот масштаб имеют»). Работать ЗАМЕРОМ — наложение кадра +1280×764 на референс, измеренные доли/пиксели в `FRONTEND_PLAN.md` §5, — не на глаз. Все размеры +через `tokens.css` (токен-гейт Ф-4 стоит и обязателен). + +**(5) Выравнивание панелей, зазоров и статус-полосы.** «Особенно заметно по тексту снизу» — +нижняя статус-полоса: базовые линии, вертикальные центры, отступы от краёв — сверить с Fleet +попиксельно; у них аккуратнее. + +### Кнопки, иконки, настройки (4, 17, 19, 11) + +**(4) Две кнопки поиска, делают одно и то же, лупа в непонятном месте.** У Fleet роли РАЗНЫЕ: +вкладка «Search» в левой панели — полнотекстовый поиск по проекту; лупа в правом верхнем углу — +глобальная палитра «Goto / Search everywhere». Развести роли осмысленно для читалки (поиск по +книге ≠ быстрый переход к главе/термину) либо оставить одну кнопку; кнопка без действия +запрещена (норма Ф-7/Ф-16). + +**(17) Иконки «шакальные»** — особенно тогглы левой/правой панели. Разобраться с причиной, +а не перерисовать вслепую: размер сетки иконки vs размер отрисовки, выравнивание на пиксельную +сетку, толщина штриха на тёмном фоне, `shape-rendering`. Туда же — «текст рендерится странновато, +особенно внизу»: проверить сглаживание, вес и размер шрифта статус-полосы (дробные px после +масштабирования дают мыло). Показать кадрами ДО/ПОСЛЕ с зумом. + +**(19)+(11) Настройки.** Шестерёнку — в правый верхний угол (как у Fleet), из нижней части +убрать. Открываются НЕ вкладкой — **модальным окном поверх оболочки** (по примеру Claude Code / +ChatGPT). Внутри — честный каркас разделов без содержимого (содержимое — S7), включая два +будущих пункта из (15): светлая тема, язык интерфейса. + +### Драг панелей (18; сюда же половина 14) + +**(18а) Баг:** фиолетовая полоска ресайза ЗАЛИПАЕТ после отпускания драга. **(18б) Форма:** +полоску сделать тонкой и вписанной ВНУТРИ гепа между окнами — она не должна перекрывать чёрный +геп (владелец: «чёрный фон между окнами не трогать, он идеален» — (14)). + +Референс-реализация по слову владельца — проект vojo, скопировать ПОДХОД оттуда: +- `/home/ubuntu/projects/vojo/src/app/components/page/style.css.ts:11-70` — ручка: невидимая + зона захвата 7px поверх зазора; индикатор — пилюля 2×36px по центру, `opacity: 0` в покое, + ховер 0.25, драг — подсветка акцентом и рост до 48px; на упоре min сплющивается, на упоре + max вытягивается («лимит чувствуется тактильно»); переходы 140ms. +- `/home/ubuntu/projects/vojo/src/app/components/page/Page.tsx:191-300` — механика: pointer + capture на ручке; живая ширина в состоянии компонента, персист одним махом на pointerup + (не на каждый move); cleanup-эффект снимает `cursor`/`user-select` с body при unmount + посреди драга — ЭТО и есть лекарство от залипания (Alt-Tab, смена маршрута, pointerup мимо). +- Правый край — та же схема в `ThreadDrawer.tsx:209-241`. + +Копируется подход, не файл: у vojo vanilla-extract и folds, у нас токены и CSS-модули. + +### Читалка (9, 10, 24) + +**(9) Оригинал/перевод разделить мягко визуально.** Сейчас колонки различимы слабо. Очень +деликатно: фон на полтона, тонкий разделитель, отступ — один приём, не три сразу. (Приглушение +колонки оригинала — отдельный хвост Ф-7 на S6, здесь не решать, но не противоречить.) + +**(10) Серо-синяя линия вдоль текста** — владелец не смог её прочитать. Это полоска ЗАМЕЧАНИЯ +(`src/ui/Callout.tsx:13`, `Callout.module.css`: синяя `attention` / серая `glance` — выноска +по образцу antigravity_chat). Непрочитываемость подтверждает Ф-21 живым владельцем: смысл +различается только цветом. Переделать так, чтобы значение читалось без объяснения — связью +с замечанием (иконка/счётчик у блока, ховер подсвечивает пару «полоска ↔ текст замечания»), +НО продуктовое слово ступени не выдумывать — словарь на владельце (В-3/Ф-21). + +**(24) Пометка черновика.** Пока глава переводится/черновая — мягкая пометка (иконка/ворнинг +с тултипом): «черновой вариант, может быть перегенерирован» — чтобы человек не пугался смены +названий и числа глав (research/27: пере-нарезка легальна). Форму брать из данных контракта +(статусы главы/прогона по спеке); поля не выдумывать — класс ошибки «фикстура выдумала форму» +уже ловился четырежды (Ф-14). + +### Вкладка «Замечания» (8) + +Владелец: непонятно зачем — всё рисуется в тексте, статусы есть в дереве; «лишнее. Если хочешь +защитить этот дизайн — обоснуй». Два легальных исхода: (а) снять вкладку; (б) защитить — +обоснованием И кадром сценария, который без неё не живёт (кандидат: сводный список по книге, +Ф-32 — пер-книжное чтение замечаний уже есть в памяти клиента). Решение — диспозицией в отчёте, +финальное слово — владельцу. + +### Банк памяти (7, 13, 20) + +**(7)+(13) Представление банка перепридумать.** Текущее «прям совсем не годится: не +репрезентативно, непонятно, нечитаемо». Больше информации на термин и читаемо для верификации: +оригинал · перевод · тип · род/пол · описание/обоснование · варианты · статус решения · откуда +термин (глава появления); сведения, раскрывающие БУДУЩИЕ события книги, — под спойлер. Поля +брать из контракта (`BankEntry`: `type`/`sense`/`since_ch`/`source`, трёхзначный статус); чего +в контракте нет (пол/род? варианты? спойлер-граница?) — не выдумывать в фикстуре молча, +а ПРЕДЛОЖИТЬ черновиком правки спеки с пометкой «предложено» (право и обязанность зоны — +D39.99 п.4; ратифицирует оркестратор). + +**(20) «Подписать банк» и «подписано 10 из 60» непонятны:** что подписываем — банк или термины? +зачем счётчик? кнопка открывает вкладку-заглушку. Механизм подписи = S5, здесь НЕ строить. +В S3.5 — честная витрина: непонятные кнопки-заглушки снять (кнопка без действия запрещена) +либо заменить читаемым состоянием («ждут решения: 50»), формулировки — по словарю подписи +контракта (auto/draft/approved), без выдуманных глаголов. + +### Библиотека и метаданные (6, 12, 21, 22, 23) + +**(6) «О книге» — метаданных больше, но подходы охранять.** Вытащить больше информации о книге, +при этом НИЧЕГО, что раскрывает принципы/логику работы бэкенда: деньги на экран не выносим +(§4.8 стоящего промта), модели/routing/внутренности пайплайна закрыты разрешающим списком +контракта — это осознанная защита подходов, не пробел. Легально из контракта: язык пары, объём, +главы/юниты, прогресс пофазно, статус, даты, замечания счётчиком. + +**(12) Добавление книги — модальным окном**, по antigravity_add_folder.png (сейчас зачем-то +открывается новая вкладка): модал «добавить книгу» → выбор файла/папки → **поле названия: +автор вводит руками ЛИБО скипает — тогда название даёт авто-парсер** (различать эти два +источника) → слоты будущих пер-книжных настроек (каркасом). Сам аплоад (`POST /books`, +multipart, прогресс) строит S4 — здесь модал, его форма и мок-поведение. + +**(21) Цветной статус книги — на ИКОНКЕ книги**, не точкой рядом с надписью. + +**(23) Наложение системных надписей на название книги/главы** («готово», «нужна подпись» +перекрывают текст) — «исполнение кривое и некрасивое», сама идея бейджа не отвергнута. +Переделать: бейдж/иконка НЕ поверх названия (справа в ряд, отдельным слоем с гарантией +непересечения — эллипсис названию, фикс-место бейджу). + +**(22) — вопрос владельца, ответ вписан оркестратором, сессии тут делать нечего:** «где +генерится оригинал названия главы?» Сейчас — фикстуры мока (`src/mock/book.ts:87-131`, +`src/mock/scale.ts:49-51`). В реальном пайплайне заголовок ПЕРЕВОДА движок рендерит +детерминистически из шаблона пары (`configs/langpacks/zh-ru/heading.txt`: «Глава {n}») и вклеивает +в финальный текст первого юнита, а исходный маркер остаётся телом оригинала; метка в дереве +по контракту — из ДАННЫХ (`heading`/`number`, К-3); чем подписывать главу без заголовка — +открытый В-4 на владельце (Ф-30). + +### Цвет и тема (14, 15, 16) + +**(14) «Слишком точная копия Fleet».** Подразбить цветовую схему чуть оригинальнее — акценты, +выделения, второстепенные поверхности; **чёрный фон между окнами НЕ трогать** («он идеален»). +Это доводка индивидуальности, не редизайн. + +**(16) Фон главных окон «серо-неприятный».** Изучить (websearch) рекомендации по тёмным фонам, +приятным глазу: не чистый нейтральный серый — слегка тонированные тёмные (тёплый или холодный +подтон), не абсолютно чёрное полотно под текстом, контраст текста не на максимум. Предложить +2–3 варианта КАДРАМИ, выбрать лучший, показать владельцу оставшиеся как альтернативы. Токены — +в `tokens.css`; контраст пересчитать (Ф-11 у порога; axe-гейт остаётся зелёным). + +**(15) Светлой темы нет, выбора языка интерфейса нет.** Оба живут в настройках (каркас — п. (11)). +Строить в S3.5 только если дёшево поверх токенов (палитра уже одно место — оценить честно); +иначе — ЧЕСТНАЯ диспозиция: цена, план, строки Ф-N в `BACKLOG.md`. Молчание нелегально. + +## Что НЕ делать + +- Не строить экраны S4–S7: загрузка книги, механизм подписи банка, содержимое настроек, экспорт. +- Не править канон контракта; правки спеки — черновиком «предложено», ратифицирует оркестратор. +- Не трогать чужие зоны и чужие незакоммиченные файлы (полигон жив). +- Продуктовые слова не выдумывать: ступень замечания (В-3), фраза паузы (В-6), подпись главы + без заголовка (В-4) — на владельце. +- Тесты и гейты не подгонять под зелень (D39.121): красный гейт — вопрос оркестратору + через журнал, не правка гейта. +- Никакого `git add -A`/`git commit` — дерево передаётся на лендинг как есть. + +## Отчёт и приёмка + +- Таблица по всем 24 номерам: номер → что сделано → кадр/замер (ДО/ПОСЛЕ) → либо диспозиция / + В-строка. Прогон по номерам — в зонный журнал `frontend-PROGRESS.md`, хвосты — `BACKLOG.md` + строками Ф-N, вопросы владельцу — В-строками. +- `npm run check` и `npm run check:full` зелёные; кадры в `.shots/`; наложение 1280×764 + на fleet.png и кадр 2560×1440 — приложены. +- Адверсариальное ревью диффа (author≠reviewer) исполнено, находки с диспозициями — в отчёт. +- Промт S4 не писать — его выдаёт оркестратор после приёмки этого пака. diff --git a/frontend/docs/frontend-PROGRESS.md b/frontend/docs/frontend-PROGRESS.md index 9c28a7b5..c7c6ff58 100644 --- a/frontend/docs/frontend-PROGRESS.md +++ b/frontend/docs/frontend-PROGRESS.md @@ -48,6 +48,16 @@ > по VS Code-модели + Ф-19 прокрутка + список владельца), затем S4 на починенной оболочке. > Промт S3.5 выдаёт оркестратор по слову владельца. +> **Запись оркестратора №16, 09.08 — список владельца ПРИШЁЛ, промт S3.5 ВЫДАН.** Абзац выше +> исполнен: полный список претензий (24 замечания, снятые владельцем с живого прогона витрины) +> получен 09.08 и завёрнут в промт **`S35_SESSION_PROMPT.md`** (эта папка): VS Code-модель +> вкладок + Ф-19 + все 24 номера блоками, приёмка кадрами ДО/ПОСЛЕ и playwright-сценариями, +> референс драг-ручки — vojo (`src/app/components/page/Page.tsx:191-300`, `style.css.ts:11-70`). +> Запуск сессии — по слову владельца; S4 остаётся гейчен до приёмки S3.5. Попутное: замечание +> (10) владельца независимо подтвердило Ф-21 — полоска замечания нечитаема без слова; само +> слово ступени — по-прежнему В-3 на владельце. Референс `antigravity_add_folder.png` докинут +> владельцем 09.08 (модал добавления книги, замечание (12)). + > **Запись фронт-сессии S3, 08.08.** Абзац «S3 НЕ сделана: замок закрыт» ниже — состояние на > 04.08, и он УСТАРЕЛ целиком: замок открыт, **S3 сделана**. Хроника — первым разделом ниже. > Коротко: `src/api/` асинхронен и разговаривает HTTP; MSW стоит СЕТЕВЫМ моком, поэтому приложение