> ## Documentation Index
> Fetch the complete documentation index at: https://docs.bedolagam.ru/llms.txt
> Use this file to discover all available pages before exploring further.

# Обзор Cabinet

> Веб-интерфейс личного кабинета — полнофункциональная альтернатива Telegram-боту

## Что такое Cabinet?

**Bedolaga Cabinet** — веб-приложение для управления VPN подписками через браузер. Работает как полноценный личный кабинет с авторизацией через Telegram, email или OAuth-провайдеров (Google, Яндекс, Discord, VK). Включает встроенную админ-панель для управления всем сервисом.

<CardGroup cols={2}>
  <Card title="Telegram + Email + OAuth" icon="right-to-bracket">
    4 способа авторизации, включая вход без Telegram
  </Card>

  <Card title="Админ-панель" icon="gauge">
    Полное управление сервисом через веб-интерфейс
  </Card>

  <Card title="RBAC + ABAC" icon="shield-halved">
    Роли, разрешения, политики доступа и журнал аудита. [Подробнее →](/cabinet/rbac)
  </Card>

  <Card title="Анимированные фоны" icon="palette">
    15 визуальных эффектов на базе Aceternity UI. [Подробнее →](/cabinet/backgrounds)
  </Card>

  <Card title="Real-time" icon="bolt">
    WebSocket-уведомления и мгновенные обновления
  </Card>
</CardGroup>

## Возможности для пользователей

<CardGroup cols={2}>
  <Card title="Подписки" icon="key">
    Покупка, продление, смена тарифа, приостановка. Выбор серверов и стран. Управление устройствами (HWID). Мультитарифный режим — несколько подписок одновременно.
  </Card>

  <Card title="Баланс и платежи" icon="wallet">
    Пополнение через любую подключённую платёжную систему. История транзакций с фильтрацией. Telegram Stars.
  </Card>

  <Card title="Подключение к VPN" icon="wifi">
    Ключи подключения, полноэкранный QR-код, инструкции по настройке. Deep-ссылки для автоматического импорта в VPN-клиенты.
  </Card>

  <Card title="Реферальная программа" icon="users">
    Реферальная ссылка, список рефералов, история начислений. Заявка на партнёрство, вывод средств.
  </Card>

  <Card title="Поддержка" icon="headset">
    Создание тикетов, переписка с поддержкой, уведомления о статусе.
  </Card>

  <Card title="Подарочные подписки" icon="gift">
    Покупка и отправка по коду, deep link или по контакту получателя. Активация в боте или Cabinet. [Подробнее →](/cabinet/gift-subscriptions)
  </Card>

  <Card title="Дополнительно" icon="gamepad">
    Промокоды, рекламные предложения, конкурсы, мини-игры, колесо фортуны, опросы.
  </Card>
</CardGroup>

## Авторизация

Cabinet поддерживает 4 независимых способа входа. Пользователи могут регистрироваться и использовать сервис **без Telegram**.

### Telegram

| Способ                | Описание                                                                              |
| --------------------- | ------------------------------------------------------------------------------------- |
| **WebApp (Mini App)** | Автоматический вход при открытии внутри Telegram — валидация `initData` с HMAC-SHA256 |
| **Login Widget**      | Кнопка «Войти через Telegram» на веб-странице для браузерного доступа                 |

### Email

Классическая регистрация с email + пароль:

1. Регистрация с валидацией (блокировка одноразовых email)
2. Верификация через ссылку в письме
3. Вход по email + паролю
4. Сброс пароля через email
5. Смена email с подтверждением кодом

Подробнее: [Email-авторизация](/cabinet/email-auth)

### OAuth 2.0

<CardGroup cols={4}>
  <Card title="Google" icon="google">
    `openid email profile`
  </Card>

  <Card title="Яндекс" icon="y">
    `login:info login:email`
  </Card>

  <Card title="Discord" icon="discord">
    `identify email`
  </Card>

  <Card title="VK ID" icon="vk">
    `vkid.personal_info email` (OAuth 2.1 + PKCE)
  </Card>
</CardGroup>

Аккаунты автоматически привязываются при совпадении верифицированного email. Подробнее: [Настройка OAuth](/cabinet/oauth-setup)

### JWT-токены

| Токен   | Срок жизни             | Хранение                       |
| ------- | ---------------------- | ------------------------------ |
| Access  | 15 мин (настраивается) | sessionStorage                 |
| Refresh | 7 дней (настраивается) | localStorage, SHA-256 хеш в БД |

Автообновление: access-токен обновляется автоматически через refresh. Параллельные запросы ожидают один refresh без дублирования.

## Админ-панель

Полнофункциональная веб-панель администратора доступна прямо в Cabinet.

### Доступ

```env theme={null}
# Telegram-админы (по user ID)
ADMIN_IDS=123456789,987654321

# Email-админы (для пользователей без Telegram)
ADMIN_EMAILS=admin@example.com,manager@example.com
```

Достаточно одного из двух — Telegram ID или email в списке администраторов. Для делегирования доступа с ограниченными правами используйте [систему ролей (RBAC)](/cabinet/rbac).

### Разделы

<CardGroup cols={2}>
  <Card title="Дашборд" icon="chart-line">
    Аналитика, статистика пользователей, подписок и доходов
  </Card>

  <Card title="Статистика продаж" icon="chart-pie">
    6 аналитических вкладок: сводка, триалы, продажи, продления, доп. услуги, пополнения. Графики по тарифам, платёжкам, периодам. [Подробнее →](/cabinet/sales-stats)
  </Card>

  <Card title="Пользователи" icon="users">
    Поиск, просмотр профилей, управление данными, история действий
  </Card>

  <Card title="Тарифы" icon="tags">
    Создание, редактирование, включение/выключение тарифов, статистика
  </Card>

  <Card title="Сквады" icon="server">
    Управление сквадами (серверами), синхронизация с RemnaWave, статистика нагрузки
  </Card>

  <Card title="Платежи" icon="credit-card">
    Все транзакции, поиск по ID, настройка отображения платёжных методов
  </Card>

  <Card title="Рассылки" icon="paper-plane">
    Массовые сообщения пользователям с фильтрацией и шаблонами
  </Card>

  <Card title="Промокоды" icon="ticket">
    Создание и управление промокодами, промогруппами (периодические скидки), статистика
  </Card>

  <Card title="Рекламные кампании" icon="bullhorn">
    Создание кампаний с deep-ссылками и отслеживанием конверсий
  </Card>

  <Card title="Партнёры" icon="handshake">
    Заявки на партнёрство, настройка комиссий, управление партнёрами
  </Card>

  <Card title="Выводы средств" icon="money-bill-transfer">
    Обработка запросов на вывод реферальных средств (одобрение / отказ / завершение)
  </Card>

  <Card title="Рефералы" icon="diagram-project">
    Управление реферальными связями: назначение/удаление реферера, добавление рефералов
  </Card>

  <Card title="Поддержка" icon="headset">
    Управление тикетами, настройка уведомлений о SLA
  </Card>

  <Card title="Настройки" icon="gear">
    Live-редактирование конфигурации бота без перезапуска. Древовидная навигация: 7 групп, 61 категория, быстрые переключатели
  </Card>

  <Card title="Редактор меню" icon="grip">
    Drag-and-drop настройка структуры меню, кастомные URL-кнопки, стили и иконки. [Подробнее →](/cabinet/menu-editor)
  </Card>

  <Card title="RemnaWave" icon="network-wired">
    Статус панели, ноды, сквады, синхронизация, миграции пользователей между сквадами. Вкладка трафика с разбивкой по inbound. Поддержка v2.7.0
  </Card>

  <Card title="Трафик" icon="chart-area">
    Мониторинг потребления трафика по пользователям
  </Card>

  <Card title="Рекламные предложения" icon="gift">
    Шаблоны промо-предложений, персональные рассылки
  </Card>

  <Card title="Email-шаблоны" icon="envelope">
    Редактирование шаблонов писем (верификация, сброс пароля) с предпросмотром и тестовой отправкой
  </Card>

  <Card title="Приложения" icon="mobile">
    Настройка VPN-приложений для скачивания, deep-ссылки по платформам, брендирование
  </Card>

  <Card title="Колесо фортуны" icon="dharmachakra">
    Настройка призов, стоимости вращения, лимитов
  </Card>

  <Card title="Закреплённые сообщения" icon="thumbtack">
    Создание сообщений, отображаемых всем пользователям в кабинете
  </Card>

  <Card title="Новости" icon="newspaper">
    Создание и публикация статей, управление категориями и тегами, загрузка медиа. [Подробнее →](/bot/news-module)
  </Card>

  <Card title="Обновления" icon="rotate">
    Проверка новых версий бота и кабинета
  </Card>

  <Card title="Роли и доступ (RBAC)" icon="shield-halved">
    Создание ролей с разрешениями, назначение пользователям, ABAC-политики (время, IP), журнал аудита. [Подробнее →](/cabinet/rbac)
  </Card>

  <Card title="Анимированные фоны" icon="palette">
    15 визуальных эффектов (CSS, Canvas, SVG), live-превью, мобильная оптимизация. [Подробнее →](/cabinet/backgrounds)
  </Card>
</CardGroup>

## Архитектура

```
Браузер  →  Caddy/Nginx  →  /api/*  →  remnawave_bot:8080  (backend API)
                          →  /*      →  /srv/cabinet         (статика frontend)
```

Frontend — статические файлы (HTML, JS, CSS). Обратный прокси:

1. Раздаёт статику frontend
2. Проксирует `/api/*` на backend бота (с удалением префикса `/api`)

Два режима главного меню бота:

| Режим       | `MAIN_MENU_MODE` | Описание                                                    |
| ----------- | ---------------- | ----------------------------------------------------------- |
| Стандартный | `default`        | Полноценный Telegram-бот с inline-кнопками                  |
| Кабинет     | `cabinet`        | Минимальное текстовое меню с перенаправлением в веб-кабинет |

## Стек технологий

| Технология          | Назначение                                                          |
| ------------------- | ------------------------------------------------------------------- |
| React 18            | UI фреймворк. Автоперезагрузка при ошибках чанков (`lazyWithRetry`) |
| TypeScript          | Типизация                                                           |
| Vite                | Сборка                                                              |
| Tailwind CSS        | Стили                                                               |
| Zustand             | State management                                                    |
| i18next             | Мультиязычность (RU/EN/CN/UA/FA)                                    |
| Telegram WebApp SDK | Авторизация через Telegram                                          |
| WebSocket           | Real-time уведомления                                               |

## Переменные окружения

### Build-time (вшиваются в JS при сборке)

| Переменная                   | Описание                           | По умолчанию |
| ---------------------------- | ---------------------------------- | ------------ |
| `VITE_API_URL`               | Путь к API (`/api` или полный URL) | `/api`       |
| `VITE_TELEGRAM_BOT_USERNAME` | Username бота (без @)              | —            |
| `VITE_APP_NAME`              | Название в шапке и вкладке         | `Cabinet`    |
| `VITE_APP_LOGO`              | Текст логотипа (1-2 символа)       | `V`          |

### Backend бота (.env бота)

| Переменная                            | Описание                                          | По умолчанию |
| ------------------------------------- | ------------------------------------------------- | ------------ |
| `CABINET_ENABLED`                     | Включить Cabinet API                              | `false`      |
| `CABINET_URL`                         | Базовый URL кабинета (для ссылок в email и OAuth) | —            |
| `CABINET_JWT_SECRET`                  | Секретный ключ для JWT                            | —            |
| `CABINET_ALLOWED_ORIGINS`             | CORS origins (через запятую)                      | —            |
| `CABINET_ACCESS_TOKEN_EXPIRE_MINUTES` | Время жизни access token                          | `15`         |
| `CABINET_REFRESH_TOKEN_EXPIRE_DAYS`   | Время жизни refresh token                         | `7`          |
| `CABINET_EMAIL_AUTH_ENABLED`          | Включить email-вход                               | `true`       |
| `CABINET_EMAIL_VERIFICATION_ENABLED`  | Требовать верификацию email                       | `true`       |
| `CABINET_BUTTON_STYLE`                | Стиль кнопок: `primary`, `success`, `danger`      | —            |
| `MAIN_MENU_MODE`                      | Режим меню: `default` или `cabinet`               | `default`    |

## Быстрый старт

<Steps>
  <Step title="Включите Cabinet API">
    Добавьте в `.env` бота:

    ```env theme={null}
    CABINET_ENABLED=true
    CABINET_URL=https://cabinet.example.com
    CABINET_JWT_SECRET=your_secret_here
    CABINET_ALLOWED_ORIGINS=https://cabinet.example.com
    ```
  </Step>

  <Step title="Разверните frontend">
    Подробная инструкция: [Установка Cabinet](/cabinet/setup)
  </Step>

  <Step title="Настройте прокси">
    Caddy, Nginx или Traefik: [Настройка прокси](/cabinet/proxy-config)
  </Step>

  <Step title="Добавьте авторизацию (опционально)">
    * [Email-авторизация](/cabinet/email-auth) — вход без Telegram
    * [OAuth-провайдеры](/cabinet/oauth-setup) — Google, Яндекс, Discord, VK
  </Step>
</Steps>

## Структура проекта

```
bedolaga-cabinet/
├── src/
│   ├── api/           # API клиенты (axios)
│   ├── components/    # React компоненты (UI kit)
│   ├── contexts/      # React контексты (auth, theme)
│   ├── hooks/         # Custom hooks
│   ├── locales/       # Переводы (i18n) — 5 языков
│   ├── pages/         # Страницы приложения
│   │   └── admin/     # Страницы админ-панели (20+ модулей)
│   ├── store/         # Zustand stores (auth, settings)
│   ├── types/         # TypeScript типы
│   └── utils/         # Утилиты
├── public/            # Статические файлы
├── Dockerfile         # Multi-stage сборка (node → nginx)
├── docker-compose.yml # Docker Compose для сборки
├── nginx.conf         # Nginx конфиг внутри контейнера
└── .env.example       # Пример переменных окружения
```