Кастомное лого квадратное, и в фавиконе показывалось с острыми углами. Теперь
лого прогоняется через canvas со скруглённым клипом (radiusRatio 0.3 — как
rounded-linear-lg 12px на плитке 40px в хедере) и отдаётся скруглённым PNG.
При сбое canvas (taint/нет 2d-контекста) — фолбэк на сырой лого. Применяется и
в кабинете (useBranding), и на лендинге (QuickPurchase); буквенная монограмма
уже скруглена через rx.
У лендинга есть собственное поле background_config (тема на каждый лендинг).
Если оно не заполнено, лендинг показывал голый bg-dark-950, тогда как кабинет
всегда рисует глобальную тему-анимацию (BackgroundRenderer → getAnimationConfig).
Теперь: задан background_config → своя тема лендинга (StaticBackgroundRenderer),
пусто → глобальная тема кабинета (BackgroundRenderer). Обёртка больше не красится
непрозрачным bg-dark-950 — фон рисуется порталом за контентом поверх body #0a0f1a,
ровно как в AppShell. Глобальный конфиг анимации тянется из публичного эндпоинта.
Публичный лендинг (QuickPurchase) рендерится вне AppShell, а useBranding
с заголовком/иконкой завязан на авторизацию — поэтому на лендинге вкладка
оставалась с дефолтным «Loading...» из index.html (тайтл обновлялся только при
заданном meta_title) и без favicon (href="data:,").
- index.html: нейтральная дефолтная иконка-монограмма вместо пустого data-URI
и тайтл «VPN» вместо «Loading...».
- QuickPurchase: тайтл берётся из meta_title || title лендинга; favicon
ставится из брендинга (кастомный лого-блоб или буквенная монограмма), брендинг
тянется из публичного эндпоинта.
- favicon-хелперы вынесены в utils/favicon.ts; useBranding переведён на них
(DRY) + добавлен буквенный фолбэк, чтобы иконка была всегда.
- Тип LandingTariff дополнен is_daily/daily_price_kopeks (синхронно с бэком).
Мульти-тариф блок рендерился даже при пустом списке подписок (пустой
массив truthy) — показывал заголовок «Подписки» и кнопку покупки, которая
дублировала кнопку из блока «нет подписок» (триал-оффер). Получалось две
одинаковые «Посмотреть тарифы и купить подписку».
Теперь мульти-тариф блок рендерится только когда подписки реально есть
(length > 0), а блок «нет подписок» показывает триал (если доступен) и
ВСЕГДА одну явную кнопку покупки — заодно закрывает случай «нет подписок и
триал недоступен» (раньше его прикрывал пустой мульти-тариф блок).
В мульти-тарифе кнопка «+ Купить ещё подписку» висела всегда, когда есть
хоть какая-то подписка — даже если это только триал или всё истёкшее.
Теперь она показывается только при наличии НАСТОЯЩЕЙ платной активной
подписки (hasActivePaid: не триал + status active/limited).
А «Посмотреть тарифы и купить подписку» из тусклой (пунктир + opacity-60,
спрятана в триал-блоке) стала ЯВНОЙ primary-кнопкой (solid accent) и
показывается, когда платной активной подписки ещё нет (триал/истёкшие/
новый юзер) — мы продаём подписки, путь к покупке должен быть очевиден.
Затронуты Dashboard и Subscriptions. Добавлен ключ subscriptions.browsePlans
(раньше рендерился только inline-фолбэк) в 4 локали.
Локальный StatCard держал иконку в чипе p-2, который подстраивался под
размер иконки (а часть иконок передавалась без className) — отсюда разные
по размеру чипы и «кривые» иконки. Привёл к виду карточек статистики продаж:
лейбл сверху, фиксированный чип h-9 w-9 с принудительным размером иконки
([&>svg]:h-5 w-5 нормализует все иконки разом), значение в тон чипу. Рамку
и subValue сохранил.
Новое приложение INCY (incy://import/{url}) не открывалось на роутах
/add и /connect: DeepLinkRedirect держит хардкод-allowlist разрешённых
схем (happ, hiddify, v2rayng, streisand…), и isValidDeepLink резал
incy:// как неизвестную схему. Добавил incy:// в список.
Бэкенд не трогаю: _create_deep_link / _get_url_scheme_for_app собирают
deep-link из urlScheme Remnawave-конфига полностью обобщённо (без списка
имён), incy:// он строит сам. Mini-app путь (redirect.html) тоже generic.
- «Активные подписки» теперь с % (нетто-изменение за период: новые
платные − истёкшие; обычная дельта снимка была бы всегда 0).
- Новая карточка «Новые платные подписки» (с дельтой период-к-периоду).
- «Доход» больше не включает ручные пополнения (бэк отвязал).
- Убрал «Средняя длит.» из триалов — была вечный 0 и непонятна.
- Сводка 9 карточек: сетка 2/3 с orphan-fill на мобайле, без пустот.
Новая вкладка в статистике продаж:
- success-rate платежей (оплачено/создано) — общий + по каждому шлюзу с
цветными барами (зелёный ≥90%, жёлтый ≥70%, красный ниже);
- кол-во попыток оплат;
- «Неудачные покупки» — внутренние откаты при ошибке покупки (сигнал
надёжности, не возвраты).
Данные из нового эндпоинта /payment-health. Шлюзы без активности не
показываются. Карточки 1/3 (без сирот), адаптив. 4 локали.
Возвраты для оператора всегда 0 (реальные возвраты только Apple/Tribute,
которых нет) — постоянно пустые карточки только путают. Сводка вернулась
к 8 карточкам (grid 2/4). Убрал также неиспользуемый invertDelta из
StatCard и ключи refunds из локалей.
Допы (5 карточек) рисовали 4+1: orphan-fill из двух arbitrary-вариантов
конфликтовал по специфичности — правило :last-child:nth-child(odd) бьёт
ресет :last-child, поэтому 5-я карточка тянулась на 2 колонки и на
десктопе. Заменил на один mobile-вариант max-lg:, как в AdminRemnawave:
десктоп — 5 в ряд, планшет/мобайл — 2 колонки + последняя на всю ширину.
Сводку тоже перевёл на lg:grid-cols-5 (было sm) — на планшете 5 колонок
давали ~115px и резали суммы; теперь до десктопа 2 колонки.
Две карточки — количество и сумма возвратов за период (красный тон).
Сетку сводки перевёл на 2/5 (10 карточек делятся ровно, без пустых
ячеек). StatCard получил invertDelta: для «меньше — лучше» метрик рост
красится в красный, падение в зелёный (стрелка по факту). 4 локали.
Сводка (8 карточек) была 2/3/4 колонки — на 3-колоночном брейкпоинте
последний ряд оставлял пустую ячейку. Перевёл на 2/4 (8 делится ровно).
Допы (5 карточек) тянули сироту на 2- и 3-колоночном — теперь 2/5 с
orphan-fill: последняя нечётная карточка занимает всю ширину на мобайле
(паттерн как в новостях/подписках).
Тёмный DateField теперь везде, где был браузерный <input type="date">: фильтр
периода в Трафике, диапазон дат в Платежах и Аудит-логе, срок действия промокода.
Единый вид во всём кабинете. (datetime-local не трогал — там нужно ещё и время.)
Статистика по умолчанию открывается за текущий месяц с 1-го числа до сегодня
(month-to-date), а не за фиксированные 30 дней. Добавлена кнопка «Этот месяц»
в селектор периода; util getMonthToDateRange/isMonthToDate.
- StatCard: лейбл сверху, чип+значение в одной строке (чип центрируется ровно по
значению, дельта ушла под строку) — иконки больше не «плавают» по вертикали
из-за разной высоты карточек.
- «Активные подписки»: TicketIcon вместо SubscriptionIcon (та визуально как искра
и дублировала «Новые триалы»).
- StatCard: иконка в мягком цветном чипе (tone success/accent/warning/…) в духе
статистики Remnawave; дельта под значением. Обратно совместимо (valueClassName).
- Карточки сводки получили осмысленные иконки (доход/подписки/триалы/конверсия/
продления/допы/пополнения) и цветовые тоны.
- Скачок при переключении периодов убран: на все запросы статистики добавлен
placeholderData: keepPreviousData — старые данные остаются на экране, пока
грузятся новые, без вспышки скелетона и прыжка вёрстки.
formatWithCurrency по умолчанию даёт 2 знака без разделителей разрядов
(«2521000.00 ₽») — длинно и режется. Для итоговых сумм сводки (доход, доход с
допов, ручные пополнения) показываем целые рубли.
Карточки сводки резали суммы («252…», «100.0…»): на десктопе их было 8 в ряд
(слишком узко), а дельта стояла в той же строке и доедала место.
- Дельта переехала ПОД значение — значение получает всю ширину карточки.
- Сетка сводки: убрал xl:grid-cols-8, максимум 4 в ряд (карточки шире).
StatCard получил опциональную дельту (стрелка + %), а страница статистики тянет
сводку ещё и за предыдущий равный период и считает рост/падение для метрик
периода: выручка, новые триалы, продления, доход с допов, ручные пополнения.
Для «всего времени» сравнение не показывается (не с чем сравнивать).
The My Subscriptions list is a 2-col grid on sm+, so a single subscription (e.g. one tariff in multi-tariff mode) left an empty cell. Stretch the last card to span both columns when it's the lone one in its row — same orphan-fill used for the news grid and admin stat cards.
Jumping only happened on mobile (the wrap reshuffled when speeds changed width); desktop fits on one line and never jumped. So keep the 3 fixed rows for mobile (sm:hidden) and restore the original single flex-wrap row for desktop (hidden sm:flex). On mobile, download/upload now sit tight in a flex row (gap-4) instead of a full-width 2-col grid that looked too spread out.
The metrics sat in one flex-wrap, so when realtime speeds change width (Kb/s<->Mb/s, large values) elements reflowed and jumped between lines, and the card height shifted. Split into 3 fixed rows: processor (CPU load + RAM), traffic (down/up), versions (remnanode + xray). Traffic uses a 2-column grid so a wide value never pushes its sibling; tabular-nums keeps digit widths constant.
The panel marks each node version with its product logo. Add an XrayIcon (the Xray core brand pinwheel, custom SVG like RemnawaveIcon) and put RemnawaveIcon before the remnanode version + XrayIcon before the xray version, matching the original node rows. Drop the redundant 'xray' word since the logo conveys it.
Checked the live panel — every node metric carries an icon there, but our card showed RAM% and load average as bare text while the speeds had icons. Add MemoryIcon before RAM% and CpuIcon before the load average so the metrics row matches the original.
Give the inbound/outbound tag min-w-0 flex-1 so a long tag shrinks and ellipsizes instead of pushing the byte counters off-screen on narrow viewports; tighten the counter gap.
Drop the separate Traffic tab and fold its per-node inbound/outbound breakdown into the Nodes tab: click a node card to expand its traffic breakdown, click again to collapse (chevron indicator; action buttons stop propagation). Realtime totals (down/up/Σ) move to a compact line above the node list. Realtime stats now load on the Nodes tab.
The 2-column grid inside the max-w-2xl container made each gift card a narrow ~330px half. Gift cards are content-rich (header, code, share preview, buttons), so stack them single-column full-width — they now stretch to the container width on every breakpoint.
Each Remnawave user status now gets a distinct icon instead of the same people glyph: ACTIVE -> check-circle, DISABLED -> prohibit, LIMITED -> gauge, EXPIRED -> clock (people icon as fallback for unknown statuses).
The panel's provider.faviconLink is the provider's site URL (e.g. https://waicore.com/), not an image, so rendering it directly as <img src> failed and onError hid it. Derive the real favicon image from the URL's hostname via Google's favicon service, like the panel does.
Replace the user-facing 'RemnaWave' spelling with 'Remnawave' across all locale values (en/ru/zh/fa, 67 strings), t() display fallbacks, and code comments. Translation keys (refreshRemnaWave, ...) and code identifiers (RemnaWaveService, setRemnaWaveUuid, ...) are left untouched.
- Render the provider favicon in the node badge (new provider_favicon / provider_name fields), with graceful fallback.
- Mobile-friendly node card: stop the versions block from shifting right on wrapped rows, truncate long addresses, cap the provider badge.
- Give node-summary cards (total/online/offline/disabled) and traffic-period cards (2d/7d/30d/month/year) distinct, meaningful icons instead of all-the-same globe / bar-chart.
- Show traffic as 'used / limit' (e.g. 2.35 TB / ∞).
- Route every icon through the central barrel (drop the direct react-icons/pi import).
- Build the share deep-link as t.me/<bot>?start=GIFT_<code> (literal underscore). The old GIFT%5F encoding was passed to the bot verbatim by Telegram, so its startswith('GIFT_') never matched and activation silently failed.
- Source the bot username from the runtime branding config (env var is only a fallback), so the 'activate via bot' line no longer vanishes on builds without VITE_TELEGRAM_BOT_USERNAME.
- Widen the page on desktop (max-w-2xl) and show sent gifts in a 2-col grid; it was cramped to a mobile column.
- Replace the remaining hand-written SVG icons with the central barrel.
Audit-driven sweep: replaced 168 hand-written inline <svg> icons across 77
files with the central Phosphor (react-icons/pi) components from
@/components/icons, preserving each icon's size classes and colour (dynamic
stroke colours via the parent's currentColor, RefreshIcon's spinning state,
conditional rotate-180 chevrons).
Verified: tsc + vite build + eslint clean; an adversarial diff review of all
changed files found the replacements correct (70 files clean, 0 blockers).
Remaining inline <svg> dropped from 262 to ~95 — the survivors are legitimate
non-icons (brand/provider logos, loading spinners & framer-motion animations,
charts/sparklines, background decoration) plus a few ambiguous glyphs.
Redesign the Nodes tab to match the Remnawave panel's node list:
- per-node row: status dot, online users, flag + name, provider badge, IP,
traffic used with a progress bar (∞ when unlimited), uptime
- live metrics strip: RAM %, load average (1/5/15m), realtime ↓/↑ throughput
and the node + xray versions, sourced from system.stats (memory, loadAvg,
interface rx/txBytesPerSec) already returned by /api/nodes/
- provider name comes from the realtime stats (joined by node uuid), which is
now loaded on the Nodes tab too
- poll the nodes endpoint every 5s so the live metrics stay fresh, like the panel
- formatSpeed mirrors the panel's bits-with-1024-step formatting
The `nth-child(odd)` orphan rule outweighed the desktop reset (higher
specificity), so a lone trailing stat card was stretched full-width on desktop
too. Use the `max-lg`/`max-sm` variants so the fill applies only below the
multi-column breakpoint; desktop keeps the normal grid.
- Auto-refresh the recap/devices/top-consumers/subscription-requests widgets
on a 60s timer (system + health already refreshed) so the page updates itself
- Mobile: a lone trailing stat card now spans the full row (no empty gap when
the 2-column grid reflows)
- Subscription requests: full-width card with a two-column breakdown and a total
count, instead of a half-empty narrow card
- Drop the Duotone variants (their translucent secondary fill looked murky on
the dark theme) in favour of the clean regular weight across all icons
- WheelIcon: PiSteeringWheel → PiDiceFive (a steering wheel made no sense for
the fortune-wheel feature)
- Show nodes as "online / total" (fixes "56 online" when only 5 nodes exist)
- Add recap, devices (+top users by device count), top-consumers, panel
health and subscription-request widgets, with profile-specific Phosphor
metric icons (CPU/RAM/uptime/devices/event-loop)
- Add the matching adminRemnawave API types and methods
Replace the cabinet's hand-written heroicons-style SVG icon components with
the Remnawave panel's own icon family — Phosphor via react-icons/pi (Duotone).
All icons now live in a single central barrel (src/components/icons:
index + extended-icons + editor-icons, 144 icons); every feature file imports
from it instead of redefining inline SVGs (~440 icon defs removed).
- Add react-icons dependency
- Desktop nav (AppShell) now uses the central Phosphor icons, removing a
stroke-vs-duotone inconsistency the partial migration introduced
- Icons with custom props (SortIcon's direction, expandable chevrons) kept as
thin Phosphor wrappers; the RemnawaveIcon brand logo and animated SVGs
(checkmarks, spinners) are intentionally left as-is
- Restore the original per-call-site icon sizes wherever the centralized
default differed (211 call sites)
Новый пользователь с доступным триалом видел только TrialOfferCard (CTA
активации), без пути в витрину тарифов — приходилось сперва активировать
пробную. Добавлена вторичная кнопка «Посмотреть тарифы и купить подписку»
→ /subscription/purchase под карточкой триала на обеих страницах, где она
рендерится: Subscriptions и Dashboard (вход по умолчанию).
Telegram-баг #605056/#605063.
В превью конструктора рассылки кнопка реферала отображалась сырым ключом
«referrals»: presetLabels имел ключ «partners», а бот отдаёт «referrals»
(каталог BROADCAST_BUTTONS), и presetLabels[id] || id фолбэчил на сам id.
Ключ переименован partners → referrals (метка «Партнёрка» сохранена).
Реальная отправка не затронута — бот строит клавиатуру из своего каталога.
Telegram-баг #602989.
Refines 3c2f650 — that commit broke the loop by suppressing the single-tariff
redirect on idx=0, but left the BackButton visible. The user still saw Back
on the detail page and needed two taps (Back → Close) to exit. Серёжа's
report was specifically that Back should not appear at all when you land on
your only subscription via a bot button.
Move the decision up to TelegramBackButton:
- Subscribe to the existing ['subscriptions-list'] query (deduped by
React Query, so no extra fetch).
- On /subscriptions/:id, when multi_tariff_enabled is false and there is
no in-app history (idx=0 deep-link entry), hide the BackButton. Telegram
then surfaces its native Close (X) in the header.
- Multi-tariff users still see BackButton on /subscriptions/:id deep-links
because their /subscriptions list is meaningful (they have many subs).
The 2bcba3b fallback-to-parent behaviour remains intact for unrelated
deep-links like /balance/top-up, /admin/*, etc.
Revert the defensive guard in Subscriptions.tsx — the loop can no longer be
triggered because no BackButton is shown to trigger it.
Behaviour summary:
flow BackButton exit cost
-------------------------------------- ---------- ---------
deep-link → /subscriptions/:id (1T) hidden Close, 1 tap
/ → /subscriptions → /subscriptions/:id shown Back → /, 1 tap
deep-link → /balance/top-up shown Back → /balance ✓
deep-link → /subscriptions/:id (multi) shown Back → /subscriptions list
Reported by Серёжа, bugs topic #599679.
User flow that hung:
1. Bot deep-link opens MiniApp directly on /subscriptions/:id (idx=0).
2. Telegram shows BackButton.
3. Tap → TelegramBackButton handler sees no in-app history and falls
back to getFallbackParentPath('/subscriptions/:id') = '/subscriptions'.
4. Subscriptions page renders, sees single-tariff + 1 subscription,
<Navigate replace> redirects right back to /subscriptions/:id.
5. BackButton looks dead — taps do nothing visible.
Fix: only redirect when there is in-app history. When idx=0 (deep-link or
just-arrived-via-back), render the list page instead. The user then sees
their single subscription as a card and can tap into it, and the next
BackButton tap exits the MiniApp as expected.
Reported by Серёжа in bugs topic #599679.
Surface: users (and especially Серёжа в bugs topic) were seeing raw i18n keys
like `subscription.promoGroup.title` rendered as literal text on the renewal
screen. Audit found 118 keys referenced in code that were absent from all 4
locale files, plus 140 keys missing only in zh/fa (silently falling back to
Russian for those users).
Root causes:
- cf52999 (extract TariffPickerGrid) introduced `subscription.promoGroup.title`
that never existed — should have been `subscription.promoGroup.yourGroup`.
- Subscription.tsx used `subscription.autopay.title` (object path) while
SubscriptionListCard.tsx used `subscription.autopay` (leaf) — i18next can't
hold both shapes for the same key.
- Many user-flow keys (subscription.notFound, subscriptions.empty, common.ok,
successNotification.*, etc.) were never added when their components landed.
- Historical drift had ~140 keys in ru/en that never got zh/fa translations.
Fix:
- Rename TariffPickerGrid usage `promoGroup.title` → `promoGroup.yourGroup`.
- Rename Subscription.tsx usage `autopay.title` → `autopay`.
- Add 116 brand-new keys across ru/en/zh/fa (464 entries).
- Add 8 partially-missing keys (en+ru gaps) for landing periods, dashboard
campaign/referrer stats, and promo offer failure counts.
- Translate 280 entries to close the zh/fa drift.
Final state: 0 keys missing in any of the 4 locale files for any code-referenced
translation key. Build + tsc green.
Third and final step in the AdminTrafficUsage decomp. Move the
filter dropdowns + PeriodSelector into
src/components/admin/trafficUsage/filters/:
- PeriodSelector.tsx (103 lines): fixed period tabs (1/3/7/14/30
days) + custom date-range mode. Exports the PERIODS constant
so the parent's prefetch effect iterates the same canonical
list.
- TariffFilter.tsx (133 lines): pop-over multi-select for tariff
names.
- StatusFilter.tsx (147 lines): pop-over multi-select for
subscription statuses. Exports STATUS_COLORS alongside.
- NodeFilter.tsx (135 lines): pop-over multi-select for traffic
nodes (with flag emoji + traffic-share numbers).
- CountryFilter.tsx (132 lines): pop-over multi-select for
source countries.
All five are pure controlled components — parent owns every
Set<string> filter state and feeds them via {available, selected,
onChange}. The parent imports them and drops 9 now-unused icon
imports (FilterIcon, ChevronDownIcon, ServerIcon, CalendarIcon,
StatusIcon, GlobeIcon — they live inside the filter files now).
AdminTrafficUsage.tsx: 1593 → 977 lines (-616).
Cumulative across the 3-step admin-traffic decomp:
1904 → 977 (-927, -49%).
Second step in the AdminTrafficUsage decomp. Move the 15 inline SVG
icons (Search/Chevron/Refresh/Download/Sort/Filter/Server/Calendar/X/
Status/Globe/Shield/ServerSmall) into a single barrel at
src/components/admin/trafficUsage/TrafficIcons.tsx. Pure SVG, no
behavioural change.
AdminTrafficUsage.tsx: 1734 → 1593 lines (-141).
First step in the AdminTrafficUsage decomp. Two new files under
src/components/admin/trafficUsage/:
- trafficUsageHelpers.ts (166 lines): the TanStack Table module
augmentation (sticky/align/bold meta), formatters (formatBytes,
formatCurrency, formatShortDate, formatGbPerDay,
toBackendSortField, getFlagEmoji wrapper), risk-assessment helpers
(bytesToGbPerDay, getRatio, getRowBgColor, getNodeTextColor,
getRiskLevel, getCompositeRisk), and the RISK_STYLES constant.
- RiskBadge.tsx (36 lines): the small per-row risk indicator
(dot + GB/d value + mini progress bar). Pure presentational.
Parent imports everything from the new modules; the inline
'TanStack Table module augmentation' lives in the helpers file
so the declaration merge still picks up across the codebase
once the helpers are imported.
AdminTrafficUsage.tsx: 1904 → 1734 lines (-170).
Fourth and final step in the AdminBulkActions decomp.
SubscriptionSubRow: the expanded per-user secondary <tr> shown when
the operator drills into multi-subscription users (tariff, status,
days remaining, traffic bar, devices). Pure presentational.
StatusBadge: the pill used both inside the sub-row and the primary
user-table column (subscription_status). Co-located here because
both consumers want the same visual contract.
AdminBulkActions.tsx: 1367 → 1182 lines (-185).
Cumulative across the 4-step admin decomp: 2539 → 1182 (-1357, -53%).
After MultiSelectDropdown extraction the parent no longer references
ChevronDownIcon directly — the icon now lives only inside the moved
sub-component. Trailing import cleanup from the previous commit.