Handoff prototype показывает «‹ Свернуть» button внизу sidebar — toggle
desktop rail в icon-only 56px. Persists в localStorage ord-sidebar-collapsed.
Sidebar component:
- State collapsed (localStorage 'ord-sidebar-collapsed' = '1')
- <aside width> transitions между w-[220px] и w-[56px] (200ms ease)
SidebarContent (DRY с MobileSidebar) получил props:
- collapsed?: boolean (default false)
- onToggleCollapsed?: () => void (undefined hides button — mobile drawer)
Когда collapsed:
- Logo: 'ORDINIS' → 'O' (single char, centered)
- Section labels (text-cap headers) — hidden
- Nav links: icon-only, centered, icon size 18px (vs 15px expanded);
title attribute с label для hover tooltip
- Badges (records count, pending) — hidden (нет места)
- User block: avatar only, name/email hidden; title attribute с full name
- Toggle button bottom: '‹ Свернуть' → '›' (icon-only)
Mobile (MobileSidebar Sheet) НЕ получает collapse — там Sheet даёт full
nav text всегда, close через × header.
A11y: aria-label / title для всех collapsed buttons. Click handler
sets localStorage + state — survives F5.
Tests: 116 pass. TS strict clean.
Closing 2 handoff gaps:
1) DRAWER TOOLBAR FILTERS (handoff Screen 3 line 279)
SchemaDrivenForm получил три new optional props:
- searchFilter (string) — case-insensitive substring против field key + label
- onlyFilled (boolean) — hide fields с empty data[key]
(null/undefined/''/false/0/empty-array/empty-object)
- onCounterChange (visible, total) — surface field counter parent'у
Filter применяется поверх bucketing — все три buckets (identity/description/
extra) фильтруются. UI рендерит filteredBuckets.X.map(...) вместо raw bucket'ов.
В sections layout (drawer use case) если section после filter empty —
sticky header не рендерится. Tabs layout backward-compat (filter применяется
но visually invisible если user в другом tab'е).
dictionaries.$name.tsx callsite:
- State: drawerSearch, drawerOnlyFilled, drawerCount {visible, total}
- Reset on drawer close
- RecordDrawer.toolbar prop wired только в edit mode (create — все поля
empty, 'только заполненные' даст 0/0)
- SchemaDrivenForm receives все три filter props
Result: user может typing 'mass' в drawer search → видит только mass_kg /
data_mass / etc.; toggle 'только заполненные' → hide unused optional fields.
2) RECORDS TABLE RESPONSIVE COLUMN HIDING (handoff line 466)
Records table в dictionaries.$name.tsx применяет hideBelow API из MR !59:
- businessKey: всегда visible
- name/code: hideBelow='md' (768px)
- extra schema columns: hideBelow='lg' (1024px)
- scope badge: hideBelow='sm' (640px)
- validFrom: hideBelow='lg'
- actions: всегда visible
На mobile 375px только businessKey + actions visible — chrome остаётся
usable. Tablet 768+ adds name/scope. Desktop 1024+ adds schema columns.
Tests: 116 pass.
@semantic-release/npm падал с EINVALIDTARBALLDIR — tarballDir option
должен быть String OR omitted. У нас был false (boolean), что invalid.
Поскольку npmPublish: false (мы НЕ публикуем pkg в npm registry —
private repo), tarballDir не нужен вовсе. Удалили — default behavior
(npm pack идёт в temp dir после bump, но не used при npmPublish:false).
После этого fix semantic-release должен пройти normally:
- analyze conventional commits с момента v1.2.2
- bump version в admin-ui/package.json
- generate CHANGELOG.md
- commit + tag vX.Y.Z [skip ci]
- create GitLab Release object
Минимум tag будет v1.3.0 (мы накопили 10+ feat: с момента v1.2.2).
Handoff prototype design/compact.html показывает editor как 3-col layout:
[Sidebar 220 (global nav)] [InfoPanel 220 (dict metadata)] [main content].
Текущая implementation была 2-col (nav + everything).
NEW src/components/editor/EditorInfoPanel.tsx:
- Scope badge (PUBLIC/INTERNAL/RESTRICTED) — top
- ОПИСАНИЕ section — caption + dict.description body
- Metadata 2x2 grid: Bundle / Версия / Записей / Локали
(mono text-ink-2, cap labels)
- СВЯЗИ section с двумя группами:
→ ссылается outgoing FK list (name links к /dictionaries/$name)
← используют incoming refBy list (deduplicated sourceDict names)
- sticky lg:top-2 self-start чтобы panel оставалась видна при scroll
- lg:max-h-[calc(100vh-7rem)] overflow-y-auto если metadata высокий
src/routes/dictionaries.$name.tsx:
- Обернул содержимое (banner + tabs + tab content) в:
<div className='grid grid-cols-1 lg:grid-cols-[220px_1fr] gap-4 lg:gap-6'>
<EditorInfoPanel ... />
<div>{banner + tabs + content}</div>
</div>
- На <lg переключается в stacked (info above content) — single column
благодаря grid-cols-1.
PageHeader остаётся выше grid (full-width breadcrumb + title + actions).
Action buttons (AOI / Time-travel / Schema edit / Создать) живут в
PageHeader.actions slot — handoff prototype показывает их в info panel,
но рядом с title лучше discoverable. Может уйти в info panel в future
refactor.
Tests: 116 pass. TS strict clean.
RecordDrawer теперь принимает optional toolbar prop:
- search (string) — field name filter
- onlyFilled (boolean) — show only filled fields toggle
- counterVisible/Total (number) — 'N / M полей' caption
Sticky position между header и body, h=44 per handoff style. Toolbar
rendered только если caller передал. SchemaDrivenForm callsite (записать
filter в каждое FieldRenderer) — separate follow-up, требует refactor
form internals (currently 3 buckets identity/description/extra).
Section anchor chips + wide-mode ToC rail — deferred до backend
x-section schema metadata (CEO open question #5 в handoff).
Handoff line 438: 'Pressing j/k moves selected row; Enter opens drawer;
Esc closes; n opens new-record drawer; / focuses search.'
Implementation:
- rowCursor state — index в visibleRecords (-1 = no focus)
- j или ArrowDown → cursor++ (clamped)
- k или ArrowUp → cursor-- (clamped)
- Enter → setEdit({kind:'edit', record}) когда cursor valid
- n → setEdit({kind:'create'}) когда canMutate
- Esc — handled Radix Dialog natively через RecordDrawer
- / — handled TopBar (⌘K equivalent, focuses global search input)
Guards:
- Skip когда target inside input/textarea/contentEditable (no conflict с typing)
- Skip когда drawer/modal open (edit.kind !== 'closed' — focus в portal)
- Cursor reset на page/filter change (stale index безопасности)
Visual: active row получает bg-accent-bg/40 outline accent для clarity.
CRITICAL bug — на staging buttons рендерились в 16px вместо handoff
workhorse 13px. UpdateBanner secondary buttons показывали invisible
текст (text-ink overrode by inherited text-on-accent от parent banner).
Root cause:
buttonVariants base = 'rounded-md text-body font-medium ...'
primary variant = 'bg-navy text-on-accent ...'
tailwind-merge default config pattern-matches `text-*` как ОДНУ группу
(color). Видя `text-body text-on-accent` он считал это конфликтом двух
colors → keep last → text-on-accent остаётся, text-body стрипается.
Result: button теряет font-size → inherit body 16px.
Fix: extendTailwindMerge регистрирует наши custom semantic typography
utilities (text-body/cell/mono/cap/title-*) в группе font-size (отдельной
от colors). twMerge теперь знает `text-body text-on-accent` это size +
color, обе сохраняются.
Also: text-mono/text-cap в font-family группе (они baked Mono/Tektur)
— fix конфликт с font-mono/font-display tokens если кто-то их случайно
combined.
Verified в preview: 'Sign in' button class теперь содержит text-body,
computed fontSize: 13px (вместо 16px).
Plus CI: release job image node:22-alpine → repo.nstart.cloud/library/
node:22-alpine (Docker Hub rate-limited, mirror используется во всех
других jobs).
Per design_handoff_ordinis_mdm/README.md responsive table (line 464-465):
- ≤1024px: Sidebar becomes overlay drawer (hamburger в TopBar)
- ≤880px: Drawers и modals fullscreen (100vw × 100dvh, no border-radius)
Implementation:
src/components/layout/Sidebar.tsx
- Extracted SidebarContent (logo + nav + user block) для DRY
- Desktop <Sidebar /> wraps SidebarContent в hidden lg:flex aside
- New <MobileSidebar open onClose /> — Sheet с тем же содержимым,
260px wide, slides from left
- SidebarLink принимает onClick → drawer auto-close при navigate
src/components/layout/TopBar.tsx
- Optional onMenuClick prop — рендерит hamburger button (Menu icon
из lucide-react) с lg:hidden
- VersionBadge скрыт <md (768px) — diagnostic info, не critical UX
src/routes/__root.tsx
- useState mobileNavOpen, передаём в MobileSidebar + TopBar
src/ui/components/dialog.tsx
- SIZE_CLASSES получили prefix (arbitrary Tailwind v4
breakpoint per handoff exact 880px). На mobile <880px modal становится
fullscreen (inset-0 w-full h-full no rounded), ≥880px — centered с
translate + max-w из SIZE_CLASSES.
src/ui/components/sheet.tsx
- size variants: sm:max-w-* → min-[880px]:max-w-*. На mobile <880px
sheet берёт w-full (fullscreen drawer per handoff).
src/components/record/RecordDrawer.tsx
- max-width переключатель 520/880 теперь применяется только ≥880px.
На mobile drawer всегда fullscreen.
src/ui/components/language-switch.tsx
- Display fallback: opt.short → opt.label → uppercase id.
Previously показывал id ('ru-RU', 'en-US') когда short не был задан —
теперь использует label ('RU', 'EN') как fallback.
Browser-verified в preview viewport 375×812:
- Hamburger ☰ visible, click открывает Sheet с nav items
- Backdrop fade + slide-from-left animation
- TopBar fits в 375px (RU/EN compact, Sign in visible)
- LoadingBlock + Alert text-wrap correctly
Staging показывал badge 'local · {commit}' вместо ожидаемого 'dev'.
Причина: Dockerfile не пробрасывает process.env.CI через ARG. Vite
видит только что было передано через --build-arg в .gitlab-ci.yml
(GIT_COMMIT/GIT_TAG → CI_COMMIT_SHORT_SHA/CI_COMMIT_TAG).
Fix: использовать CI_COMMIT_SHORT_SHA как primary CI detect — он всегда
проходит через Dockerfile ARG (см. ordinis-admin-ui/Dockerfile). Это
canonical GitLab CI signal — always set в любом pipeline.
process.env.CI остаётся как secondary check для других CI систем
(local CI runners, GitHub Actions если когда-то) где CI_COMMIT_SHORT_SHA
не set но CI=true.
Per handoff Stage 3.4 polish list (Records/Relations/Fields/JSON/Events/
History tabs).
Events tab — раньше был redirect к /audit?dict=name. Теперь embedded:
- useAudit({dictionaryName, size: 20}) → last 20 entries
- 4-col compact table: time / action / businessKey / user
- Empty state когда нет событий
- Bottom link → /audit с filter для full diff view
JSON tab — раньше был plain <pre>. Теперь:
- Regex-based syntax highlight (keys=accent, strings=green, numbers=warn,
booleans=pink, null=mute italic)
- Copy-to-clipboard button с visual feedback
- Bundle cost: 0 (нет Monaco). Если потребуется EDIT — Monaco lazy
через React.lazy в Stage 3.x followup.
Fields tab — пока read-only table остаётся. Inline edit требует backend
PATCH /dictionaries/{name}/schema endpoint; deferred.
History tab — placeholder remains. Требует backend changelog endpoint;
deferred.
TS strict + 116 tests pass.
Реальные измерения через 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.
Закрывает эту тему окончательно. После merge в main CI анализирует
conventional commits с последнего tag'а, бампит package.json + CHANGELOG.md
и пушит git tag vX.Y.Z. Tag pipeline далее собирает images и ждёт
manual gate на trigger-deploy-prod.
Что добавил:
- ordinis-admin-ui/.releaserc.json — config (commit-analyzer, release-notes,
changelog, npm[no-publish], git, gitlab). branches: ['main']. Маппинг
conventional-commit types к bump levels.
- ordinis-admin-ui/package.json — devDeps: semantic-release@24.2 + 6 plugins.
- .gitlab-ci.yml — new 'release' stage + release job:
- needs: trigger-deploy-staging (release ТОЛЬКО после зелёного staging)
- image: node:22-alpine + pnpm@9.15.4
- GL_TOKEN из CI variable GITLAB_TOKEN (semantic-release/gitlab требует
именно GL_TOKEN env name)
- allow_failure: true (нет релизных commits = OK, не блокирует pipeline)
- RELEASE.md — operator docs:
- One-time setup: создать Project Access Token + GITLAB_TOKEN CI var
- Commit conventions table (feat→minor, fix→patch, breaking→major)
- Skip release (use chore: type или [skip ci])
- Dry-run command для local validation
Prod safety: trigger-deploy-prod остаётся manual (when: manual). Автоматизация
ТОЛЬКО tag-создания, не deploy. Tag → CI runs → human кликает Deploy.
ACTION REQUIRED от user (one-time):
1. GitLab → Settings → Access Tokens → создать Project Access Token
scopes: write_repository + api, role: Maintainer
2. GitLab → Settings → CI/CD → Variables → GITLAB_TOKEN (Masked, Protected)
Без этого release job будет fail'ить (но pipeline не покраснеет — allow_failure).
Stale package.json создавал ложное впечатление rollback'а: staging
показывал "v1.2.0" хотя последний tag — v1.2.2 (package.json не bump'ился
со времён v1.2.0 release).
Vote A — branch builds НЕ используют package.json как version label.
Vite определяет channel:
serverTag != none → что прод/staging RUNS
clientTag → что build'ил CI tag pipeline (CI_COMMIT_TAG set)
CI без tag → 'dev' literal (staging / branch CI build)
локально → 'local' literal (pnpm dev)
Detection через новый __APP_CI__ define из process.env.CI (GitLab сетает
CI=true). Local pnpm dev: CI undefined → channel='local'.
package.json.version всё ещё инжектится как __APP_VERSION__ и видна в
tooltip badge'а как 'floor vX.Y.Z' — не как primary label.
Files:
- vite.config.ts: + APP_CI from process.env.CI
- src/vite-env.d.ts: + __APP_CI__ declare
- src/components/version/useAppVersion.ts: + clientCI
- src/components/version/VersionBadge.tsx: channel logic вместо fallback
Verify all three modes:
local → 'local · {commit}'
CI branch → 'dev · {commit}'
CI tag v1.3.1 → 'v1.3.1 · {commit}'
Tests: 116 pass.
Dictionary editor route теперь имеет TabBar (handoff design Stage 3.4):
Records | Relations | Fields | JSON | Events | History
URL-synced через ?tab= (default: records). Backward-compat: старый
?view=hub auto-remap'нется в ?tab=relations при mount'е.
Tab contents:
- records (default): существующий records table + filters + edit modal
flow — без изменений, обёрнут в conditional render
- relations: DictionaryHubView (был раньше при view=hub)
- fields: schema properties summary — name/type/required/unique/i18n/FK/desc
- json: pretty-printed schemaJson read-only
- events: link к /audit с pre-filled dict filter
- history: placeholder (schema version timeline — backend endpoint pending)
EditorTabBar — inline component с handoff styling (border-b border-line +
active accent border + font-semibold), -mb-px overlap для clean look.
Hub view's neighbor cards теперь search={tab:'relations'} вместо
view='hub' (consistent с new param).
DictionaryDependentsPanel рендерится только в Records tab — auto Hub view
в Relations tab уже включает dependents через свой layout.
Tests: 116/116 PASS, build green, TS clean.
Zimin A.N.