populate_cart_example.ts

type Product = {
    // ... product stuff
    quantity?: number; // add this to the existing product type
}

// create new state (and add it to the types and context value etc)
const [populatedCart, setPopulatedCart] = useState<Product[]>([]);

async function fetchProduct(productId: string): Promise<Product> {
  const res = await fetch(`${BASE_URL}/products/${productId}`);
  if (!res.ok) {
    throw new Error(`Error fetching product ${productId}: ${res.statusText}`);
  }
  const productData = await res.json();
  return productData as Product; // Type assertion might still be needed depending on data structure
}

const populateCart = async () => {
    try {        
        const productsWithQuantity: Product[] = [];

        for (const productId in cart) {
            const product = await fetchProduct(productId);
            product.quantity = cart[productId];
            productsWithQuantity.push(product);
        }

        setPopulatedCart(productsWithQuantity);
    } catch (error) {
        // ... error handling
    }
};