From 40292c0575cdee0f469448f09963be6149498769 Mon Sep 17 00:00:00 2001 From: coofzilla Date: Wed, 21 Feb 2024 11:15:45 +0900 Subject: [PATCH 1/8] feature: add support to get subtitle content data --- ios/Video/Features/RCTPlayerObserver.swift | 12 ++++++++++-- ios/Video/RCTVideo.swift | 14 ++++++++++++++ ios/Video/RCTVideoManager.m | 1 + 3 files changed, 25 insertions(+), 2 deletions(-) diff --git a/ios/Video/Features/RCTPlayerObserver.swift b/ios/Video/Features/RCTPlayerObserver.swift index dfdd832032..3b02f492d4 100644 --- a/ios/Video/Features/RCTPlayerObserver.swift +++ b/ios/Video/Features/RCTPlayerObserver.swift @@ -26,11 +26,12 @@ protocol RCTPlayerObserverHandler: RCTPlayerObserverHandlerObjc { func handleExternalPlaybackActiveChange(player: AVPlayer, change: NSKeyValueObservedChange) func handleViewControllerOverlayViewFrameChange(overlayView: UIView, change: NSKeyValueObservedChange) func handleTracksChange(playerItem: AVPlayerItem, change: NSKeyValueObservedChange<[AVPlayerItemTrack]>) + func handleLegibleOutput(strings: [NSAttributedString]) } // MARK: - RCTPlayerObserver -class RCTPlayerObserver: NSObject, AVPlayerItemMetadataOutputPushDelegate { +class RCTPlayerObserver: NSObject, AVPlayerItemMetadataOutputPushDelegate, AVPlayerItemLegibleOutputPushDelegate { weak var _handlers: RCTPlayerObserverHandler? var player: AVPlayer? { @@ -57,9 +58,11 @@ class RCTPlayerObserver: NSObject, AVPlayerItemMetadataOutputPushDelegate { // handle timedMetadata let metadataOutput = AVPlayerItemMetadataOutput() + let legibleOutput = AVPlayerItemLegibleOutput() playerItem.add(metadataOutput) + playerItem.add(legibleOutput) metadataOutput.setDelegate(self, queue: .main) - } + legibleOutput.setDelegate(self, queue: .main) } } var playerViewController: AVPlayerViewController? { @@ -112,6 +115,11 @@ class RCTPlayerObserver: NSObject, AVPlayerItemMetadataOutputPushDelegate { _handlers.handleTimeMetadataChange(timedMetadata: metadataGroup.items) } } + + func legibleOutput(_: AVPlayerItemLegibleOutput, didOutputAttributedStrings strings: [NSAttributedString], nativeSampleBuffers _: [Any], forItemTime _: CMTime) { + guard let _handlers else { return } + _handlers.handleLegibleOutput(strings: strings) + } func addPlayerObservers() { guard let player, let _handlers else { diff --git a/ios/Video/RCTVideo.swift b/ios/Video/RCTVideo.swift index 6f4cf58141..f8a8ebcc5a 100644 --- a/ios/Video/RCTVideo.swift +++ b/ios/Video/RCTVideo.swift @@ -118,6 +118,7 @@ class RCTVideo: UIView, RCTVideoPlayerViewControllerDelegate, RCTPlayerObserverH @objc var onReceiveAdEvent: RCTDirectEventBlock? @objc var onTextTracks: RCTDirectEventBlock? @objc var onAudioTracks: RCTDirectEventBlock? + @objc var onSubtitleTracks: RCTDirectEventBlock? @objc func _onPictureInPictureStatusChanged() { @@ -1386,4 +1387,17 @@ class RCTVideo: UIView, RCTVideoPlayerViewControllerDelegate, RCTPlayerObserverH self.onAudioTracks?(["audioTracks": audioTracks]) } } + + func handleLegibleOutput(strings: [NSAttributedString]) { + let subtitles = strings.map { subtitle in + Dictionary(subtitle.string + .split(separator: "\n") + .compactMap { line -> (String, String)? in + let parts = line.split(separator: "=", maxSplits: 1).map(String.init) + return parts.count == 2 ? (parts[0], parts[1]) : nil + }, uniquingKeysWith: { _, last in last }) + } + + self.onSubtitleTracks?(["subtitleTracks": subtitles]) + } } diff --git a/ios/Video/RCTVideoManager.m b/ios/Video/RCTVideoManager.m index f7b5bcb51a..0f0a942e48 100644 --- a/ios/Video/RCTVideoManager.m +++ b/ios/Video/RCTVideoManager.m @@ -66,6 +66,7 @@ @interface RCT_EXTERN_MODULE (RCTVideoManager, RCTViewManager) RCT_EXPORT_VIEW_PROPERTY(onReceiveAdEvent, RCTDirectEventBlock); RCT_EXPORT_VIEW_PROPERTY(onTextTracks, RCTDirectEventBlock); RCT_EXPORT_VIEW_PROPERTY(onAudioTracks, RCTDirectEventBlock); +RCT_EXPORT_VIEW_PROPERTY(onSubtitleTracks, RCTDirectEventBlock); RCT_EXTERN_METHOD(save : (NSDictionary*)options reactTag From 4d5729c3eeeb32b8749116f137af3c38aa40e42c Mon Sep 17 00:00:00 2001 From: coofzilla Date: Wed, 21 Feb 2024 12:26:21 +0900 Subject: [PATCH 2/8] refactor: return a string of the subtitles Push the parsing/formatting to the consumer side. --- ios/Video/RCTVideo.swift | 11 ++--------- 1 file changed, 2 insertions(+), 9 deletions(-) diff --git a/ios/Video/RCTVideo.swift b/ios/Video/RCTVideo.swift index f8a8ebcc5a..3b08746034 100644 --- a/ios/Video/RCTVideo.swift +++ b/ios/Video/RCTVideo.swift @@ -1389,15 +1389,8 @@ class RCTVideo: UIView, RCTVideoPlayerViewControllerDelegate, RCTPlayerObserverH } func handleLegibleOutput(strings: [NSAttributedString]) { - let subtitles = strings.map { subtitle in - Dictionary(subtitle.string - .split(separator: "\n") - .compactMap { line -> (String, String)? in - let parts = line.split(separator: "=", maxSplits: 1).map(String.init) - return parts.count == 2 ? (parts[0], parts[1]) : nil - }, uniquingKeysWith: { _, last in last }) + if let subtitles = strings.first { + self.onSubtitleTracks?(["subtitleTracks": subtitles.string]) } - - self.onSubtitleTracks?(["subtitleTracks": subtitles]) } } From e28e35502c8a08747fbaf397c53a47a45d73cb3f Mon Sep 17 00:00:00 2001 From: coofzilla Date: Thu, 22 Feb 2024 08:44:36 +0900 Subject: [PATCH 3/8] chore: add types for new subtitle feature --- src/Video.tsx | 10 ++++++++++ src/VideoNativeComponent.ts | 8 +++++++- src/types/events.ts | 5 +++++ 3 files changed, 22 insertions(+), 1 deletion(-) diff --git a/src/Video.tsx b/src/Video.tsx index 41d2aa6497..c789bf79d3 100644 --- a/src/Video.tsx +++ b/src/Video.tsx @@ -29,6 +29,7 @@ import type { OnProgressData, OnReceiveAdEventData, OnSeekData, + OnSubtitleTracksData, OnTextTracksData, OnTimedMetadataData, OnVideoAspectRatioData, @@ -93,6 +94,7 @@ const Video = forwardRef( onTimedMetadata, onAudioTracks, onTextTracks, + onSubtitleTracks, onVideoTracks, onAspectRatio, ...rest @@ -333,6 +335,13 @@ const Video = forwardRef( [onTextTracks], ); + const _onSubtitleTracks = useCallback( + (e: NativeSyntheticEvent) => { + onSubtitleTracks?.(e.nativeEvent); + }, + [onSubtitleTracks], + ); + const _onVideoTracks = useCallback( (e: NativeSyntheticEvent) => { onVideoTracks?.(e.nativeEvent); @@ -509,6 +518,7 @@ const Video = forwardRef( onTimedMetadata={_onTimedMetadata} onAudioTracks={_onAudioTracks} onTextTracks={_onTextTracks} + onSubtitleTracks={_onSubtitleTracks} onVideoTracks={_onVideoTracks} onVideoFullscreenPlayerDidDismiss={onFullscreenPlayerDidDismiss} onVideoFullscreenPlayerDidPresent={onFullscreenPlayerDidPresent} diff --git a/src/VideoNativeComponent.ts b/src/VideoNativeComponent.ts index 9692356129..ca46fcd402 100644 --- a/src/VideoNativeComponent.ts +++ b/src/VideoNativeComponent.ts @@ -7,7 +7,12 @@ import {NativeModules, requireNativeComponent} from 'react-native'; import type ResizeMode from './types/ResizeMode'; import type FilterType from './types/FilterType'; import type Orientation from './types/Orientation'; -import type {AdEvent, EnumValues, OnTextTracksTypeData} from './types'; +import type { + AdEvent, + EnumValues, + OnSubtitleTracksData, + OnTextTracksTypeData, +} from './types'; // -------- There are types for native component (future codegen) -------- // if you are looking for types for react component, see src/types/video.ts @@ -366,6 +371,7 @@ export interface VideoNativeProps extends ViewProps { onTimedMetadata?: (event: NativeSyntheticEvent) => void; // ios, android onAudioTracks?: (event: NativeSyntheticEvent) => void; // android onTextTracks?: (event: NativeSyntheticEvent) => void; // android + onSubtitleTracks?: (e: NativeSyntheticEvent) => void; // iOS onVideoTracks?: (event: NativeSyntheticEvent) => void; // android } diff --git a/src/types/events.ts b/src/types/events.ts index bfde7a4b70..c5ffc69fb2 100644 --- a/src/types/events.ts +++ b/src/types/events.ts @@ -79,6 +79,10 @@ export type OnTextTracksData = Readonly<{ textTracks: ReadonlyArray; }>; +export type OnSubtitleTracksData = Readonly<{ + subtitleTracks: string; +}>; + export type OnVideoTracksData = Readonly<{ videoTracks: ReadonlyArray< Readonly<{ @@ -181,6 +185,7 @@ export interface ReactVideoEvents { onTimedMetadata?: (e: OnTimedMetadataData) => void; //Android, iOS onAudioTracks?: (e: OnAudioTracksData) => void; // Android onTextTracks?: (e: OnTextTracksData) => void; //Android + onSubtitleTracks?: (e: OnSubtitleTracksData) => void; // iOS onVideoTracks?: (e: OnVideoTracksData) => void; //Android onAspectRatio?: (e: OnVideoAspectRatioData) => void; } From 5117688df27dc68578bd7c31a9333db4400b1278 Mon Sep 17 00:00:00 2001 From: coofzilla Date: Thu, 22 Feb 2024 09:42:39 +0900 Subject: [PATCH 4/8] chore: run swiftlint and swiftformat --- ios/Video/Features/RCTPlayerObserver.swift | 10 +++++++--- ios/Video/RCTVideo.swift | 2 +- 2 files changed, 8 insertions(+), 4 deletions(-) diff --git a/ios/Video/Features/RCTPlayerObserver.swift b/ios/Video/Features/RCTPlayerObserver.swift index 3b02f492d4..a11dcfec2c 100644 --- a/ios/Video/Features/RCTPlayerObserver.swift +++ b/ios/Video/Features/RCTPlayerObserver.swift @@ -62,7 +62,8 @@ class RCTPlayerObserver: NSObject, AVPlayerItemMetadataOutputPushDelegate, AVPla playerItem.add(metadataOutput) playerItem.add(legibleOutput) metadataOutput.setDelegate(self, queue: .main) - legibleOutput.setDelegate(self, queue: .main) } + legibleOutput.setDelegate(self, queue: .main) + } } var playerViewController: AVPlayerViewController? { @@ -115,8 +116,11 @@ class RCTPlayerObserver: NSObject, AVPlayerItemMetadataOutputPushDelegate, AVPla _handlers.handleTimeMetadataChange(timedMetadata: metadataGroup.items) } } - - func legibleOutput(_: AVPlayerItemLegibleOutput, didOutputAttributedStrings strings: [NSAttributedString], nativeSampleBuffers _: [Any], forItemTime _: CMTime) { + + func legibleOutput(_: AVPlayerItemLegibleOutput, + didOutputAttributedStrings strings: [NSAttributedString], + nativeSampleBuffers _: [Any], + forItemTime _: CMTime) { guard let _handlers else { return } _handlers.handleLegibleOutput(strings: strings) } diff --git a/ios/Video/RCTVideo.swift b/ios/Video/RCTVideo.swift index 3b08746034..ce9cdfcbdd 100644 --- a/ios/Video/RCTVideo.swift +++ b/ios/Video/RCTVideo.swift @@ -1387,7 +1387,7 @@ class RCTVideo: UIView, RCTVideoPlayerViewControllerDelegate, RCTPlayerObserverH self.onAudioTracks?(["audioTracks": audioTracks]) } } - + func handleLegibleOutput(strings: [NSAttributedString]) { if let subtitles = strings.first { self.onSubtitleTracks?(["subtitleTracks": subtitles.string]) From 8a7729c08fbcab0a51dcdfe584a889af34498e2f Mon Sep 17 00:00:00 2001 From: coofzilla Date: Thu, 22 Feb 2024 17:10:02 +0900 Subject: [PATCH 5/8] chore: add documentation for new onSubtitleTracks callback --- docs/pages/component/events.md | 19 ++++++++++++++++++- 1 file changed, 18 insertions(+), 1 deletion(-) diff --git a/docs/pages/component/events.md b/docs/pages/component/events.md index f45a447769..69925c0edc 100644 --- a/docs/pages/component/events.md +++ b/docs/pages/component/events.md @@ -493,7 +493,24 @@ Example: } ``` -Platforms: Android +### `onSubtitleTracks` +Callback function that is called when subtitles are available. This provides the actual subtitle content. + +Payload: + +Property | Type | Description +--- | --- | --- +`subtitleTracks` | `string` | The subtitles text content in a compatible format. + + +Example: +```javascript +{ + subtitleTracks: "This blade has a dark past.", +} +``` + +Platforms: iOS ### `onVideoTracks` Callback function that is called when video tracks change From a53885f9496cd6f9d03806dbd46fc3dead14e6a3 Mon Sep 17 00:00:00 2001 From: coofzilla Date: Fri, 23 Feb 2024 09:49:14 +0900 Subject: [PATCH 6/8] chore: added test uri; basic implementation of feature; hotfix onTextTracks added optional chaining for `return x?.selected` because tracks that don't have a track selected either by default or manually will return undefined and this can cause an error. --- examples/basic/src/VideoPlayer.tsx | 16 ++++++++++++++-- 1 file changed, 14 insertions(+), 2 deletions(-) diff --git a/examples/basic/src/VideoPlayer.tsx b/examples/basic/src/VideoPlayer.tsx index c38b68e062..dea2882ecf 100644 --- a/examples/basic/src/VideoPlayer.tsx +++ b/examples/basic/src/VideoPlayer.tsx @@ -33,6 +33,8 @@ import Video, { ResizeMode, SelectedTrack, DRMType, + OnSubtitleTracksData, + SelectedTrackType, } from 'react-native-video'; import ToggleControl from './ToggleControl'; import MultiValueControl, { @@ -120,7 +122,12 @@ class VideoPlayer extends Component { }, ]; - srcIosList = []; + srcIosList = [ + { + description: 'example to get subtitles', + uri: 'https://bitmovin-a.akamaihd.net/content/sintel/hls/playlist.m3u8', + }, + ]; srcAndroidList = [ { @@ -231,7 +238,7 @@ class VideoPlayer extends Component { onTextTracks = (data: OnTextTracksData) => { const selectedTrack = data.textTracks?.find((x: TextTrack) => { - return x.selected; + return x?.selected; }); this.setState({ @@ -248,6 +255,10 @@ class VideoPlayer extends Component { } }; + onSubtitleTracks = (data: OnSubtitleTracksData) => { + console.log(`Subtitles: ${JSON.stringify(data, null, 2)}`); + }; + onAspectRatio = (data: OnVideoAspectRatioData) => { console.log('onAspectRadio called ' + JSON.stringify(data)); this.setState({ @@ -749,6 +760,7 @@ class VideoPlayer extends Component { onLoad={this.onLoad} onAudioTracks={this.onAudioTracks} onTextTracks={this.onTextTracks} + onSubtitleTracks={this.onSubtitleTracks} onProgress={this.onProgress} onEnd={this.onEnd} progressUpdateInterval={1000} From fd76dd9c19ad934bc5aa2d510f3d9ee19c5e2f75 Mon Sep 17 00:00:00 2001 From: coofzilla Date: Mon, 26 Feb 2024 09:26:28 +0900 Subject: [PATCH 7/8] feat: rename onSubtitleTracks to onTextTrackDataChanged Renamed the onSubtitleTracks event to onTextTrackDataChanged across the codebase to clearly indicate the callback's purpose: being called when the text track's data changes. This change is reflected in the events documentation, example usage in VideoPlayer.tsx, and the relevant iOS implementation files for consistency and clarity, in line with PR feedback. --- docs/pages/component/events.md | 4 ++-- examples/basic/src/VideoPlayer.tsx | 8 ++++---- ios/Video/RCTVideo.swift | 4 ++-- ios/Video/RCTVideoManager.m | 2 +- src/Video.tsx | 14 +++++++------- src/VideoNativeComponent.ts | 6 ++++-- src/types/events.ts | 4 ++-- 7 files changed, 22 insertions(+), 20 deletions(-) diff --git a/docs/pages/component/events.md b/docs/pages/component/events.md index 69925c0edc..aa7aa0c2a7 100644 --- a/docs/pages/component/events.md +++ b/docs/pages/component/events.md @@ -493,8 +493,8 @@ Example: } ``` -### `onSubtitleTracks` -Callback function that is called when subtitles are available. This provides the actual subtitle content. +### `onTextTrackDataChanged` +Callback function that is called when new subtitle data is available. It provides the actual subtitle content for the current selected text track, if available (mainly WebVTT). Payload: diff --git a/examples/basic/src/VideoPlayer.tsx b/examples/basic/src/VideoPlayer.tsx index dea2882ecf..ed9f06f511 100644 --- a/examples/basic/src/VideoPlayer.tsx +++ b/examples/basic/src/VideoPlayer.tsx @@ -33,7 +33,7 @@ import Video, { ResizeMode, SelectedTrack, DRMType, - OnSubtitleTracksData, + OnTextTrackDataChangedData, SelectedTrackType, } from 'react-native-video'; import ToggleControl from './ToggleControl'; @@ -124,7 +124,7 @@ class VideoPlayer extends Component { srcIosList = [ { - description: 'example to get subtitles', + description: 'sintel with subtitles', uri: 'https://bitmovin-a.akamaihd.net/content/sintel/hls/playlist.m3u8', }, ]; @@ -255,7 +255,7 @@ class VideoPlayer extends Component { } }; - onSubtitleTracks = (data: OnSubtitleTracksData) => { + onTextTrackDataChanged = (data: OnTextTrackDataChangedData) => { console.log(`Subtitles: ${JSON.stringify(data, null, 2)}`); }; @@ -760,7 +760,7 @@ class VideoPlayer extends Component { onLoad={this.onLoad} onAudioTracks={this.onAudioTracks} onTextTracks={this.onTextTracks} - onSubtitleTracks={this.onSubtitleTracks} + onTextTrackDataChanged={this.onTextTrackDataChanged} onProgress={this.onProgress} onEnd={this.onEnd} progressUpdateInterval={1000} diff --git a/ios/Video/RCTVideo.swift b/ios/Video/RCTVideo.swift index ce9cdfcbdd..06d9d37a97 100644 --- a/ios/Video/RCTVideo.swift +++ b/ios/Video/RCTVideo.swift @@ -118,7 +118,7 @@ class RCTVideo: UIView, RCTVideoPlayerViewControllerDelegate, RCTPlayerObserverH @objc var onReceiveAdEvent: RCTDirectEventBlock? @objc var onTextTracks: RCTDirectEventBlock? @objc var onAudioTracks: RCTDirectEventBlock? - @objc var onSubtitleTracks: RCTDirectEventBlock? + @objc var onTextTrackDataChanged: RCTDirectEventBlock? @objc func _onPictureInPictureStatusChanged() { @@ -1390,7 +1390,7 @@ class RCTVideo: UIView, RCTVideoPlayerViewControllerDelegate, RCTPlayerObserverH func handleLegibleOutput(strings: [NSAttributedString]) { if let subtitles = strings.first { - self.onSubtitleTracks?(["subtitleTracks": subtitles.string]) + self.onTextTrackDataChanged?(["subtitleTracks": subtitles.string]) } } } diff --git a/ios/Video/RCTVideoManager.m b/ios/Video/RCTVideoManager.m index 0f0a942e48..e30f6c9cb5 100644 --- a/ios/Video/RCTVideoManager.m +++ b/ios/Video/RCTVideoManager.m @@ -66,7 +66,7 @@ @interface RCT_EXTERN_MODULE (RCTVideoManager, RCTViewManager) RCT_EXPORT_VIEW_PROPERTY(onReceiveAdEvent, RCTDirectEventBlock); RCT_EXPORT_VIEW_PROPERTY(onTextTracks, RCTDirectEventBlock); RCT_EXPORT_VIEW_PROPERTY(onAudioTracks, RCTDirectEventBlock); -RCT_EXPORT_VIEW_PROPERTY(onSubtitleTracks, RCTDirectEventBlock); +RCT_EXPORT_VIEW_PROPERTY(onTextTrackDataChanged, RCTDirectEventBlock); RCT_EXTERN_METHOD(save : (NSDictionary*)options reactTag diff --git a/src/Video.tsx b/src/Video.tsx index c789bf79d3..67e6cffcf0 100644 --- a/src/Video.tsx +++ b/src/Video.tsx @@ -29,7 +29,7 @@ import type { OnProgressData, OnReceiveAdEventData, OnSeekData, - OnSubtitleTracksData, + OnTextTrackDataChangedData, OnTextTracksData, OnTimedMetadataData, OnVideoAspectRatioData, @@ -94,7 +94,7 @@ const Video = forwardRef( onTimedMetadata, onAudioTracks, onTextTracks, - onSubtitleTracks, + onTextTrackDataChanged, onVideoTracks, onAspectRatio, ...rest @@ -335,11 +335,11 @@ const Video = forwardRef( [onTextTracks], ); - const _onSubtitleTracks = useCallback( - (e: NativeSyntheticEvent) => { - onSubtitleTracks?.(e.nativeEvent); + const _onTextTrackDataChanged = useCallback( + (e: NativeSyntheticEvent) => { + onTextTrackDataChanged?.(e.nativeEvent); }, - [onSubtitleTracks], + [onTextTrackDataChanged], ); const _onVideoTracks = useCallback( @@ -518,7 +518,7 @@ const Video = forwardRef( onTimedMetadata={_onTimedMetadata} onAudioTracks={_onAudioTracks} onTextTracks={_onTextTracks} - onSubtitleTracks={_onSubtitleTracks} + onTextTrackDataChanged={_onTextTrackDataChanged} onVideoTracks={_onVideoTracks} onVideoFullscreenPlayerDidDismiss={onFullscreenPlayerDidDismiss} onVideoFullscreenPlayerDidPresent={onFullscreenPlayerDidPresent} diff --git a/src/VideoNativeComponent.ts b/src/VideoNativeComponent.ts index ca46fcd402..f173a761e6 100644 --- a/src/VideoNativeComponent.ts +++ b/src/VideoNativeComponent.ts @@ -10,7 +10,7 @@ import type Orientation from './types/Orientation'; import type { AdEvent, EnumValues, - OnSubtitleTracksData, + OnTextTrackDataChangedData, OnTextTracksTypeData, } from './types'; @@ -371,7 +371,9 @@ export interface VideoNativeProps extends ViewProps { onTimedMetadata?: (event: NativeSyntheticEvent) => void; // ios, android onAudioTracks?: (event: NativeSyntheticEvent) => void; // android onTextTracks?: (event: NativeSyntheticEvent) => void; // android - onSubtitleTracks?: (e: NativeSyntheticEvent) => void; // iOS + onTextTrackDataChanged?: ( + event: NativeSyntheticEvent, + ) => void; // iOS onVideoTracks?: (event: NativeSyntheticEvent) => void; // android } diff --git a/src/types/events.ts b/src/types/events.ts index c5ffc69fb2..9982eda535 100644 --- a/src/types/events.ts +++ b/src/types/events.ts @@ -79,7 +79,7 @@ export type OnTextTracksData = Readonly<{ textTracks: ReadonlyArray; }>; -export type OnSubtitleTracksData = Readonly<{ +export type OnTextTrackDataChangedData = Readonly<{ subtitleTracks: string; }>; @@ -185,7 +185,7 @@ export interface ReactVideoEvents { onTimedMetadata?: (e: OnTimedMetadataData) => void; //Android, iOS onAudioTracks?: (e: OnAudioTracksData) => void; // Android onTextTracks?: (e: OnTextTracksData) => void; //Android - onSubtitleTracks?: (e: OnSubtitleTracksData) => void; // iOS + onTextTrackDataChanged?: (e: OnTextTrackDataChangedData) => void; // iOS onVideoTracks?: (e: OnVideoTracksData) => void; //Android onAspectRatio?: (e: OnVideoAspectRatioData) => void; } From 9e503021d56617860a9cb3aaf886f216131375c6 Mon Sep 17 00:00:00 2001 From: coofzilla Date: Tue, 27 Feb 2024 06:59:00 +0900 Subject: [PATCH 8/8] chore: omit target property target could be confusing for users so we have removed it. using the delete operator instead of using {target,...eventData} as that would give an eslint error about unused vars. --- src/Video.tsx | 8 ++++++-- 1 file changed, 6 insertions(+), 2 deletions(-) diff --git a/src/Video.tsx b/src/Video.tsx index 67e6cffcf0..e0abfbbb8e 100644 --- a/src/Video.tsx +++ b/src/Video.tsx @@ -336,8 +336,12 @@ const Video = forwardRef( ); const _onTextTrackDataChanged = useCallback( - (e: NativeSyntheticEvent) => { - onTextTrackDataChanged?.(e.nativeEvent); + ( + e: NativeSyntheticEvent, + ) => { + const {...eventData} = e.nativeEvent; + delete eventData.target; + onTextTrackDataChanged?.(eventData as OnTextTrackDataChangedData); }, [onTextTrackDataChanged], );