No safe area insets value available. Make sure you are rendering `<SafeAreaProvider>` at the top of your app. - how can i ressolve this error?

                                        Codes

export default class CalorieScreen extends Component {
  constructor(){
    super();
    this.state={text:''}
  }
  render() {
    const { calories } = this.state;
    return (
       <View style={styles.container}>
        <Header
          backgroundColor={'#9c8210'}
          centerComponent={{
            text: 'Monkey Chunky',
            style: { padding:100, color: '#fff', fontSize: 20 },
          }}
        />


            </View>

    );
  }
}

I created a login screen that goes into my calorie screen when i click the buttun it takes me to the screen but this error appears