Chore: Clean SafeAreaView - Typescript (#3907)

* chore: clean SafeAreaView

* fix type

* update supported types
This commit is contained in:
Gleidson Daniel Silva 2022-03-31 19:46:11 -03:00 committed by GitHub
parent e0459aed89
commit cfe352dfbc
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
1 changed files with 19 additions and 17 deletions

View File

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