Моб-флоу /upgrade — пересбор, не косметика

Подзадачи 9 пунктов

• ✓
  Декомпозиция UpgradePage.vue на 9 компонентовБыло 946 строк → стало 679 + 9 файлов в /components/upgrade/. Сделано до пересборки моба.
• ✓
  Эскиз нового моба согласован с заказчиком26.05 в TG: 2 таба (Ставка/Цель) + sticky-top gauge + bottom-sheets для ленты и полной диаграммы.
• ✓
  Создан worktree feat/upgrade-mobile-tabsНе в живой папке ~/apps/skins-arena (там master). Отдельный worktree в ~/work/sa-upgrade-mobile.
• ✓
  Первый билд показал пустые плиты — отвергнутСкрины 26.05 ушли с empty state — заказчик ругнулся. Память: «Review own screenshots before sending».
• ▶
  Пересборка по согласованному эскизуСейчас: 2 таба, sticky-top gauge всегда виден, контент таба заполняет экран без пустоты.
• Sticky-CTA «Прокачать» + мини-гейдж в шапкеВиден на любом табе, тап по мини-гейджу → полный bottom-sheet.
• FAB-кнопка 🔥 → bottom-sheet с лентой победКнопка справа в таб-баре, ленту достаём по тапу — не в первом экране.
• Скрины каждого таба с реальным наполнением (Playwright)Скин в ставке, цель выбрана, шанс 62.7%, кнопка «Прокачать» активна. Не пустой юзер.
• Мердж в master + QA на продеЖдём OK заказчика на скрины → git merge → npm run build → swap dist.

Тест-план — пошагово, для проверки заказчиком 🧪

Когда я скажу «готово» — проходишь эти шаги. Каждый шаг = одно действие + что ожидается увидеть. Если что-то не сходится — пиши «шаг 3 не сходится: вместо X вижу Y».

1. Открой https://skins-arena.club/upgrade на iPhone (или в Chrome DevTools mobile mode 390×844).

   Ожидаемое: сверху видны header + sticky-блок с мини-гейджем (кружок «—%») + кнопка «Прокачать» (серая, disabled) + строка табов [Ставка] [Цель] и иконка 🔥 справа.

   Если видишь длинную ленту побед или непонятные блоки — шаг провален.
2. Тапни таб «Ставка».

   Ожидаемое: блок «Ваша ставка (0/4)» с подсказкой «Выбери из инвентаря ниже» + горизонтальный грид «Мои скины» с фильтрами. Без пустых чёрных плит.
3. Тапни первый скин в инвентаре.

   Ожидаемое: карточка прыгает в «Ваша ставка» (1/4), счётчик в табе становится «Ставка ●1», в sticky-шапке мини-гейдж заполняется на N%, кнопка «Прокачать» активируется.
4. Переключись в таб «Цель».

   Ожидаемое: блок «Желаемый предмет» (пустой) + сетка целевого каталога с фильтрами цены, сортом, редкостью. На карточках виден % шанса под текущую ставку.
5. Тапни целевую карточку, потом тапни мини-гейдж в шапке.

   Ожидаемое: цель выбрана, sticky-шапка показывает «1 скин → MP7» + 62.7%. После тапа по мини-гейджу — выезжает bottom-sheet с полной диаграммой и дублирующей кнопкой «Прокачать».
6. Тапни иконку 🔥 в таб-баре.

   Ожидаемое: выезжает bottom-sheet «Удачные апгрейды» — лента побед. Закрывается свайпом вниз или тапом за пределами.

Тест-план — десктоп при сужении до ~1280px (отдельный пункт)

1. Открой /upgrade на десктопе → сузь окно браузера до 1280px.

   Ожидаемое: 3-колоночная раскладка (Ставка / Диаграмма / Цель) перестраивается без наезда и без скролл-бара по горизонтали.
2. Продолжай сужать вплоть до 1024px.

   Ожидаемое: при 1024 переход на 2-колонку (ставка/цель + диаграмма выше или ниже). Каталог снизу.
3. Сузь до 768px (планшет).

   Ожидаемое: переключение на моб-режим — табы.

Открытые вопросы 3

История