fix(deps): Remove usage of deprecated SafeAreaView in the playground (#5241)

* fix(deps): Remove usage of deprecated SafeAreaView in the playground

* Adds changelog

Author: antonis

CHANGELOG.md

@@ -17,6 +17,7 @@
 - Updates `sentry-xcode.sh` and the default settings for the `project.pbxproj` to fix the issue with escape patterns in Xcode that leaded to errors during "Bundle React Native code and images" stage ([#5221](https://github.com/getsentry/sentry-react-native/pull/5221))
 - Fixes .env file loading in Expo sourcemap uploads ([#5210](https://github.com/getsentry/sentry-react-native/pull/5210))
 - Fixes the issue with changing immutable metadata structure in the contructor of `ReactNativeClient`. This structure is getting re-created instead of being modified to ensure IP address is only inferred by Relay if `sendDefaultPii` is `true` ([#5202](https://github.com/getsentry/sentry-react-native/pull/5202))
+- Removes usage of deprecated `SafeAreaView` ([#5241](https://github.com/getsentry/sentry-react-native/pull/5241))
 
 ### Dependencies
 

packages/core/src/js/playground/modal.tsx

@@ -7,7 +7,6 @@ import {
   Modal,
   Platform,
   Pressable,
-  SafeAreaView,
   StyleSheet,
   Text,
   useColorScheme,
@@ -116,7 +115,7 @@ export const SentryPlayground = ({
         setShow(false);
       }}
     >
-      <SafeAreaView style={styles.background}>
+      <View style={styles.background}>
         <View style={styles.container}>
           <Text style={styles.welcomeText}>Welcome to Sentry Playground!</Text>
           <Animated.View
@@ -185,7 +184,7 @@ export const SentryPlayground = ({
             />
           </View>
         </View>
-      </SafeAreaView>
+      </View>
     </Modal>
   );
 };

packages/core/test/playground/__snapshots__/modal.test.tsx.snap

@@ -8,7 +8,7 @@ exports[`PlaygroundComponent matches the snapshot with no props 1`] = `
   presentationStyle="formSheet"
   visible={true}
 >
-  <RCTSafeAreaView
+  <View
     style={
       {
         "alignItems": "center",
@@ -765,7 +765,7 @@ exports[`PlaygroundComponent matches the snapshot with no props 1`] = `
         </View>
       </View>
     </View>
-  </RCTSafeAreaView>
+  </View>
 </Modal>
 `;
 
@@ -777,7 +777,7 @@ exports[`PlaygroundComponent matches the snapshot with project id and organizati
   presentationStyle="formSheet"
   visible={true}
 >
-  <RCTSafeAreaView
+  <View
     style={
       {
         "alignItems": "center",
@@ -1534,6 +1534,6 @@ exports[`PlaygroundComponent matches the snapshot with project id and organizati
         </View>
       </View>
     </View>
-  </RCTSafeAreaView>
+  </View>
 </Modal>
 `;