feat: migrate to @tma.js/sdk-react for Telegram Mini App

- Add useTelegramSDK hook with reactive signals for viewport, safe area, fullscreen
- Migrate TelegramAdapter to use SDK components (backButton, mainButton, hapticFeedback, cloudStorage, themeParams, popup)
- Update Login, TelegramRedirect to use SDK helpers
- Update PlatformProvider, api/client to use centralized SDK functions
- Simplify useTelegramWebApp as backward-compatible wrapper
- Add automatic CSS variable binding for theme and viewport
This commit is contained in:
c0mrade
2026-02-01 20:13:50 +03:00
parent 55ae55f4af
commit edb5be09ae
14 changed files with 736 additions and 513 deletions

View File

@@ -14,6 +14,7 @@ import {
type EmailAuthEnabled,
} from '../api/branding';
import { getAndClearReturnUrl } from '../utils/token';
import { isInTelegramWebApp, getTelegramInitData } from '../hooks/useTelegramSDK';
import LanguageSwitcher from '../components/LanguageSwitcher';
import TelegramLoginButton from '../components/TelegramLoginButton';
@@ -111,14 +112,13 @@ export default function Login() {
// Try Telegram WebApp authentication on mount
useEffect(() => {
const tryTelegramAuth = async () => {
const tg = window.Telegram?.WebApp;
if (tg?.initData) {
const initData = getTelegramInitData();
if (isInTelegramWebApp() && initData) {
setIsTelegramWebApp(true);
tg.ready();
tg.expand();
// Note: ready() and expand() are already called by initTelegramSDK in main.tsx
setIsLoading(true);
try {
await loginWithTelegram(tg.initData);
await loginWithTelegram(initData);
navigate(getReturnUrl(), { replace: true });
} catch (err) {
// Log only status code to avoid leaking sensitive data