How do I Convert My database object to this Material UI Table format

Question

I am generating data from my mongodb as an array of objects and I am storing it in products.

The default format for creating data row in material design is as such:

const rows = [
  createData('Rice', 305, 3.7, 67, 4.3),
  createData('Beans', 452, 25.0, 51, 4.9),
  createData('Yam', 262, 16.0, 24, 6.0),
  createData('Chicken', 159, 6.0, 24, 4.0),
  createData('Palm Oil', 356, 16.0, 49, 3.9),
  createData('Hen', 408, 3.2, 87, 6.5),
  createData('Mangoes', 237, 9.0, 37, 4.3),
  createData('Fruits', 375, 0.0, 94, 0.0),
  createData('Cassava', 518, 26.0, 65, 7.0),
  createData('Potatoes', 392, 0.2, 98, 0.0),
]

How do I convert my exported data to this format.

const [products, setProducts] = React.useState([])

When I log my products to the console, I get:

[
   {_id: '001', name: 'Fish', price: 3000, quantity: 12, weight: 10},
   {_id: '002', name: 'Rice', price: 12000, quantity: 5, weight: 50},
] 

This is how I tried converting, It didn't work tho:

products.map(product => createData(product))

How can I resolve this??

Answer 1

setProducts(products.map(product => createData(product.name, product.price))) // write other required fields according the above example.

better to use useEffect;