React native error: JSX element type 'AppLoading' does not have any construct or call signatures?

I am coding an react native app, and I am trying to import some custom fonts in the app. But, when the font is loading, I want to display the expo's loading screen or AppLoading Component and when I insert the component in the render tree it gives me this error:JSX element type 'AppLoading' does not have any construct or call signatures.

Code:

// Importing packagesimport { StyleSheet, View } from "react-native";import React, { useState } from "react";import redux, { createStore } from "redux";import { Provider } from "react-redux";import reducers from "./redux/index";import AppLoading from "expo";import Router from "./Router";import loadFonts from "./fonts";// App componentconst App:React.FC = () => {  // Redux store  const store: redux.Store = createStore(reducers);  // State  let [loaded, setLoaded] = useState(false);  if (loaded) {    // Render app    return (<React.StrictMode><Provider store={store}><View style={styles.container}>            {/* Router */}<Router /></View></Provider></React.StrictMode>    );  } else {    return (<AppLoading startAsync={loadFonts} onFinish={() => setLoaded(true)} />    );  }};// Export appexport default App;

I have no idea how this error works please note that I have just came from reactjs so I might make some silly mistakes.

Thanks!