Display CoinGecko Data inside table - React JS

Question

I am currently building a table that display crypto currency in React. I was able to retrieve CoinGecko API successfully but I am currently having trouble with displaying the data. Before I was able to display the data of a random JSON file I downloaded locally hence the render body is quite weird, but now i want to display the data of CoinGecko API instead. I was wondering what should I should put instead of item and index or how could I display CoinGecko API data in my table.

function App() {
const [cryptoData,setCryptoData] = useState([]);

useEffect(() => {
  const interval = setInterval(() => {
    fetchCryptoData();
    console.log('Table Updated');
  },5000)
  return () => clearInterval(interval);
},[cryptoData])

const fetchCryptoData = async () => {
  const data = await fetch('https://api.coingecko.com/api/v3/coins/markets?vs_currency=usd');
  const apiResponse = await data.json();
  const sortedData = apiResponse.sort((a, b) => b.market_cap - a.market_cap)
  console.log(sortedData);
}

const TableHead = [
    '',
    'crypto',
    'Price',
    '24% Change',
    'Market Cap',
    'Voulme',
    'Circulating Supply'
]

const renderHead = (item, index) => <th key={index}>{item}</th>

const renderBody = (item, index) => (
    <tr key={index}>
        <td>{item.id}</td>
        <td>{item.name}</td>
        <td>{item.email}</td>
        <td>{item.phone}</td>
        <td>{item.total_orders}</td>
        <td>{item.total_spend}</td>
        <td>{item.location}</td>
    </tr>
)

    return (
        <div>
            <h2 className="page-header">
               Crypto Table
            </h2>
            <div className="row">
                <div className="col-12">
                    <div className="card">
                        <div className="card__body">
                            <Table
                                limit='10'
                                headData={TableHead}
                                renderHead={(item, index) => renderHead(item, index)}
                                bodyData={customerList}
                                renderBody={(item, index) => renderBody(item, index)}
                            />
                        </div>
                    </div>
                </div>
            </div>
        </div>
    )
}

export default App;