NativeMediaView not showing up in 0.7.6

[vinz-mehra]

It's working fine in 0.6.6 but it disappeared as soon as I updated the package. Everything else is showing up but the NativeMediaView is not showing.

`const onNativeAdLoaded = (event: NativeAd) => {
setLoading(false);
setLoaded(true);
setError(false);
setAspectRatio(event.aspectRatio);
if (event.images) {
if (event.images.length > 0) {
const imageUrl = event.images[0].url;
setImage(imageUrl);
}
}
};

useEffect(() => {
if (!loaded) {
nativeAdRef.current?.loadAd();
}
console.log("Ad loaded", nativeAdRef.current);
}, [loaded]);

return (
<>
<NativeAdView
enableSwipeGestureOptions={{
tapsAllowed: true,
}}
ref={nativeAdRef}
// onAdLoaded={onAdLoaded}
onAdFailedToLoad={(e) => {
console.log("Ad failed to load", e);
}}
// onAdLeftApplication={onAdLeftApplication}
// onAdClicked={onAdClicked}
// onAdImpression={onAdImpression}
onNativeAdLoaded={onNativeAdLoaded}
refreshInterval={60000}
delayAdLoading={0}
style={{
width: "100%",
alignSelf: "center",
}}
videoOptions={{
customControlsRequested: false,
}}
mediationOptions={{
nativeBanner: true,
}}
adUnitID={
type === "contentcard" ? CONTENT_CARD_AD_UNIT_ID : CARD_AD_UNIT_ID
}
repository={type === "contentcard" ? "contentCardAd" : "cardAd"}
>
<View
style={{
width: "100%",
height: "100%",
position: "absolute",
justifyContent: "center",
alignItems: "center",
opacity: !loading && !error && loaded ? 0 : 1,
zIndex: !loading && !error && loaded ? 0 : 10,
}}
>
{!loading && }
{error && <Text style={{ color: textColor }}>:-}

{type === "contentcard" ? (

) : (

)}

</>
);
};

export default memo(AdView);`

`const CardAd = ({ aspectRatio, image }: AdViewProps) => {
const textColor = useThemeColor(
{ light: "#202020", dark: "#ECEDEE" },
"text"
);
const primaryColor = useThemeColor({}, "primary");
const userPrefFontSize = useFontSize();
const styles = StyleSheet.create({
headingText: {
paddingHorizontal: 10,
margin: scale(10),
fontSize: userPrefFontSize.h3,
fontWeight: "bold",
marginBottom: 10,
color: textColor,
textAlign: "center",
},
icon: {
marginTop: scale(30),
margin: 10,
width: scale(80),
height: scale(80),
alignSelf: "center",
borderRadius: 10,
},
image: {
width: "100%",
height: 250,
},
advertiser: {
fontSize: scale(12),
color: "gray",
marginHorizontal: 5,
},
adAttribution: {
top: 5,
position: "absolute",
backgroundColor: "#D3D3D3",
height: scale(22),
width: scale(22),
padding: 1,
marginLeft: 5,
borderRadius: 5,
justifyContent: "center",
},
adAttributionText: {
fontSize: scale(12),
color: "#000",
textAlign: "center",
},
tagLine: {
paddingHorizontal: 10,
margin: 10,
fontSize: userPrefFontSize.body,
textAlign: "center",
color: textColor,
},
});
return (

<MediaView type={"card"} image={image} aspectRatio={aspectRatio} />


<StarRatingView
style={{
alignSelf: "center",
}}
/>
<View style={{ marginTop: 20 }}>

<View
style={{
marginTop: 20,
borderRadius: 5,
overflow: "hidden",
marginHorizontal: 15,
}}
>
<CallToActionView
buttonAndroidStyle={{
borderRadius: 5,
backgroundColor: primaryColor,
}}
style={[
{
minHeight: scale(50),
justifyContent: "center",
alignItems: "center",
width: "100%",
marginHorizontal: 10,
backgroundColor: primaryColor,
},
]}
textStyle={{
fontSize: userPrefFontSize.body,
fontWeight: "bold",
flexWrap: "wrap",
textAlign: "center",
color: "#ffffff",
}}
/>


Ad


);
};

export default memo(CardAd);
`

`const MediaView = ({ aspectRatio, image }: AdViewProps) => {
const bg = useThemeColor({ light: "#A1CEDC", dark: "#1D3D47" }, "card");

const getHeight = () => {
if (!aspectRatio) return verticalScale(240);
const adHeight = Dimensions.get("window").width / aspectRatio;
return Math.min(verticalScale(240), adHeight);
};

if (!image)
return (
<NativeMediaView
style={{
width: Dimensions.get("window").width,
height: verticalScale(240),
alignSelf: "center",
backgroundColor: bg,
}}
/>
);

return (
<ImageBackground
source={{ uri: image }}
resizeMode="cover"
blurRadius={100}
style={{
height: verticalScale(240),
width: Dimensions.get("window").width,
alignContent: "center",
justifyContent: "center",
backgroundColor: bg,
}}
>
<NativeMediaView
style={{
width: Dimensions.get("window").width,
height: getHeight(),
alignSelf: "center",
}}
/>

);
};

export default React.memo(MediaView);
`

[AftabUfaq]

same issue in androd.in iOS woking fine

[jinkook0126]

same issue on v0.73.6