fix(ui): QA report P3/P4 batch — 7 cosmetic/UX bugs

QA report cleanup (после P1/P2 ship'нутых в v2.31.4):

- **BUG-009**: Excel/SQL export форматы получили явный «скоро» badge поверх
  opacity-only disabled state. Title attribute оставлен.
- **BUG-010**: «Доступ актора» (audit scope column) переименован в «Scope» —
  компактнее, не переносится на 2 строки.
- **BUG-011**: Все audit table headers получили title attribute → hover
  tooltip когда text truncate'ится («ИЗМЕНЕН…» → full «Изменения»).
- **UX-001**: Scope chips в /dictionaries теперь показывают ✓ glyph когда
  selected → визуально clear что multi-select. Aria-label расширен:
  «Фильтр по области (можно выбрать несколько)».
- **UX-002**: Breadcrumb segments получили title attribute → hover показывает
  full label когда truncate'ится в narrow viewport.
- **UX-003**: При смене вкладки в редакторе справочника (records → relations
  и т.п.) URL params q/scopes сбрасываются — раньше search фильтр оставался
  применённым после возврата на records.
- **UX-004**: TimeTravel slider boundary метки получили 2-digit year:
  «05.05.26» вместо «05.05» — disambiguates конец декабря / начало января.
  Title attribute exposes full локальную дату.
- **UX-009**: «Удалить» button в RecordDrawer переименован в «Закрыть запись»
  — same action как row context menu «Закрыть» (bitemporal close, не truly
  delete). Consistent labeling across UI.
This commit is contained in:
Zimin A.N.
2026-05-16 00:09:41 +03:00
parent 55ac362a11
commit cb8a229adf
7 changed files with 50 additions and 20 deletions
@@ -208,15 +208,21 @@ export function ExportModal({
disabled={f.disabled}
title={f.reason}
className={cn(
'flex flex-col items-center justify-center gap-0.5 h-[68px] rounded-md border transition-colors',
'relative flex flex-col items-center justify-center gap-0.5 h-[68px] rounded-md border transition-colors',
format === f.id
? 'border-ink bg-surface text-ink ring-1 ring-ink'
: 'border-line bg-surface text-ink-2 hover:border-line-2 hover:bg-surface-2',
f.disabled && 'opacity-40 cursor-not-allowed hover:bg-surface hover:border-line',
f.disabled && 'opacity-60 cursor-not-allowed hover:bg-surface hover:border-line',
)}
>
<span className="text-title-md font-semibold leading-none">{f.label}</span>
<span className="text-mono text-mute leading-none">{f.ext}</span>
{/* QA BUG-009: явный «скоро» badge вместо опоры только на opacity. */}
{f.disabled && (
<span className="absolute top-1 right-1 text-[9px] font-semibold text-mute bg-surface-2 px-1 rounded-sm uppercase tracking-wider">
{t('export.format.soon', { defaultValue: 'скоро' })}
</span>
)}
</button>
))}
</div>
@@ -48,9 +48,11 @@ export function TopBar({ onMenuClick }: { onMenuClick?: () => void }) {
return (
<span key={i} className="flex items-center gap-2 min-w-0">
{i > 0 && <span className="text-mute text-title-md font-light">/</span>}
{/* QA UX-002: title attribute → hover tooltip когда truncate. */}
{crumb.to && !isLast ? (
<Link
to={crumb.to}
title={typeof crumb.label === 'string' ? crumb.label : undefined}
className={
isFirstOfTwoPlus
? 'text-cell text-mute hover:text-ink truncate transition-colors inline-flex items-center gap-1'
@@ -61,7 +63,10 @@ export function TopBar({ onMenuClick }: { onMenuClick?: () => void }) {
{crumb.label}
</Link>
) : (
<span className={isLast ? 'text-ink font-semibold truncate' : 'text-ink-2 truncate'}>
<span
title={typeof crumb.label === 'string' ? crumb.label : undefined}
className={isLast ? 'text-ink font-semibold truncate' : 'text-ink-2 truncate'}
>
{crumb.label}
</span>
)}
@@ -571,9 +571,15 @@ function TimelineSlider({
* чтобы две DD.MM метки ~ 36px @ text-cap не пересекались на типичной
* ширине трека ~340px. */}
<div className="relative h-4 mt-1 text-mono text-cap text-mute">
{/* QA UX-004: добавлен 2-digit year к boundary меткам — раньше «05.05»
* без года был неоднозначным на конец декабря / начало января. */}
{pct > 12 && (
<span className="absolute left-0">
<span
className="absolute left-0"
title={new Date(range.min).toLocaleDateString()}
>
{new Date(range.min).toLocaleDateString(undefined, {
year: '2-digit',
month: '2-digit',
day: '2-digit',
})}
@@ -586,8 +592,12 @@ function TimelineSlider({
{dateLabel}
</span>
{pct < 88 && (
<span className="absolute right-0">
<span
className="absolute right-0"
title={new Date(range.max).toLocaleDateString()}
>
{new Date(range.max).toLocaleDateString(undefined, {
year: '2-digit',
month: '2-digit',
day: '2-digit',
})}