Estoy codificando una aplicación de entrega MERN en un nivel básico y necesito un back-end simple. Obtengo todos los datos de la base de datos en la parte frontal de axios

 const [products, setProducts] = useState([]); useEffect(()=>{ axios.get('api/products') .then(res => { console.log(res) setProducts(res.data) }) .catch(err => { console.log(err) })

})

También necesito llevar mi producto al depósito de compras, pero no entiendo cómo hacerlo. Este es un trabajo de código solo en front-ent, pero cuando obtengo mis datos de la base de datos, este código deja de funcionar

 let [cartItems, setCartItems] = useState([]) const addProduct = (product) => { const productExist = cartItems.find(item => item.id === product.id) if (productExist) { setCartItems(cartItems.map(item => item.id === product.id? {...productExist, quantity: productExist.quantity + 1}: item)); } else { setCartItems([...cartItems, {...product, quantity: 1}]) ja }