import React, { ReactNode } from 'react';
import {
  ImageBackground,
  ImageSourcePropType,
  StyleSheet,
  ViewStyle,
} from 'react-native';

export const ImageBgContainer = ({
  bg,
  children,
}: {
  bg: ImageSourcePropType;
  children: ReactNode;
}) => {
  return (
    <ImageBackground
      source={bg}
      resizeMode="cover"
      style={styles.ImageBackground}
    >
      {children}
    </ImageBackground>
  );
};

type Style = {
  ImageBackground: ViewStyle;
};

const styles = StyleSheet.create<Style>({
  ImageBackground: { flex: 1 },
});