I’m attempting to use the moralis api to return native transactions, however it is not retrieving anything (undefined)… I’m trying to map the array into a table
import React, {useState, useEffect} from 'react'
import './Transactions.css'
import 'react-bootstrap-table-next/dist/react-bootstrap-table2.min.css';
import BootstrapTable from 'react-bootstrap-table-next';
import {Container,InputGroup,FormControl} from 'react-bootstrap'
const Transactions = () => {
const [list, setList] = useState([])
const transactions = async () => {
const request = await fetch('https://deep-index.moralis.io/api/v2/0xAb97ABf09F0F404f9dc271314bb09Dd0f097C990?chain=ropsten');
const toJSON = request.json()
setList(toJSON.result)
};
const products = list.map(item => ({
date: item.block_timestamp,
from: item.from_address,
to: item.to_address,
amount: item.value
}))
const columns = [{
dataField: 'date',
text: 'Date:'
}, {
dataField: 'from',
text: 'From'
}, {
dataField: 'to',
text: 'To:'
}, {
dataField: 'amount',
text: 'Amount:'
}];
useEffect(() => {
transactions()
}, [])
return(
<div className="transaction-page">
<h1 className="main-card-title">Past Transactions: ({list.length})</h1>
<div className="transmaincard">
<div className='lists'>
<Container className='listsearch'>
<InputGroup className="mb-3">
<InputGroup.Text id="basic-addon1"><i class="fa fa-users" aria-hidden="true"></i></InputGroup.Text>
<FormControl
placeholder="@ username or address"
aria-label="Username"
aria-describedby="basic-addon1"
/>
</InputGroup>
</Container>
<BootstrapTable id="bar"className='datatable' keyField='id' data={ products } columns={ columns } noDataIndication="Not Available" />
</div>
</div>
</div>
)
}
export default Transactions