replace touch-to-show-ui with hover-to-show-ui

js/app/components/mobile/desktop-ui.tsx

···
   Toast,
   useAvatars,
   useCameraToggle,
-  useKeyboardSlide,
   useLivestreamInfo,
   usePlayerDimensions,
   usePlayerStore,
···
   VolumeX,
 } from "lucide-react-native";
 import { useCallback, useEffect, useRef, useState } from "react";
-import {
-  Image,
-  Platform,
-  Pressable,
-  TouchableWithoutFeedback,
-} from "react-native";
+import { Image, Platform, Pressable } from "react-native";
+import { Gesture, GestureDetector } from "react-native-gesture-handler";
 import Animated, {
+  runOnJS,
   useAnimatedStyle,
   useSharedValue,
   withTiming,
···
   const { width, height } = usePlayerDimensions();
   const { doSetIngestCamera } = useCameraToggle();
   const avatars = useAvatars(profile?.did ? [profile?.did] : []);
-  const { slideKeyboard } = useKeyboardSlide();
   const { safeAreaInsets, shouldShowFloatingMetrics } = useResponsiveLayout();
 
   const fullscreen = usePlayerStore((state) => state.fullscreen);
···
   const [isChatOpen, setIsChatOpen] = useState(false);
   const fadeOpacity = useSharedValue(1);
   const fadeTimeout = useRef<NodeJS.Timeout | null>(null);
-  const FADE_OUT_DELAY = 4000;
+  const FADE_OUT_DELAY = 2500;
 
   const isSelfAndNotLive = ingest === "new";
   const isActivelyLive = ingest !== null && ingest !== "new";
···
     }, FADE_OUT_DELAY);
   }, [fadeOpacity]);
 
-  const onPressPlayer = useCallback(() => {
+  const onPlayerHover = useCallback(() => {
+    console.log("player hovered");
     resetFadeTimer();
   }, [resetFadeTimer]);
 
···
     opacity: shouldShowFloatingMetrics ? 1 : fadeOpacity.value,
   }));
 
+  const hover = Gesture.Hover().onStart((_) => runOnJS(onPlayerHover)());
+
   return (
-    <TouchableWithoutFeedback onPress={onPressPlayer}>
+    <GestureDetector gesture={hover}>
       <View style={[layout.position.absolute, h.percent[100], w.percent[100]]}>
         <Animated.View
           style={[
···
           duration={5}
         />
       </View>
-    </TouchableWithoutFeedback>
+    </GestureDetector>
   );
 }