Tengo estos datos de cantidad total de totalAmount y cómo puedo pasarlos al componente principal (app.js) donde podré pasarlos a otro componente secundario (info.js). Intenté pasarlo de Cart.js al padre, no funcionará, esto es lo que mostraría:

El identificador 'totalAmount' ya ha sido declarado

codesandbox: https://codesandbox.io/s/add-to-cart-sampled-2-with-material-ui-table-pagination-with-reduced-cart-items-firebase-5id6gs?file=/src/Cart .js**texto fuerte **

En el carrito.js

 const Cart = ({ cartItems, handleCartClearance, handleRemove, handleAdd }) => { const totalAmount = cartItems.reduce( (price, item) => price + item.quantity * item.price, 0 ); return ( <div> </div> ); }; export default Cart;

En App.js , ¿cómo puedo pasar el totalAmount al componente customerInfo ?

 export default function App() { return ( <div className="App"> <CustomerInfo cartItems={cartItems} /> <br /> <Cart cartItems={cartItems} handleCartClearance={handleCartClearance} handleRemove={handleRemove} handleAdd={handleAdd} /> </Stack> </div> ); }

Componente CustomerInfo:

 const CustomerInfo = ({ cartItems }) => { const handleSubmit = (e) => { e.preventDefault(); console.log(firstName, number, "info"); console.log(cartItems, "cartItems, info"); //console the totalAmount here }; return ( <Container style={{ padding: "12px" }}> </Container> ); }; export default CustomerInfo;