Перейти к основному содержимому

ADR 0211 — Одна навигация: боковая панель поглощает рельс проекта

Статус​

Accepted. 2026-10-03 (AT-404; решение владельца от 03.10: "A barra navegável à esquerda que pode ser expandida passa a ser a ÚNICA; retire a outra barra de navegação, mas contemple nesta todos os itens da barra excluída"). Пересматривает ADR 0126 — который остаётся принятым и не редактируется — и RN-201.

Контекст​

Со времён ADR 0126 вкладки проекта существовали в ДВУХ местах: вертикальный рельс шириной 180px (ProjectRail.tsx, монтируемый в ProjectPage.tsx) и список проекта в боковой панели (LinhaDeAba, RN-196). CLAUDE.md объявлял это пробелом ("reconciliar é decisão de produto à parte"), вместе с ценой рамки: 492px во вкладке Código (264 боковой панели + 180 рельса + 48 CodeShell).

Измерено до изменения: то, что было только у рельса: три ГРУППЫ с заголовком; отмеченная АКТИВНАЯ вкладка (aria-selected); пять счётчиков (Insights, PRs, Aprovações, Backlog, Arquitetura), каждый на своей вкладке и никогда не суммируемые, — боковая панель показывала лишь Aprovações из сводки дашборда; клавиатура (ArrowDown/ArrowUp/Home/End с переходом по кругу, пересекая группы); прокрутка активной в видимую область; вертикальный role="tablist"; и на телефоне (RN-643) горизонтальная прокручиваемая панель над панелью содержимого. У боковой панели было, а у рельса нет: свёрнутый проект в рельсе шириной 62px, выдвижная панель телефона и ссылка на другое окно браузера.

Решение​

  1. Боковая панель — единственная навигация проекта. ProjectRail.tsx, его CSS и монтирование в ProjectPage.tsx уходят. Список проекта в боковой панели становится AbasDoProjeto (apps/web/src/routes/AbasDoProjeto.tsx), со всем, что было у рельса: группы из GRUPOS_DO_PROJETO, активная вкладка, счётчики по вкладкам, клавиатура, вертикальный tablist, названный по проекту, roving tabindex и активная, прокрученная внутрь. Каждая вкладка — ссылка на /projects/<id>?tab=<chave>.
  2. У пяти счётчиков ОДИН источник, без нового запроса. Пять очередей начинают читаться одним хуком, useContagensDoProjeto (apps/web/src/lib/contagens-do-projeto.ts), который рамка использует для панели "precisa de você" (RN-467), а боковая панель — для чисел. Те же queryKey, дедуплицированные. Боковая панель включает его лишь пока рамка проекта СМОНТИРОВАНА — только в ней существовал рельс; на другом экране проекта (Sessão, например) и для закрытых проектов остаётся число Aprovações из сводки, как прежде. Бюджеты *.orcamento.test.tsx проходят без изменения какого-либо предела.
  3. Активная вкладка приходит из рамки. ProjectPage публикует вкладку, которую показывает (publicarAbaAtiva), — URL недостаточно, потому что панель "precisa de você" меняет вкладку, не проходя через router. Боковая панель ЗАПРАШИВАЕТ у рамки кликнутую вкладку (pedirAba, событие, а не состояние, чтобы две рамки никогда не тянули друг друга) и переходит с ?tab=. Ссылка проекта без ?tab= возвращается к вкладке по умолчанию.
  4. В свёрнутом виде — всплывающая панель. В рельсе шириной 62px квадрат ОТКРЫТОГО проекта открывает всплывающую панель с теми же вкладками (закрывается по Esc, при выборе и по второму клику), не разворачивая боковую панель. Остальные проекты по-прежнему разворачиваются.
  5. На телефоне — выдвижная панель. Горизонтальная панель RN-643 уходит; вкладки живут в выдвижной панели, которая закрывается при выборе.
  6. Рельс шириной 48px CodeShell остаётся: это активность редактора, а не навигация проекта.

Последствия​

  • Рамка вкладки Código уменьшается с 492px до 312px при развёрнутой боковой панели (264 + 48) и до 110px в свёрнутом виде (62 + 48).
  • Пробел "вкладки существуют в двух местах" закрывается.
  • Смена вкладки требует развёрнутой боковой панели, всплывающей или выдвижной панели. Тот, кто сворачивал боковую панель и переходил через рельс, начинает пользоваться всплывающей панелью.
  • Список боковой панели теряет <Link> router для каждой вкладки: это <a> с перехваченным кликом, который вызывает navigate. Средняя кнопка/Ctrl по-прежнему открывают в другом окне.
  • rail.ariaLabel уходит из обоих языков; список называется sidebar.projects.tabsAriaLabel ("Abas de {{name}}").