From cfe352dfbc9d44b69bcd4f86f27111c14248720f Mon Sep 17 00:00:00 2001
From: Gleidson Daniel Silva <gleidson10daniel@hotmail.com>
Date: Thu, 31 Mar 2022 19:46:11 -0300
Subject: [PATCH] Chore: Clean SafeAreaView - Typescript (#3907)

* chore: clean SafeAreaView

* fix type

* update supported types
---
 app/containers/SafeAreaView.tsx | 36 +++++++++++++++++----------------
 1 file changed, 19 insertions(+), 17 deletions(-)

diff --git a/app/containers/SafeAreaView.tsx b/app/containers/SafeAreaView.tsx
index 3794fdb9..2ffae53e 100644
--- a/app/containers/SafeAreaView.tsx
+++ b/app/containers/SafeAreaView.tsx
@@ -1,9 +1,9 @@
 import React from 'react';
-import { StyleSheet } from 'react-native';
+import { StyleSheet, ViewProps } from 'react-native';
 import { SafeAreaView as SafeAreaContext } from 'react-native-safe-area-context';
 
 import { themes } from '../constants/colors';
-import { withTheme } from '../theme';
+import { useTheme } from '../theme';
 
 const styles = StyleSheet.create({
 	view: {
@@ -11,22 +11,24 @@ const styles = StyleSheet.create({
 	}
 });
 
-interface ISafeAreaView {
-	testID?: string;
-	theme?: string;
+type SupportedChildren = React.ReactElement | React.ReactElement[] | null;
+type TSafeAreaViewChildren = SupportedChildren | SupportedChildren[];
+
+interface ISafeAreaView extends ViewProps {
 	vertical?: boolean;
-	style?: object;
-	children: React.ReactNode;
+	children: TSafeAreaViewChildren;
 }
 
-const SafeAreaView = React.memo(({ style, children, testID, theme, vertical = true, ...props }: ISafeAreaView) => (
-	<SafeAreaContext
-		style={[styles.view, { backgroundColor: themes[theme!].auxiliaryBackground }, style]}
-		edges={vertical ? ['right', 'left'] : undefined}
-		testID={testID}
-		{...props}>
-		{children}
-	</SafeAreaContext>
-));
+const SafeAreaView = React.memo(({ style, children, vertical = true, ...props }: ISafeAreaView) => {
+	const { theme } = useTheme();
+	return (
+		<SafeAreaContext
+			style={[styles.view, { backgroundColor: themes[theme].auxiliaryBackground }, style]}
+			edges={vertical ? ['right', 'left'] : undefined}
+			{...props}>
+			{children}
+		</SafeAreaContext>
+	);
+});
 
-export default withTheme(SafeAreaView);
+export default SafeAreaView;