¿Cómo ingresar una matriz en una tabla de 1 columna? La audiencia número 2 tiene 2 películas B y C. Quiero convertirme en 1 columna. ex [Película B, Película C] en Columna Película.

Mi mesa => La imagen de la mesa

 const AudienceListComponent = () => { const [audience, setAudience] = useState([]) console.log("audience", audience) const getAllAudience = () => { AudienceService.getAllAudiences().then((response) => { console.log('response', response) setAudience(response.data) }) } useEffect(() => { getAllAudience() }, []) return ( <div> <table className="table table-bordered table-bordered"> <thead className="table-dark"> <tr> <th>No</th> <th>Audience Name</th> <th>Film</th> </tr> </thead> <tbody> { audience.map((aud, i) => ( <tr key={aud.id}> <td>{i + 1}</td> <td>{aud.name}</td> {aud.film.map(films => <td>{films.title}</td> )} </tr> )) } </tbody> </table> </div> ); }; export default AudienceListComponent;