import React, { useState } from 'react';
import { View } from 'react-native';
import YoutubePlayer from 'react-native-youtube-iframe';
interface YoutubePlayerProps {
 mediaUrl: string;
}
const YoutubePlayerComponent: React.FC<YoutubePlayerProps> = ({ mediaUrl }) => {
 const getVideoId = (url: string): string => {
 const videoIdMatch = url.match(/(?:https?:\/\/)?(?:www\.)?(?:youtube\.com\/(?:[^\/\n\s]+\/\S+\/|(?:v|e(?:mbed)?)\/|\S*?[?&]v=)|youtu\.be\/)([a-zA-Z0-9_-]{11})/);
 return videoIdMatch ? videoIdMatch[1] : '';
 };
 return (
 <View>
 <YoutubePlayer
 height={350}
 videoId={getVideoId(mediaUrl)}
 onError={(e) => console.error('Error loading video', e)}
 />
 </View>
 );
};