Bug Description
The cart subtotal and total calculations are incorrect or display as 0 when the cart contains products that are not currently loaded in the frontend's local product state. This occurs because the product list is paginated, and the frontend calculates cart totals by looking up product IDs from the local product array. If an item in the cart belongs to a page that hasn't been fetched or has been overridden in the current session, it is ignored in the total calculation.
Steps to Reproduce
Log in to the application and navigate to the collections/products page.
Add a product from Page 1 of the product list to the cart.
Navigate to Page 2 (or perform a search query that loads a different set of products into the state) and add a second product to the cart.
Navigate to the /cart page or view the cart drawer.
Notice that the total price does not reflect all items in the cart (specifically missing the ones that are no longer in the active pagination state).
Expected Behavior
The cart total should always accurately calculate and display the sum of all items in the cart, regardless of whether those products are currently in the active product page or view state on the frontend.
Current Behavior
In ShopContext.jsx, the getCartAmount function searches the product array to find the price details for each cart item:
javascript
let itemInfo = (product || []).find((p) => p._id === items);
Since the product array only holds the items returned by the paginated list (/product/list?page=X), any item in the cart from a different page returns undefined for itemInfo, causing its price to be omitted from the final total.
Environment
OS:Windows
Browsers: Chrome,
Stack: React, Vite, Express, MongoDB
Logs/Screenshots
No logs or screenshots. The source of the issue is in the local state mismatch here:
File: frontend/src/context/ShopContext.jsx in the getCartAmount() function.
Bug Description
The cart subtotal and total calculations are incorrect or display as 0 when the cart contains products that are not currently loaded in the frontend's local product state. This occurs because the product list is paginated, and the frontend calculates cart totals by looking up product IDs from the local product array. If an item in the cart belongs to a page that hasn't been fetched or has been overridden in the current session, it is ignored in the total calculation.
Steps to Reproduce
Log in to the application and navigate to the collections/products page.
Add a product from Page 1 of the product list to the cart.
Navigate to Page 2 (or perform a search query that loads a different set of products into the state) and add a second product to the cart.
Navigate to the /cart page or view the cart drawer.
Notice that the total price does not reflect all items in the cart (specifically missing the ones that are no longer in the active pagination state).
Expected Behavior
The cart total should always accurately calculate and display the sum of all items in the cart, regardless of whether those products are currently in the active product page or view state on the frontend.
Current Behavior
In ShopContext.jsx, the getCartAmount function searches the product array to find the price details for each cart item:
javascript
let itemInfo = (product || []).find((p) => p._id === items);
Since the product array only holds the items returned by the paginated list (/product/list?page=X), any item in the cart from a different page returns undefined for itemInfo, causing its price to be omitted from the final total.
Environment
OS:Windows
Browsers: Chrome,
Stack: React, Vite, Express, MongoDB
Logs/Screenshots
No logs or screenshots. The source of the issue is in the local state mismatch here:
File: frontend/src/context/ShopContext.jsx in the getCartAmount() function.