diff --git a/src/components/layout/AppShell/AppShell.tsx b/src/components/layout/AppShell/AppShell.tsx index f5b8716..e118241 100644 --- a/src/components/layout/AppShell/AppShell.tsx +++ b/src/components/layout/AppShell/AppShell.tsx @@ -221,6 +221,11 @@ export function AppShell({ children }: AppShellProps) { const [mobileMenuOpen, setMobileMenuOpen] = useState(false); const [isKeyboardOpen, setIsKeyboardOpen] = useState(false); + // Reset keyboard state on route change — prevents bottom nav staying hidden after navigation + useEffect(() => { + setIsKeyboardOpen(false); + }, [location.pathname]); + // Keyboard detection for hiding bottom nav useEffect(() => { const handleFocusIn = (e: FocusEvent) => { diff --git a/src/pages/Profile.tsx b/src/pages/Profile.tsx index 197ae83..288da5c 100644 --- a/src/pages/Profile.tsx +++ b/src/pages/Profile.tsx @@ -1,6 +1,7 @@ import { useState, useRef, useEffect } from 'react'; import { Link, useNavigate } from 'react-router'; import { useTranslation } from 'react-i18next'; +import { usePlatform } from '@/platform'; import { useQuery, useMutation, useQueryClient } from '@tanstack/react-query'; import { motion, AnimatePresence } from 'framer-motion'; import { useAuthStore } from '../store/auth'; @@ -250,14 +251,16 @@ export default function Profile() { return () => clearInterval(timer); }, [verificationResendCooldown]); - // Auto-focus inputs on step change + // Auto-focus inputs on step change (skip on Telegram — keyboard hides bottom nav) + const { platform: profilePlatform } = usePlatform(); useEffect(() => { + if (profilePlatform === 'telegram') return; const timer = setTimeout(() => { if (changeEmailStep === 'email') newEmailInputRef.current?.focus(); else if (changeEmailStep === 'code') codeInputRef.current?.focus(); }, 100); return () => clearTimeout(timer); - }, [changeEmailStep]); + }, [changeEmailStep, profilePlatform]); // Auto-close success after 3s useEffect(() => { diff --git a/src/pages/TopUpAmount.tsx b/src/pages/TopUpAmount.tsx index 4f3ac73..fac7ef8 100644 --- a/src/pages/TopUpAmount.tsx +++ b/src/pages/TopUpAmount.tsx @@ -88,7 +88,7 @@ export default function TopUpAmount() { const queryClient = useQueryClient(); const { formatAmount, currencySymbol, convertAmount, convertToRub, targetCurrency } = useCurrency(); - const { openInvoice, openTelegramLink, openLink } = usePlatform(); + const { openInvoice, openTelegramLink, openLink, platform } = usePlatform(); const haptic = useHaptic(); const inputRef = useRef(null); @@ -228,15 +228,16 @@ export default function TopUpAmount() { }, }); - // Auto-focus input + // Auto-focus input (only on desktop — mobile keyboard hides bottom nav) useEffect(() => { + if (platform === 'telegram') return; const timer = setTimeout(() => { if (inputRef.current) { inputRef.current.focus(); } }, 100); return () => clearTimeout(timer); - }, []); + }, [platform]); if (!method) { return ( @@ -399,7 +400,6 @@ export default function TopUpAmount() { placeholder="0" className="h-14 w-full bg-transparent px-4 pr-12 text-xl font-bold text-dark-100 placeholder:text-dark-600 focus:outline-none" autoComplete="off" - autoFocus /> {currencySymbol}