feat: add interaction handling for autoplay block in video player

k-tv-frontend/app/(main)/tv/components/video-player.tsx

@@ -18,6 +18,8 @@ interface VideoPlayerProps {
   subtitleTrack?: number;
   onStreamError?: () => void;
   onSubtitleTracksChange?: (tracks: SubtitleTrack[]) => void;
+  /** Called when the browser blocks autoplay and user interaction is required. */
+  onNeedsInteraction?: () => void;
 }
 
 const VideoPlayer = forwardRef<HTMLVideoElement, VideoPlayerProps>(
@@ -30,6 +32,7 @@ const VideoPlayer = forwardRef<HTMLVideoElement, VideoPlayerProps>(
       subtitleTrack = -1,
       onStreamError,
       onSubtitleTracksChange,
+      onNeedsInteraction,
     },
     ref,
   ) => {
@@ -69,7 +72,7 @@ const VideoPlayer = forwardRef<HTMLVideoElement, VideoPlayerProps>(
         hlsRef.current = hls;
 
         hls.on(Hls.Events.MANIFEST_PARSED, () => {
-          video.play().catch(() => {});
+          video.play().catch(() => onNeedsInteraction?.());
         });
 
         hls.on(Hls.Events.SUBTITLE_TRACKS_UPDATED, (_event, data) => {
@@ -95,7 +98,7 @@ const VideoPlayer = forwardRef<HTMLVideoElement, VideoPlayerProps>(
           "loadedmetadata",
           () => {
             if (initialOffset > 0) video.currentTime = initialOffset;
-            video.play().catch(() => {});
+            video.play().catch(() => onNeedsInteraction?.());
           },
           { once: true },
         );