Дизайн undo / redo: что отменяемо, как, до куда

Действуй как UX-инженер. Undo — это самое мощное «не страшно нажать» в продукте. Если undo работает, юзер пробует больше. Если нет — каждое действие становится «уверен ли я?»

Приложение: {{app_type}} Destructive actions: {{destructive_actions}}

Закон undo: 4 принципа

1. Undo > Confirm. Лучше дать сделать и отменить, чем спрашивать каждый раз. «Are you sure?» — это failure of design.
2. Undo discoverable. Cmd+Z / Ctrl+Z всегда. Меню Edit → Undo всегда. Кнопка undo видна для destructive actions (delete row → toast «Undo»).
3. Undo предсказуем. Юзер должен знать, что отменится. «Undo» без указания «что именно» — страшно.
4. Не всё undoable. Send email, charge payment, delete account — это требует confirm, не undo. Undo там обманчив.

Что должно быть undoable (yes)

• Все локальные изменения content: typing, formatting, добавление / удаление элементов.
• Move / resize / reorder.
• Bulk-actions: select 10 items → delete → undo возвращает все 10.
• Property changes: изменил title, цвет, status — undoable.
• Import / paste: добавил 50 элементов pas-ом → undo убирает их.

Что НЕ должно быть undoable (no — use confirm)

• Sent messages / emails. Они уже у получателя.
• Charges / payments. Деньги уже сняты.
• Account / org deletion. Каскадные последствия.
• External API calls с эффектом (publish, deploy, trigger webhook).
• Permanent file deletion (после empty trash).

Для этих — confirm dialog с type-to-confirm (см. промт destructive-action-confirm).

Гибрид: undo с time window

Для условно-destructive (delete row, archive, remove from team):

• Действие выполняется мгновенно.
• Toast: «Item deleted. [Undo]» на 8-10 секунд.
• После окна — необратимо (или soft-delete с restoration через 30 дней в trash).

Это soft-confirm. Лучше confirm dialog для большинства случаев.

Scope (за чем undo помнит)

Per-action (один step)

• Cmd+Z отменяет последнее action.
• History — stack глубиной N (50-100 для editor, 20-30 для config).
• Cmd+Shift+Z (или Ctrl+Y) — redo.

Per-session

• Полная история с момента открытия документа.
• Time-travel UI: «Restore to 5 minutes ago» с timeline.

Persistent (between sessions)

• Только для critical apps (Figma, Notion).
• Storage cost — учитывай.

Timeline UI (опционально, для editor)

History  [×]
─────────────
Now
├ 12:34  Added section "FAQ"
├ 12:31  Renamed "Title" → "Welcome"
├ 12:28  Changed colour to #FF5733
├ 12:25  Inserted image
├ 12:20  Created document

• Список actions с time-stamp.
• Click на action → restore to that state (с подтверждением: «This will undo 4 changes»).
• Group похожих actions: «Edited text (5 changes)» вместо 5 строк.

Что показывать при undo

• Toast / status: «Undid: Renamed Title» (на 2 секунды).
• Visual flash: subtle highlight на восстановленном элементе (1-2 sec).
• Status indicator: «Saved» снова, но показав «Edit reverted».

Что показывать при redo

• Аналогично undo: «Redo: Renamed Title».

Edge cases

• Undo после autosave: sat history persists, undo возвращает state, новый save сохраняет undone state.
• Undo после collab edit: если другой юзер изменил тот же объект — undo может конфликтовать. Покажи warning: «Your undo conflicts with Alex's edit. [Force undo] / [Cancel]».
• Undo за horizon: если в stack 50 шагов и юзер хочет 55-й — «Reached end of history. Earlier changes are not recoverable.»
• Undo с побочным effect (изменение, которое отправило webhook): не undo'аемо, помечай как «can't undo» в UI.

Keyboard

Visual feedback при undo

• НЕ перерисовывай весь document.
• Анимация: восстанавливаемый элемент briefly highlighted (300-500ms accent border).
• Если undo deletes — элемент исчезает с fade (200ms).
• Если undo adds — элемент появляется с fade-in (200ms).

A11y

• Кнопка Undo / Redo в toolbar — <button> с aria-label «Undo last action».
• Disable когда history empty: disabled + aria-disabled="true".
• Screen reader announce при undo: «Undid: <action description>» через aria-live.

Формат вывода

Scope

• Глубина history: N actions
• Per-action / per-session / persistent: какой выбран и почему
• Что НЕ undoable (список)

Triggers

• Keyboard
• Кнопка(и) в UI: где
• Toast с undo: для каких actions, на сколько секунд

Timeline UI (если есть)

• Где живёт
• Что показывает
• Группировка

Visual feedback

• При undo: что юзер видит
• При redo: то же

Edge cases

3-5 пунктов: collab conflict / horizon / autosave / etc.

Анти-список (что requires confirm вместо undo)

Список destructive_actions с обоснованием.

A11y

ARIA + keyboard + announce.

Anti-patterns (НЕ делать)

• ❌ Undo, который не работает на text editing внутри input. Это нативное browser-undo — не ломай.
• ❌ «Are you sure?» на каждое delete вместо undo-toast. Юзер привыкает к click-through.
• ❌ Undo без redo. Юзер случайно отменил — не может вернуть.
• ❌ Undo всей сессии без warning. Click → потеря часа работы.
• ❌ Кнопка undo, которая иногда работает иногда нет (зависит от типа action). Юзер не доверяет.
• ❌ Cmd+Z отключен на странице (например, в form'е). Это убивает workflow.
• ❌ Undo на «sent message». Email уже улетел — обманывать не надо.
• ❌ History без timestamps. Юзер не знает, что отменяет.
• ❌ Time-travel без preview. Restore to «10 min ago» без показа — что было — страшно нажимать.