CompatInsets.tsx

const CompatSafeAreaView = ({
  forceInsets = {},
  children,
}: {
  forceInsets?: {
    top?: boolean;
    right?: boolean;
    bottom?: boolean;
    left?: boolean;
  };
  children?: React.ReactNode;
}) => {
  return (
    <SafeAreaView>
      {insets => {
        const top = forceInsets.top === true ? 0 : insets.top;
        const right = forceInsets.right === true ? 0 : insets.right;
        const bottom = forceInsets.bottom === true ? 0 : insets.bottom;
        const left = forceInsets.left === true ? 0 : insets.left;
        return (
          <View
            style={{
              flex: 1,
              paddingTop: top,
              paddingRight: right,
              paddingBottom: bottom,
              paddingLeft: left,
            }}
          >
            {children}
          </View>
        );
      }}
    </SafeAreaView>
  );
};