Скопируйте этот текст и вставьте в чат нового проекта
# ПРОМТ ДЛЯ СОЗДАНИЯ TELEGRAM-БОТА С МИНИ-ПРИЛОЖЕНИЕМ
Создай Telegram-бота с полноценным мини-приложением (WebApp), привязкой аккаунтов, нижней навигацией и гейт-оверлеем для незарегистрированных пользователей. Вот полная спецификация того, что нужно реализовать:
---
## 1. ТЕЛЕГРАМ-БОТ (пассивный, без разговорных меню)
Бот должен быть пассивным — никаких разговорных команд, только автоматическая доставка кодов подтверждения и уведомлений.
### Главное меню (inline-кнопки, 2 в ряд):
[🛒 Маркет] [👤 Профиль]
[📰 Новости] [📋 Правила]
[🎫 Поддержка]
### Профиль (карточка + меню):
- При нажатии «👤 Профиль» — отправка карточки-картинки с QR-кодом профиля
- Под карточкой — inline-кнопки (2 в ряд):
[📦 Заказы] [🏪 Мой магазин]
[💰 Финансы] [⬅️ Назад]
### Авторизация в боте:
- При /start если не привязан — кнопка «🔐 Войти / Регистрация» открывает WebApp мини-приложение /tg-auth
- Если привязан — показывается главное меню
---
## 2. МИНИ-ПРИЛОЖЕНИЕ РЕГИСТРАЦИИ (/tg-auth)
Отдельная страница для входа/регистрации внутри Telegram WebApp.
### Что должно быть:
- Email + пароль форма
- Кнопка «Войти» (для существующих) и «Регистрация» (для новых)
- После успешного входа — автоматическое закрытие WebApp и возврат в бот
- При регистрации — отправка OTP-кода на email, ввод кода в форме
### Интеграция с ботом:
- После успешного входа в мини-приложении — вызов backend-функции linkTelegramFromMiniApp
- Функция привязывает telegram_id к email в сущности TelegramUser
- WebApp закрывается, бот отправляет сообщение «✅ Аккаунт привязан!» и главное меню
---
## 3. ГЕЙТ-ОВЕРЛЕЙ ДЛЯ НЕАВТОРИЗОВАННЫХ (TelegramWebAppGuard)
КРИТИЧНО: Все мини-приложения в Telegram WebApp должны показывать блокирующий оверлей, если пользователь не авторизован.
### Логика:
- При открытии любого мини-приложения (Market, Profile, Orders и т.д.) в Telegram WebApp
- Если пользователь НЕ авторизован → показывается полноэкранный оверлей
- Текст: «🔒 Для доступа войдите или зарегистрируйтесь»
- Кнопка «🔐 Войти / Регистрация» → открывает /tg-auth мини-приложение
- Контент мини-приложения НЕ виден за оверлеем
### В App.jsx:
const isTelegramWebApp = !!(window.location.hash && window.location.hash.includes('tgWebAppData'));
if (authError?.type === 'auth_required' && isTelegramWebApp) return <TelegramWebAppGuard />;
if (isTelegramWebApp && !isAuthenticated) return <TelegramWebAppGuard />;
---
## 4. НИЖНЯЯ НАВИГАЦИЯ (MobileBottomNav)
Sticky-меню внизу экрана для мобильных и Telegram WebApp.
### Пункты (5 иконок):
[🏠 Главная] [🛒 Маркет] [🎫 Поддержка] [👤 Профиль] [☰ Меню]
### Логика отображения:
- В обычном сайте — показывается всегда на мобильных
- В Telegram WebApp — показывается ТОЛЬКО в мини-приложении «Маркет» (открытом из кнопки меню бота)
- В других мини-приложениях (Profile, Orders и т.д.) — НЕ показывается
### Реализация через sessionStorage:
// Layout.jsx
const isTelegramWebApp = useTelegramWebApp();
if (isTelegramWebApp && location.pathname === '/') {
sessionStorage.setItem('tg_shop_app', '1');
} else if (isTelegramWebApp) {
sessionStorage.removeItem('tg_shop_app');
}
const isShopMiniApp = sessionStorage.getItem('tg_shop_app') === '1';
// Рендер:
if (isTelegramWebApp) {
return (
<main className="min-h-screen bg-background text-foreground pb-20">
<Outlet />
{isShopMiniApp && <MobileBottomNav />}
</main>
);
}
---
## 5. АВТО-ВХОД В МИНИ-ПРИЛОЖЕНИЯ
Чтобы пользователь не вводил пароль каждый раз при открытии мини-приложения:
### Backend (telegramAutoLogin):
- При открытии мини-приложения — frontend вызывает backend-функцию
- Backend берёт telegram_id из tgWebAppData (валидированная подпись Telegram)
- Ищет TelegramUser с этим telegram_id и is_linked: true
- Если есть зашифрованный пароль (auth_password_enc) — расшифровывает
- Вызывает base44.auth.loginViaEmailPassword(email, password) от имени пользователя
- Возвращает success → frontend обновляет сессию
### Frontend:
// useTelegramWebApp.js — инициализация Telegram WebApp
// telegramAutoAuth.js — вызов backend для авто-входа
---
## 6. СУЩНОСТЬ TelegramUser
{
"name": "TelegramUser",
"type": "object",
"properties": {
"telegram_id": { "type": "string", "title": "Telegram ID" },
"telegram_username": { "type": "string", "title": "@username" },
"telegram_first_name": { "type": "string", "title": "Имя" },
"telegram_last_name": { "type": "string", "title": "Фамилия" },
"bigrich_email": { "type": "string", "title": "Email аккаунта" },
"bot_id": { "type": "string", "title": "ID бота" },
"is_linked": { "type": "boolean", "default": false, "title": "Аккаунт привязан" },
"state": { "type": "string", "default": "idle", "title": "Состояние диалога" },
"last_seen": { "type": "string", "format": "date-time" },
"auth_password_enc": { "type": "string", "title": "Пароль для авто-входа (зашифрован)" }
},
"required": ["telegram_id", "bot_id"]
}
---
## 7. BACKEND-ФУНКЦИИ
### testBotWebhook (или telegramWebhook)
- Принимает updates от Telegram
- Создаёт/обновляет TelegramUser при каждом сообщении
- Обрабатывает callback_query (нажатия inline-кнопок)
- Отправляет фото-баннеры категорий + inline-кнопки (2 в ряд)
- Генерирует ссылки на оплату (ЮMoney/Stripe)
- Создаёт Order и Transaction при оплате
### linkTelegramFromMiniApp
- Вызывается из мини-приложения /tg-auth после успешного входа
- Привязывает telegram_id к email пользователя
- Шифрует пароль для авто-входа
### telegramAutoLogin
- Авто-вход в мини-приложениях по telegram_id
### tgWebAppLogout
- Выход из мини-приложения
- Отвязывает аккаунт, закрывает WebApp
---
## 8. СТРУКТУРА КАТЕГОРИЙ (2 в ряд)
Все inline-клавиатуры — 2 кнопки в ряд, не больше.
### Главное меню магазина:
[🎮 ROBLOX] [💥 BRAWL STARS]
[🪟 MICROSOFT] [🎮 STEAM]
[⛏️ MINECRAFT] [🎮 XBOX]
... и т.д.
[💻 НА ЗАКАЗ]
[⬅️ В меню]
### «НА ЗАКАЗ» (подкатегории):
[🌐 Сайты] [🤖 Боты]
[⚡ Через сервис] [🔑 Под ключ]
[⬅️ Назад]
---
## 9. ОПЛАТА
- При нажатии «💳 Оплатить» — создание Order (status: pending) и Transaction
- Генерация ссылки на оплату (ЮMoney или Stripe)
- Inline-кнопка с URL-ссылкой на оплату
- После оплаты — webhook обновляет Order (status: success) и Transaction
- Уведомление в Telegram об успешной оплате
---
## 10. УВЕДОМЛЕНИЯ
Все платёженные уведомления отправляются в Telegram автоматически:
- Успешная оплата → «✅ Заказ #123 оплачен»
- Новый заказ → «📦 Новый заказ»
- Ответ поддержки → «🎫 Новое сообщение в тикете»
- Бонус начислен → «🎁 Бонус зачислен»
---
## 11. ВАЖНЫЕ ПРАВИЛА
1. Бот пассивный — никаких разговорных меню, только кнопки и автоматические уведомления
2. 2 кнопки в ряд — во всех inline-клавиатурах
3. Гейт-оверлей — все мини-приложения блокируются для неавторизованных
4. Нижнее меню — только в мини-приложении «Маркет», не в других
5. Авто-вход — пользователь вводит пароль один раз, потом авто-вход
6. QR-привязка — альтернативный способ привязки через QR-код
7. Шифрование пароля — пароль хранится зашифрованным, используется только для авто-входа
---
## 12. ФАЙЛЫ КОТОРЫЕ НУЖНО СОЗДАТЬ
### Frontend:
- src/pages/TgAuth.jsx — мини-приложение регистрации/входа
- src/components/TelegramWebAppGuard.jsx — гейт-оверлей
- src/components/MobileBottomNav.jsx — нижняя навигация
- src/hooks/useTelegramWebApp.js — хук определения Telegram WebApp
- src/lib/telegramAutoAuth.js — авто-вход в мини-приложениях
- src/lib/tgWebAppLogout.js — выход из мини-приложения
### Backend:
- base44/functions/testBotWebhook/entry.ts — основной webhook бота
- base44/functions/linkTelegramFromMiniApp/entry.ts — привязка из мини-приложения
- base44/functions/telegramAutoLogin/entry.ts — авто-вход
- base44/functions/tgWebAppLogout/entry.ts — выход
- base44/shared/telegramApi.ts — API Telegram (sendMessage, sendPhoto, answerCallbackQuery)
- base44/shared/cryptoUtils.ts — шифрование/расшифрование пароля
### Entity:
- base44/entities/TelegramUser.jsonc — сущность пользователя Telegram
### Layout:
- src/components/Layout.jsx — условный рендеринг MobileBottomNav в Telegram WebApp
- src/App.jsx — гейт-оверлей для неавторизованных в Telegram WebApp
---
Реализуй ВСЁ это. Бот должен быть полностью рабочим: кнопки, мини-приложения, оплата, уведомления. Без ошибок, без заглушек.