- TopBar: right cluster `md:ml-0 ml-auto` → `ml-auto` always. Без TopBar
search в центре уже нечего push'ить вправо через form, right cluster
должен сам прижиматься к правому краю. User: "в топбаре руководство
и далее по правой стороне".
- Catalog toolbar: scope chips / bundle pills / Граф button — все на
h-8 (было py-1 + inline text variable height). + inline-flex
items-center чтобы baseline консистентный с input/Граф/+Создать.
User: "высоту элементов в баре таблиц выровняй".
User clarification after MR !91:
- "Search из TopBar убран — все верно" — TopBar search должен быть удалён.
- "TopBar search вернулся. убери его" — MR !91 ошибочно его вернул.
- "два крестика баг в топбаре был а ты и в таблице убрал его" — двойной X
was в TopBar (native + custom); в catalog был только custom X на
старом input. После refactor catalog input получился без X совсем —
fix: добавил кастомный clear button когда q непустой.
Changes:
- TopBar: removed form + SearchInput + handlers (handleSearchInput /
Submit / Clear / inputRef / useState). Removed useEffect ⌘K shortcut
(без search input nothing to focus). Right cluster: Docs +
VersionBadge + NotificationsBell. ml-auto на right cluster чтобы
push'ить вправо без search в центре.
- Catalog input: добавлен absolute-positioned X (✕) справа input'а
когда `search.q` непустой. `pr-7` на input чтобы текст не наезжал.
Clear → `setSearch({ q: undefined })`. Single X confirmed visually.
Follow-up к MR !90 per user feedback iterations:
1) "в поиске по справочникам два крестика" — fixed в SearchInput:
`type="search"` (native browser X) → `type="text"`. Custom onClear X
остаётся единственным. Catalog input тоже type="text".
2) "блин два крестика было на топбар поиске а тут норм все. верни" —
restore TopBar search input. Context-aware behavior сохранён:
- На /dictionaries → live filter каталога через URL ?q=
- На остальных routes → submit (Enter) → /search records search
Single X confirmed by visual test.
3) "свитч темы можно тоже в профиль перенести" — ThemeSwitch переехал в
Sidebar footer (рядом с RU/EN button). Right row в footer: lang button
слева, theme switch (3 icons sun/moon/monitor) справа через ml-auto.
4) "руководство и версию оставить в топбар чтобы подсвечивать новинки" —
Docs + VersionBadge stays in TopBar. Туда же добавлена
NotificationsBell (placeholder Bell icon) — broadcast slot для
webhook errors / draft reviews / system notices когда backend
notifications stream появится.
Per user feedback:
- "Справочники 37 шт. эта надпись в топбаре" — title с inline count
переехал в TopBar breadcrumb (новый Crumb.caption field, text-cap mute).
Catalog page больше не имеет h1 — start straight from toolbar.
- "фильтры и кнопки в баре таблицы. бар цветом" — toolbar (scope/bundle
pills + counter + Граф + + Создать) обёрнут в tinted `bg-surface-2`
rounded bar с border. Визуально отделяет controls от table chrome.
- "заголовки таблицы белый фон" — table thead was `bg-surface-2` (cream),
сливалось с toolbar bar. Стало `bg-surface` (white) — clean visual
separation toolbar (tinted) → table (white).
- "→ ссылается шрифт не тот" — InfoPanel section subhead "→ ссылается"
/ "← используют" был `text-cap` (Tektur uppercase 10.5px bold).
Прототип использует regular body Inter lowercase mute. Заменил на
`text-body text-mute`.
TopBar useBreadcrumb extended: для catalog route добавляет inline `caption`
field из useDictionaries() count. Editor route остаётся с mono `subtitle`
("name · v1.0.0"). Different fields rendered с different styles.
User: "строки таблиц белые / ховер на них более чёткий а то еле видно".
Прошлый hover был bg-surface-2/40 (40% opacity на cream/yellow page bg) —
почти неотличим от default. Под page bg #faf9f5 + 40% opacity surface-2
тёмное пятно еле проступало. На long тяжело отследить какая row под cursor.
Изменения:
- DictRow (catalog table): убран subtle scope-color bg tint (был
warn-bg/30, pink-bg/30 — еле виден на page bg). Row всегда `bg-surface`
(white). Scope visually conveyed через 3px left-stripe + colored SCOPE
chip. Hover full strength `bg-surface-2` (no /40 opacity).
- FieldsTabContent + EventsTabContent rows: same change — bg-surface +
hover:bg-surface-2.
- Shared TableRow component (ui/components/table.tsx): bg-surface +
hover:bg-surface-2 — applies к records table, audit, и любым другим
TableRow callsites.
Per redesign prototype screenshot: каждая row имеет 3px цветной strip слева
по scope + filter chips заполняются scope-color когда active.
- DictRow: добавлен absolute-positioned `<span>` шириной 3px на левом краю
первой td (relative wrapper), background = SCOPE_DOT (PUBLIC=accent,
INTERNAL=warn, RESTRICTED=pink). pl-1 на контенте чтобы не наезжал.
- Row bg tint: для INTERNAL/RESTRICTED rows — subtle SCOPE_BG_TINT/30,
PUBLIC = plain white (default).
- SCOPE col chip: использует SCOPE_BG_TINT + SCOPE_TEXT вместо generic
Badge info — теперь PUBLIC chip orange, INTERNAL amber, RESTRICTED pink.
- Toolbar scope filter pills: active state = SCOPE_BG_TINT + SCOPE_TEXT +
border-transparent (filled in scope color). Inactive = outline.
Per /Users/zimin/Downloads/Ordinis (4)/redesign/compact.html (бэкграунд
прототипа уже #faf9f5 — match'ит наш neutral default).
Catalog table:
- ИЗМЕНЁН column показывает relative time: Xс / Xмин / Xч / Xд / Xмес / Xг.
Прошлая абсолютная дата (05/06/2026) затирала scale ("5 минут vs 3 месяца —
визуально одинаково далеко"). Прототип использует 2ч, 3д, 1мес.
- Chevron `›` column добавлен в конец каждой строки — affordance что row
кликабелен (открывает editor).
Sidebar:
- Flatten: убраны section labels (workflow / admin). Все nav items в одном
списке per redesign: Главная → Справочники → Мои черновики → На ревью →
Outbox → Webhooks → Аудит → Поиск.
- /graph удалён из sidebar — теперь reachable только через catalog toolbar
"Граф ⇄" button (single entry point, no duplication).
- Применено в обоих Sidebar (desktop) и MobileSidebar (drawer).
Cleanup: убран unused GitBranch icon import.
Match handoff screenshot:
- Title "Справочники" + inline "N шт." count caption (no description text)
- Remove page-level SearchInput (TopBar already has global search ⌘K)
- Reorder toolbar to single row:
[scope pills PUBLIC|INTERNAL|RESTRICTED]
| divider |
[bundle pills все|cuod|geo|i18n|core]
| spacer |
N/M counter
[Граф ⇄] (→ /graph)
[+ Создать] (moved here from PageHeader actions)
- Scope/bundle pills are bordered chips с ring-1 для active state
- Drop deps-only toggle (not in redesign)
- Drop scopeCounts useMemo (counts moved out of chip labels per design)
Реальные измерения через DevTools на staging выявили 3 бага после MR !47:
Bug 1: text-title-md/lg/xl inherited Tektur от @nstart/ui Card parent.
Handoff: 'Inter for all headings'. Computed: Tektur.
Fix: добавил font-family: var(--font-sans) explicit на text-title-*
и text-body/text-cell. После Stage 3.9 (nstart gone) можно убрать —
body inherit будет достаточно.
Bug 2: text-cap + font-mono cohabit (catalog scope chips, time-travel
presets) → Tailwind v4 cascade order: font-mono идёт после text-cap
в bundled CSS → JetBrains Mono перебивает Tektur. text-cap baked
font-display, font-mono token redundant.
Fix: codemod strip font-mono где есть text-cap (4 sites). Computed
font-family теперь правильно Tektur.
Bug 3: @nstart/ui PageHeader рендерил h1 'DICTIONARIES' в Tektur
36px/700 uppercase (font-primary text-4xl). Handoff page title:
17px/600 Inter normal case. Наш src/ui/components/page-header.tsx
написан но не экспортирован через barrel — все routes резолвили
PageHeader к nstart версии.
Fix: добавил 'export { PageHeader }' override в src/ui/index.ts.
Все 7 PageHeader usages (catalog/search/reviews/webhooks/outbox/
my-drafts/graph) теперь получат handoff-conformant heading.
Bug 4 (small): catalog counter '37/37' использовал text-cap но это
numeric value — handoff role text-mono (11px JetBrains Mono).
Fix: text-cap → text-mono + tabular-nums для grid alignment.
Verified via injected test elements + CDP computed styles:
text-title-xl: 22/600 Inter
text-title-lg: 17/600 Inter
text-title-md: 15/600 Inter
text-body: 13/400 Inter
text-cell: 12.5/500 Inter
text-mono: 11/500 JetBrains Mono
text-cap: 10.5/600 Tektur
Все 7 utilities точно matches handoff scale.
Files: 4 modified. TS strict + 116 tests pass.
Перенесли scope-визуальные константы (SCOPE_ORDER, SCOPE_DOT,
SCOPE_ACCENT) в `lib/scope-style.ts` для переиспользования. На detail
странице (`dictionaries/$name`) добавили top accent strip 4px цветом
scope + цветной чип в breadcrumb рядом с back-link. Теперь при переходе
из списка в карточку scope сразу виден без чтения badge в таблице.
40 справочников в плоском grid тяжело сканировать. Разделили на секции
PUBLIC / INTERNAL / RESTRICTED с цветными accent-полосами слева у карточек
(emerald / amber / rose). Search фильтрует across all sections, пустые
секции скрыты. Цвет даёт instant scan, секции — explicit разделение.
Backend:
- DictionaryRecordRepository.countActiveGroupedByDictionary — один GROUP BY
по всем справочникам с фильтром по scope, без N+1.
- DictionaryResponse.recordCount (nullable) + factory from(d, count).
- DictionaryDefinitionController передаёт счётчики в list/get,
фильтрованные по currentScopes() пользователя.
Frontend:
- SearchInput над сеткой карточек, client-side filter по
name/displayName/description (case-insensitive, useDeferredValue).
- Badge "N записей" (i18n plural ru/en) в углу карточки.
- "Показано N из M" рядом с поиском.
- EmptyState когда поиск пустой.
Свои Modal/Button/inputs выкинуты — берём nstart-ui v0.1.3 как в других corp
React приложениях. Установка через .npmrc → repo.nstart.cloud/repository/npm-hosted/.
Что сделано:
- .npmrc: scope @nstart на corp Nexus + min-release-age=7
- deps: @nstart/ui ^0.1.3, @phosphor-icons/react ^2.1.10
- bumped peer deps: i18next ^26 + react-i18next ^17 (требование nstart-ui)
- styles.css: импорт @nstart/ui/styles/{fonts,theme}.css + critical @source
директива (без неё Tailwind v4 tree-shaking дропнул бы все классы из dist либы)
- main.tsx: <NStartUiProvider> на корне
- DROP src/components/ui/Modal.tsx (свой Modal больше не нужен)
Routes:
- __root: LanguageSwitch вместо двух кнопок RU/EN, токены ultramarain/regolith/carbon
- dictionaries.index: PageHeader + Badge для scope chip + Alert/EmptyState/LoadingBlock
- dictionaries.$name: PageHeader с actions, Modal/Panel/Table/TableRow/Cell,
IconButton с Phosphor (PencilSimple, XCircle), Button variant=primary/danger/ghost
Form (SchemaDrivenForm):
- TextInput/TextArea/SingleSelect/Checkbox + FieldLabel/Hint/Error из @nstart/ui
- FormSection + FormGrid columns=1|2 для группировки
- FormActions align=end с Button loading state
- Alert variant=error для server-side ошибок (422 IdempotencyConflict / 409 InProgress)
- ajv валидация по schema_json остаётся такой же (Draft-07, как у backend)
Bundle: 192KB → 659KB gzip — тянет echarts/lottie/brand assets из nstart-ui,
для internal admin tool приемлемо (cached after first load).
После regen routeTree.gen.ts /dictionaries/$name стал child route /dictionaries.
dictionaries.tsx рендерил карточки без <Outlet/> — клик по карточке менял URL,
но child компонент негде было рендерить, поэтому видна та же страница со списком.
Разнёс по конвенции:
- dictionaries.tsx — layout с <Outlet/>
- dictionaries.index.tsx — карточки списка (matches /dictionaries)
- dictionaries.$name.tsx — без изменений (matches /dictionaries/{name})
Zimin A.N.