Estoy tratando de hacer un modelo reproducible de video cuando hago clic en el enlace del video, pero no puedo entender qué hacer. Hice lo mejor que pude pero no puedo llegar a la solución. Elegí una lógica de Internet pero no funcionó. También he comentado el apartado de modal. Gracias de antemano...

código .................................................. ...............

 import React,{useState, useEffect } from "react"; import './App.css'; import Axios from "axios"; import ModalVideo from 'react-modal-video';/// function App() { const [isOpen, setOpen] = useState(false)/// const [resdata, setresdata] = useState([]) const showurl = 'http://localhost/react%20project/newapp/src/show.php?function=show'; const updtcomp = () => { Axios.get(showurl) .then(res =>{ setresdata(res.data) console.log(res) }) .catch(err => { console.log(err) }) } useEffect(() => { Axios.get(showurl) .then(res =>{ setresdata(res.data) console.log(res) }) .catch(err => { console.log(err) }) }, []) console.log(resdata) return( <div className="App"><br/> <div className="tblfrm"> <table> <thead> <tr> <td>ID</td> <td>Name</td> <td>Date</td> <td>V-Links</td> <td>Action</td> </tr> </thead> <tbody> { resdata.length > 0 && resdata.map( resdata => ( <tr> <td key={resdata.Id}>{resdata.Id}</td> <td key={resdata.Name}>{resdata.Name}</td> <td key={resdata.date}>{resdata.date}</td> {/* trying to make a video playable modal on click of the link */} <td key={resdata.video}> <a onClick={()=> setOpen(true)} href={resdata.video}> {resdata.video} </a> <ModalVideo isOpen={isOpen} onClose={()=> setOpen(false)}/> </td> <td> <button>EDIT</button> &nbsp; <button>DELETE</button> </td> </tr> ) ) } </tbody> </table> </div> </div> ) } export default App;