From 15f3de83e455e4019c15d9e25c7df1ee5087cf16 Mon Sep 17 00:00:00 2001
From: Adrian Castro <22133246+castdrian@users.noreply.github.com>
Date: Tue, 6 Feb 2024 10:45:59 +0100
Subject: [PATCH] chore: use nativewind css classes with view instead of
 safeareaview

---
 apps/expo/src/app/video-player.tsx | 25 ++++---------------------
 1 file changed, 4 insertions(+), 21 deletions(-)

diff --git a/apps/expo/src/app/video-player.tsx b/apps/expo/src/app/video-player.tsx
index 223ef8d..fcdde2c 100644
--- a/apps/expo/src/app/video-player.tsx
+++ b/apps/expo/src/app/video-player.tsx
@@ -4,8 +4,7 @@ import type {
   TextTracks,
 } from "react-native-video";
 import React, { useEffect, useState } from "react";
-import { ActivityIndicator, StyleSheet } from "react-native";
-import { SafeAreaView } from "react-native-safe-area-context";
+import { ActivityIndicator, View } from "react-native";
 import Video, { TextTracksType } from "react-native-video";
 import { useLocalSearchParams, useRouter } from "expo-router";
 import * as ScreenOrientation from "expo-screen-orientation";
@@ -142,12 +141,12 @@ const VideoPlayer: React.FC<VideoPlayerProps> = ({ data }) => {
   };
 
   return (
-    <SafeAreaView style={styles.container}>
+    <View className="flex-1 items-center justify-center bg-black">
       <Video
         ref={videoRef}
         source={videoSrc}
         // textTracks={textTracks} // breaks playback
-        style={styles.fullScreen}
+        className="absolute inset-0"
         fullscreen={true}
         paused={false}
         controls={true}
@@ -155,26 +154,10 @@ const VideoPlayer: React.FC<VideoPlayerProps> = ({ data }) => {
         onReadyForDisplay={onReadyForDisplay}
       />
       {isLoading && <ActivityIndicator size="large" color="#0000ff" />}
-    </SafeAreaView>
+    </View>
   );
 };
 
-const styles = StyleSheet.create({
-  container: {
-    flex: 1,
-    justifyContent: "center",
-    alignItems: "center",
-    backgroundColor: "black",
-  },
-  fullScreen: {
-    position: "absolute",
-    top: 0,
-    left: 0,
-    bottom: 0,
-    right: 0,
-  },
-});
-
 interface Caption {
   type: "srt" | "vtt";
   id: string;