Нужно вывести данные api из массива, внутри которого еще один массив

import { useParams, Link } from 'react-router-dom'
import React, { useState, useEffect } from 'react'
import axios from "axios";
const link='https://api.spaceflightnewsapi.net/v3/articles/';
const link2='https://api.spaceflightnewsapi.net/v3/articles/launch/';
let linkSwitch2='', linkSwitch='';
 
const SingleNews = () => {
    const {id} = useParams();
    const [news, setNews] = useState(null);
    const [news2, setNews2] = useState(null);
    linkSwitch=link+id;
    linkSwitch2=link2+id;
    const getNews = () => {
        axios.get(linkSwitch)
            .then ((response) => {
                setNews(response.data);
            })
    }
   const getNews2 = () => {
        axios.get(linkSwitch2)
            .then ((response) => {
                setNews2(response.data.launches);
            })
    }
 
    useEffect(() => {
        getNews();
        getNews2()
    }, [id])
 
    return (
        <div>
            {news && (
                <>
                    <h1>{news.title}</h1>
                    <h3>{news.newsSite}</h3>
                    <h3>{news.summary}</h3>
 
                </>
            )}
            {news2 && (
                <>
                    1
                    <h1>{news2.id}</h1>
 
                </>
            )}
            <Link to="/about">About Page</Link>
            <br />
            <Link to="/news">News</Link>
        </div>
    )
}