SafeAreaView default style does not render

[SuhitAgarwal]

If I add some custom styles to the SafeAreaView component, for example:

<SafeAreaView style={styles.pageContainer}>
  {...childComponents}
</SafeAreaView>

export const styles = StyleSheet.create({
  pageContainer: {
    backgroundColor: '#fff',
    alignItems: 'center',
    justifyContent: 'center',
  },
});

without a flex: 1, style, it fails to show the page at all.

I could be overwriting the default styles, in which case, external styles should be rendered as such so as to not overwrite it possibly

[SuhitAgarwal]

Nevermind, my SafeAreaView was rendered within a different component