Re-ordering of cart: Fix about ecommerce_sanity_stripe HOT 8 OPEN

For those who wanted the cart order to remain the same after increasing or decreasing the quantity,

setCartItems([...newCartItems.slice(0, index), {...foundProduct, quantity: foundProduct.quantity + 1}, ...newCartItems.slice(index)])

setCartItems([...newCartItems.slice(0, index), {...foundProduct, quantity: foundProduct.quantity - 1}, ...newCartItems.slice(index)])

https://stackoverflow.com/questions/586182/how-to-insert-an-item-into-an-array-at-a-specific-index-javascript --refer to the link for more info

Great answer 🤗🤗

I tried in a bit crude way:
`
const toggleCartItemQuantity = (id, value) => {
foundProduct = cartItems.find((item) => item._id === id);
index = cartItems.findIndex((product) => product._id === id);

const newCartItems = cartItems.filter((item) => item._id !== id);

if (value === 'inc') {
    let finalCartItems = [...newCartItems, { ...foundProduct, quantity: foundProduct.quantity + 1 }];
    let length = finalCartItems.length;
    [finalCartItems[index], finalCartItems[length - 1]] = [finalCartItems[length - 1], finalCartItems[index]];
    setCartItems(finalCartItems);
    setTotalPrice((prevTotalPrice) => prevTotalPrice + foundProduct.price);
    setTotalQuantities((prevTotalQuantities) => prevTotalQuantities + 1);
}
else if (value === 'dec') {
    if (foundProduct.quantity > 1) {
        let finalCartItems = [...newCartItems, { ...foundProduct, quantity: foundProduct.quantity - 1 }];
        let length = finalCartItems.length;
        [finalCartItems[index], finalCartItems[length - 1]] = [finalCartItems[length - 1], finalCartItems[index]];
        setCartItems(finalCartItems);
        setTotalPrice((prevTotalPrice) => prevTotalPrice - foundProduct.price);
        setTotalQuantities((prevTotalQuantities) => prevTotalQuantities - 1);
    }
}

}
`

from ecommerce_sanity_stripe.

this works for me

from ecommerce_sanity_stripe.

Thanks worked for me

from ecommerce_sanity_stripe.

Thank you! This also worked well for me!

from ecommerce_sanity_stripe.

I have figured out with this way using splice
use Splice with index to update newCartItems then simply setCartitems as newCartItems

const toggleCartItemQuantity = (id, value) => {

   foundProduct = cartItems.find((item) => item._id === id);
   index = cartItems.findIndex((product) => product._id === id);
   const newCartItems = cartItems.filter((item) => item._id !== id);

   if (value === "inc") {
     newCartItems.splice(index, 0, {...foundProduct, quantity: foundProduct.quantity + 1})

     setCartItems([ ...newCartItems ]);
     setTotalPrice((prevTotalPrice) => prevTotalPrice + foundProduct.price);
     setTotalQuantities((prevTotalQuantities) => prevTotalQuantities + 1);
   } else if (value === "dec") {
     if (foundProduct.quantity > 1) {
       newCartItems.splice(index, 0, {...foundProduct, quantity: foundProduct.quantity - 1})

       setCartItems([ ...newCartItems ]);
       setTotalPrice((prevTotalPrice) => prevTotalPrice - foundProduct.price);
       setTotalQuantities((prevTotalQuantities) => prevTotalQuantities - 1);
     }
   }
 };

from ecommerce_sanity_stripe.

For those who wanted the cart order to remain the same after increasing or decreasing the quantity,

setCartItems([...newCartItems.slice(0, index), {...foundProduct, quantity: foundProduct.quantity + 1}, ...newCartItems.slice(index)])

setCartItems([...newCartItems.slice(0, index), {...foundProduct, quantity: foundProduct.quantity - 1}, ...newCartItems.slice(index)])

https://stackoverflow.com/questions/586182/how-to-insert-an-item-into-an-array-at-a-specific-index-javascript --refer to the link for more info

Thanks for the fix, worked for me ! 😊

from ecommerce_sanity_stripe.

For those who wanted the cart order to remain the same after increasing or decreasing the quantity,

setCartItems([...newCartItems.slice(0, index), {...foundProduct, quantity: foundProduct.quantity + 1}, ...newCartItems.slice(index)])

setCartItems([...newCartItems.slice(0, index), {...foundProduct, quantity: foundProduct.quantity - 1}, ...newCartItems.slice(index)])

https://stackoverflow.com/questions/586182/how-to-insert-an-item-into-an-array-at-a-specific-index-javascript --refer to the link for more info

thanks !!!

from ecommerce_sanity_stripe.

For those who wanted the cart order to remain the same after increasing or decreasing the quantity,
setCartItems([...newCartItems.slice(0, index), {...foundProduct, quantity: foundProduct.quantity + 1}, ...newCartItems.slice(index)])
setCartItems([...newCartItems.slice(0, index), {...foundProduct, quantity: foundProduct.quantity - 1}, ...newCartItems.slice(index)])
https://stackoverflow.com/questions/586182/how-to-insert-an-item-into-an-array-at-a-specific-index-javascript --refer to the link for more info

Great answer 🤗🤗

I tried in a bit crude way: ` const toggleCartItemQuantity = (id, value) => { foundProduct = cartItems.find((item) => item._id === id); index = cartItems.findIndex((product) => product._id === id);

const newCartItems = cartItems.filter((item) => item._id !== id);

if (value === 'inc') {
    let finalCartItems = [...newCartItems, { ...foundProduct, quantity: foundProduct.quantity + 1 }];
    let length = finalCartItems.length;
    [finalCartItems[index], finalCartItems[length - 1]] = [finalCartItems[length - 1], finalCartItems[index]];
    setCartItems(finalCartItems);
    setTotalPrice((prevTotalPrice) => prevTotalPrice + foundProduct.price);
    setTotalQuantities((prevTotalQuantities) => prevTotalQuantities + 1);
}
else if (value === 'dec') {
    if (foundProduct.quantity > 1) {
        let finalCartItems = [...newCartItems, { ...foundProduct, quantity: foundProduct.quantity - 1 }];
        let length = finalCartItems.length;
        [finalCartItems[index], finalCartItems[length - 1]] = [finalCartItems[length - 1], finalCartItems[index]];
        setCartItems(finalCartItems);
        setTotalPrice((prevTotalPrice) => prevTotalPrice - foundProduct.price);
        setTotalQuantities((prevTotalQuantities) => prevTotalQuantities - 1);
    }
}

} `

THANKS

from ecommerce_sanity_stripe.