Estoy tratando de usar accesorios para crear un mapa, pero muestra este error:

TypeError: data.map no es una función

Aquí está el código de la página principal:

 const Portfolio = () => { const [portfolio_assets, setPortfolioAssets] = useState([]); const auth = useContext(AuthContext); const onFetchPortfolioAssets = useCallback(async () => { const json = await fetchPortfolioAssets(auth.token); if (json) { setPortfolioAssets(json); } }, [auth.token]); useEffect(() => { onFetchPortfolioAssets(); }, [onFetchPortfolioAssets]); return ( <MainLayout> <Dashboard data={portfolio_assets} /> </MainLayout> ) }; export default Portfolio;

esta es la página con Dashboard:

 const Dashboard = (data=[]) => { console.log(data) return ( <Row> <table className='table table-striped'> <tr> <th>Category</th> </tr> {data.map((portfolio_asset) => ( <tr key={portfolio_asset.id} lg={12}> <td>{portfolio_asset.category}</td> </tr> ))} </table> </Row> ) }; export default Dashboard;

Aquí está el archivo console.log, por lo que el objeto está ahí, pero no entendí cómo usar .map

 {data: Array(0)}data: [][[Prototype]]: Object { "data": [ { "id": 1, "category": "Category 1", }, { "id": 2, "category": "Category 2", }, { "id": 3, "category": "Category 2", }, ] }