WebView v-11.2.3 component from React Native v-0.63 not loading its content (using expo cli)

As the question says my Webview component wont load its content. I have no errors poping up or any problem in the conosle related to WebView. I am using expo.

On the other hand when using Iframe I have no problem loading the content running test on web browser but wont work when running test on mobile device. I have tried every solution proposed by others in here but nothing seems to work. I even tried using the iframe inside the WebView using html instead of uri, also nesting the WebView component into a View and giving it flex:1 but still nothing comes up on the screen but a small red dot up in the right corner.

As you can see all the test I've done with the commented code. The first (commented) function is using the Iframe component and the second (not commented) is only WebView. My code looks like this:

import React from 'react';
import { StyleSheet, Text, Button, View, Dimensions } from 'react-native';
import Iframe from 'react-iframe';
import Header from './Header';
import ButtonMenu from './ButtonMenu';
import { WebView } from 'react-native-webview';


const deviceHeight = Dimensions.get('window').height;
const deviceWidth = Dimensions.get('window').width;


// export default function NatureQuestGps({navigation}) {
//     return (
      
//         <View style={styles.pageNatureQuest}>
//         <View style={styles.headerContainer}>
//         <Header/>
//         <ButtonMenu color='#49AC72' onPress={()=> navigation.toggleDrawer()} />
//         </View>
//         <Iframe  url="https://www.google.com/maps/d/embed?mid=11fEhEZiv72kKKy7XbbQ3GIufEcTpWUa2"
//         width="400px"
//         height="400px"
//         display="initial"
//         position="relative"/>
//         </View>
    
//     );
// }

export default function NatureQuestGps() {
  return (
    <View style={{ flex: 1, alignItems: 'flex-end' }}>
      <WebView 
      source= {{ uri: 'https://www.google.com/maps/d/embed?mid=11fEhEZiv72kKKy7XbbQ3GIufEcTpWUa2'}}
      style={styles.webview}
      javaScriptEnabled={true}
      domStorageEnabled={true}
      startInLoadingState={false}
      scalesPageToFit={true}
      />
    </View>
  );
}


const styles = StyleSheet.create({
    pageNatureQuest:{
      flex:1,
      flexDirection:'column',
      alignItems:'center',
    },
    headerContainer: {
      width:'100%',
      backgroundColor:'#ededed',
      },

    webview: {
      flex: 1,
      backgroundColor: 'yellow',
      width: deviceWidth,
      height: deviceHeight
    }
  }); 

Thanks in advance for anyone taking the time to help