113 lines
3.1 KiB
TypeScript
113 lines
3.1 KiB
TypeScript
import { MainColor } from "@/constants/color-palet";
|
|
import { GStyles } from "@/styles/global-styles";
|
|
import {
|
|
ImageBackground,
|
|
Keyboard,
|
|
KeyboardAvoidingView,
|
|
Platform,
|
|
ScrollView,
|
|
TouchableWithoutFeedback,
|
|
View,
|
|
} from "react-native";
|
|
import { SafeAreaView } from "react-native-safe-area-context";
|
|
|
|
interface ViewWrapperProps {
|
|
children: React.ReactNode;
|
|
withBackground?: boolean;
|
|
footerComponent?: React.ReactNode;
|
|
}
|
|
|
|
const ViewWrapper = ({
|
|
children,
|
|
withBackground = false,
|
|
footerComponent,
|
|
}: ViewWrapperProps) => {
|
|
const assetBackground = require("../../assets/images/main-background.png");
|
|
|
|
return (
|
|
<>
|
|
<KeyboardAvoidingView
|
|
behavior={Platform.OS === "ios" ? "padding" : "height"}
|
|
style={{ flex: 1, backgroundColor: MainColor.darkblue }}
|
|
>
|
|
<ScrollView
|
|
contentContainerStyle={{ flexGrow: 1 }}
|
|
keyboardShouldPersistTaps="handled"
|
|
>
|
|
<TouchableWithoutFeedback onPress={Keyboard.dismiss}>
|
|
<View style={{ flex: 1 }}>
|
|
{withBackground ? (
|
|
<ImageBackground
|
|
source={assetBackground}
|
|
resizeMode="cover"
|
|
style={GStyles.imageBackground}
|
|
>
|
|
<View style={GStyles.containerWithBackground}>
|
|
{children}
|
|
</View>
|
|
</ImageBackground>
|
|
) : (
|
|
<View style={GStyles.container}>{children}</View>
|
|
)}
|
|
</View>
|
|
</TouchableWithoutFeedback>
|
|
</ScrollView>
|
|
|
|
{footerComponent ? (
|
|
<SafeAreaView
|
|
edges={["bottom"]}
|
|
style={{
|
|
backgroundColor: MainColor.darkblue,
|
|
}}
|
|
>
|
|
{footerComponent}
|
|
</SafeAreaView>
|
|
) : (
|
|
<SafeAreaView
|
|
edges={["bottom"]}
|
|
style={{ backgroundColor: MainColor.darkblue }}
|
|
/>
|
|
)}
|
|
</KeyboardAvoidingView>
|
|
|
|
{/* <SafeAreaView
|
|
edges={["bottom"]}
|
|
style={{ flex: 1, backgroundColor: MainColor.soft_darkblue }}
|
|
>
|
|
<KeyboardAvoidingView
|
|
behavior={Platform.OS === "ios" ? "padding" : "height"}
|
|
style={{ flex: 1 }}
|
|
>
|
|
<ScrollView contentContainerStyle={{ flexGrow: 1 }}>
|
|
{withBackground ? (
|
|
<ImageBackground
|
|
source={assetBackground}
|
|
resizeMode="cover"
|
|
style={GStyles.imageBackground}
|
|
>
|
|
<View style={GStyles.containerWithBackground}>{children}</View>
|
|
</ImageBackground>
|
|
) : (
|
|
<View style={GStyles.container}>{children}</View>
|
|
)}
|
|
</ScrollView>
|
|
|
|
{footerComponent ? (
|
|
<SafeAreaView
|
|
edges={["bottom"]}
|
|
style={{
|
|
// flex: 1,
|
|
backgroundColor: MainColor.darkblue,
|
|
}}
|
|
>
|
|
{footerComponent}
|
|
</SafeAreaView>
|
|
) : null}
|
|
</KeyboardAvoidingView>
|
|
</SafeAreaView> */}
|
|
</>
|
|
);
|
|
};
|
|
|
|
export default ViewWrapper;
|