Expo App: No MapDisplay in MapView

[piyushjoshi1016]

import React, { FC, useRef } from "react"
import { observer } from "mobx-react-lite"
import {
StyleSheet,
View,
} from "react-native"
import { AppTabNavigatorScreenProps } from "app/navigators/AppTabNavigator"
import Mapbox from "@rnmapbox/maps";

Mapbox.setAccessToken("MY-ACCESS-TOKEN-IS-HERE");

const MAP_ANIMATION_DURATION = 1000;

interface ProfileScreenProps extends AppTabNavigatorScreenProps<"Profile"> {}
export const ProfileScreen: FC = observer(function ProfileScreen() {

const mapViewRef = useRef(null);
const mapCameraRef = useRef(null);
const animateCardView = useRef(

).current;
const markerRef = useRef(null);

return (

<Mapbox.MapView
ref={mapViewRef}
style={styles.map}
logoEnabled={false}
attributionEnabled={false}
styleURL={Mapbox.StyleURL.Street}
// zoomEnabled={false}
rotateEnabled={false}
compassEnabled={false}
scaleBarEnabled={false}
>
<Mapbox.Camera
centerCoordinate={[26.758, 27.859]}
zoomLevel={5}
/>
</Mapbox.MapView>

)
})

const styles = StyleSheet.create({
page: {
flex: 1,
justifyContent: "center",
alignItems: "center",
backgroundColor: "tomato"
},
map: {
position: "absolute",
top: 0,
bottom: 0,
width: "100%",
borderWidth:2,
borderColor: "white",
}
});

This is what I am getting. Just a Blank screen. I tried researching a lot but found no solution for this.