import React from 'react'
import { colorsV2 } from '../Colors'
import { StyleProp, ViewStyle, View } from 'react-native'
import { useSafeAreaInsets } from 'react-native-safe-area-context'

interface Props {
  topColor?: string
  style?: StyleProp<ViewStyle>
}

export const CommonScreenContainer: React.FC<Props> = ({
  topColor = colorsV2.black,
  style,
  children,
}) => {
  const insets = useSafeAreaInsets()

  return (
    <View
      style={[
        {
          flex: 1,
          backgroundColor: topColor,
          paddingTop: insets.top,
          paddingBottom: 0,
        },
        style,
      ]}
    >
      {children}
    </View>
  )
}