diff --git a/src/components/primitives/Sheet/Sheet.tsx b/src/components/primitives/Sheet/Sheet.tsx index 3d0f50e..1c29024 100644 --- a/src/components/primitives/Sheet/Sheet.tsx +++ b/src/components/primitives/Sheet/Sheet.tsx @@ -7,12 +7,10 @@ import { useContext, useState, useCallback, - useEffect, } from 'react'; import { cn } from '@/lib/utils'; import { usePlatform } from '@/platform'; import { useBackButton } from '@/platform'; -import { useTelegramSDK } from '@/hooks/useTelegramSDK'; import { backdrop, backdropTransition, @@ -140,26 +138,9 @@ export const SheetContent = forwardRef( const { open, onClose } = useContext(SheetContext); const { haptic } = usePlatform(); const dragControls = useDragControls(); - const { disableVerticalSwipes, enableVerticalSwipes, isTelegramWebApp } = useTelegramSDK(); - // Back button integration useBackButton(open ? onClose : null); - // Disable Telegram vertical swipes when sheet is open (prevents conflict with drag gestures) - useEffect(() => { - if (!isTelegramWebApp) return; - - if (open) { - disableVerticalSwipes(); - } - - return () => { - if (open) { - enableVerticalSwipes(); - } - }; - }, [open, isTelegramWebApp, disableVerticalSwipes, enableVerticalSwipes]); - const handleDragEnd = useCallback( (_: MouseEvent | TouchEvent | PointerEvent, info: PanInfo) => { const velocity = info.velocity.y; diff --git a/src/components/ui/Sheet.tsx b/src/components/ui/Sheet.tsx index 7b2bf42..3ee4874 100644 --- a/src/components/ui/Sheet.tsx +++ b/src/components/ui/Sheet.tsx @@ -2,7 +2,6 @@ import { useEffect, useRef, useCallback, useState, type ReactNode } from 'react' import { createPortal } from 'react-dom'; import { useBackButton } from '@/platform'; import { useHaptic } from '@/platform'; -import { useTelegramSDK } from '@/hooks/useTelegramSDK'; export interface SheetProps { isOpen: boolean; @@ -105,26 +104,10 @@ export function Sheet({ const [isVisible, setIsVisible] = useState(false); const haptic = useHaptic(); - const { disableVerticalSwipes, enableVerticalSwipes, isTelegramWebApp } = useTelegramSDK(); // BackButton integration useBackButton(isOpen ? onClose : null); - // Disable Telegram vertical swipes when sheet is open (prevents conflict with drag gestures) - useEffect(() => { - if (!isTelegramWebApp) return; - - if (isOpen) { - disableVerticalSwipes(); - } - - return () => { - if (isOpen) { - enableVerticalSwipes(); - } - }; - }, [isOpen, isTelegramWebApp, disableVerticalSwipes, enableVerticalSwipes]); - // Calculate current height based on snap point const currentHeight = `${snapPoints[currentSnapIndex] * 100}vh`; diff --git a/src/hooks/useTelegramDnd.ts b/src/hooks/useTelegramDnd.ts index 8f20e1f..740953d 100644 --- a/src/hooks/useTelegramDnd.ts +++ b/src/hooks/useTelegramDnd.ts @@ -1,50 +1,25 @@ -import { useCallback, useRef } from 'react'; +import { useCallback } from 'react'; import { useTelegramSDK } from './useTelegramSDK'; /** - * Hook to manage Telegram vertical swipes during drag-and-drop operations. - * Disables Telegram's swipe-to-close gesture while dragging to prevent conflicts. - * - * Usage with @dnd-kit: - * ```tsx - * const { onDragStart, onDragEnd } = useTelegramDnd(); - * - * { - * onDragStart(); - * // your drag start logic - * }} - * onDragEnd={(e) => { - * onDragEnd(); - * // your drag end logic - * }} - * > - * ``` + * Hook for drag-and-drop operations in Telegram Mini App. + * Note: Vertical swipes are now globally disabled at app init, + * so this hook just provides no-op callbacks for compatibility. */ export function useTelegramDnd() { - const { disableVerticalSwipes, enableVerticalSwipes, isTelegramWebApp } = useTelegramSDK(); - const isDraggingRef = useRef(false); + const { isTelegramWebApp } = useTelegramSDK(); const onDragStart = useCallback(() => { - if (isTelegramWebApp && !isDraggingRef.current) { - isDraggingRef.current = true; - disableVerticalSwipes(); - } - }, [isTelegramWebApp, disableVerticalSwipes]); + // No-op: swipes are globally disabled + }, []); const onDragEnd = useCallback(() => { - if (isTelegramWebApp && isDraggingRef.current) { - isDraggingRef.current = false; - enableVerticalSwipes(); - } - }, [isTelegramWebApp, enableVerticalSwipes]); + // No-op: swipes are globally disabled + }, []); const onDragCancel = useCallback(() => { - if (isTelegramWebApp && isDraggingRef.current) { - isDraggingRef.current = false; - enableVerticalSwipes(); - } - }, [isTelegramWebApp, enableVerticalSwipes]); + // No-op: swipes are globally disabled + }, []); return { onDragStart, diff --git a/src/hooks/useTelegramSDK.ts b/src/hooks/useTelegramSDK.ts index 0ed1503..73cdcbe 100644 --- a/src/hooks/useTelegramSDK.ts +++ b/src/hooks/useTelegramSDK.ts @@ -67,6 +67,9 @@ export function initTelegramSDK() { // Disable closing confirmation by default tg.disableClosingConfirmation?.(); + // Disable vertical swipes to prevent accidental closures + tg.disableVerticalSwipes?.(); + // Auto-enter fullscreen if enabled in settings (mobile only) const fullscreenEnabled = getCachedFullscreenEnabled(); if (fullscreenEnabled && isTelegramMobile() && tg.requestFullscreen) {