chore(examples/basic): minor sample fixes (#3717)

* fix(ts): onPlaybackRateChangeData was not correctly typed

* fix: ensure tracks are well displayed in the sample

* fix: fix sample style & avoid changing channel onEnd when looping is enable

examples/basic/src/VideoPlayer.tsx

@@ -360,7 +360,9 @@ class VideoPlayer extends Component {
   };
 
   onEnd = () => {
-    this.channelUp();
+    if (!this.state.loop) {
+      this.channelUp();
+    }
   };
 
   onPlaybackRateChange = (data: OnPlaybackRateChangeData) => {
@@ -593,8 +595,8 @@ class VideoPlayer extends Component {
 
   renderTopControl() {
     return (
-      <>
+      <View style={styles.topControlsContainer}>
-        <Text style={[styles.controlOption]}>
+        <Text style={styles.controlOption}>
           {this.srcList[this.state.srcListId]?.description || 'local file'}
         </Text>
         <View>
@@ -602,12 +604,12 @@ class VideoPlayer extends Component {
             onPress={() => {
               this.toggleControls();
             }}>
-            <Text style={[styles.leftRightControlOption]}>
+            <Text style={styles.leftRightControlOption}>
               {this.state.showRNVControls ? 'Hide controls' : 'Show controls'}
             </Text>
           </TouchableOpacity>
         </View>
-      </>
+      </View>
     );
   }
 
@@ -1032,6 +1034,9 @@ const styles = StyleSheet.create({
     width: 100,
     height: 40,
   },
-});
+  topControlsContainer: {
+    paddingTop: 30,
+  }
+ });
 
 export default VideoPlayer;