diff --git a/components/FloatingCallBubble.tsx b/components/FloatingCallBubble.tsx index 8323532..4137144 100644 --- a/components/FloatingCallBubble.tsx +++ b/components/FloatingCallBubble.tsx @@ -21,6 +21,7 @@ import { AppColors, FontSizes, Spacing } from '@/constants/theme'; import { useVoiceCall } from '@/contexts/VoiceCallContext'; const BUBBLE_SIZE = 70; +const TAB_BAR_HEIGHT = 60; // Tab bar content height (without safe area) const { width: SCREEN_WIDTH, height: SCREEN_HEIGHT } = Dimensions.get('window'); export function FloatingCallBubble() { @@ -117,8 +118,9 @@ export function FloatingCallBubble() { const targetX = snapToLeft ? 16 : SCREEN_WIDTH - BUBBLE_SIZE - 16; // Clamp Y within screen bounds + // Account for tab bar height + safe area to avoid overlapping navigation const minY = insets.top + 16; - const maxY = SCREEN_HEIGHT - BUBBLE_SIZE - insets.bottom - 100; + const maxY = SCREEN_HEIGHT - BUBBLE_SIZE - insets.bottom - TAB_BAR_HEIGHT - 16; const targetY = Math.max(minY, Math.min(currentY, maxY)); Animated.spring(pan, {