I want to create a custom container component that can be reused to contain other components. Here is the container:

const BaseView = () => {
  return (
    <SafeAreaView>
      <ScrollView>
        <View>
        </View>
      </ScrollView>
    </SafeAreaView>
  );
};

Here is how I want to use it:

export default function App() {
  return (
    <BaseView>
      <Text>Hello World</Text>
    </BaseView>
  );
}

But when using it, BaseView shows an issue: Type '{ children: Element[]; }' has no properties in common with type 'IntrinsicAttributes'. So how should I modify this?