1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
|
import { createContext, useContext, useState, useEffect } from 'react';
import { toast } from 'sonner';
const CartContext = createContext();
export const CartProvider = ({ children }) => {
const [items, setItems] = useState([]);
const [total, setTotal] = useState(0);
// Load cart from localStorage on initial load
useEffect(() => {
if (typeof window !== 'undefined') {
const savedCart = localStorage.getItem('cart');
if (savedCart) {
try {
const parsedCart = JSON.parse(savedCart);
setItems(parsedCart);
calculateTotal(parsedCart);
} catch (error) {
console.error('Failed to parse cart from localStorage:', error);
}
}
}
}, []);
// Save cart to localStorage whenever it changes
useEffect(() => {
if (typeof window !== 'undefined') {
localStorage.setItem('cart', JSON.stringify(items));
calculateTotal(items);
}
}, [items]);
// Calculate total price
const calculateTotal = (cartItems) => {
const sum = cartItems.reduce((acc, item) => acc + item.price * item.quantity, 0);
setTotal(sum);
};
// Add item to cart
const addItem = (item) => {
setItems((prevItems) => {
// Check if item already exists in cart
const existingItemIndex = prevItems.findIndex((i) => i.id === item.id);
if (existingItemIndex !== -1) {
// Item exists, update quantity
const updatedItems = [...prevItems];
updatedItems[existingItemIndex] = {
...updatedItems[existingItemIndex],
quantity: updatedItems[existingItemIndex].quantity + 1,
};
toast.success(`Added another ${item.name} to your cart`);
return updatedItems;
} else {
// Item doesn't exist, add new item
toast.success(`Added ${item.name} to your cart`);
return [...prevItems, { ...item, quantity: 1 }];
}
});
};
// Remove item from cart
const removeItem = (itemId) => {
setItems((prevItems) => {
const itemToRemove = prevItems.find((item) => item.id === itemId);
if (itemToRemove) {
toast.success(`Removed ${itemToRemove.name} from your cart`);
}
return prevItems.filter((item) => item.id !== itemId);
});
};
// Update item quantity
const updateQuantity = (itemId, quantity) => {
if (quantity < 1) return;
setItems((prevItems) =>
prevItems.map((item) =>
item.id === itemId ? { ...item, quantity } : item
)
);
};
// Clear cart
const clearCart = () => {
setItems([]);
toast.success('Cart cleared');
};
// Get cart item count
const getItemCount = () => {
return items.reduce((count, item) => count + item.quantity, 0);
};
return (
<CartContext.Provider
value={{
items,
total,
addItem,
removeItem,
updateQuantity,
clearCart,
getItemCount,
}}
>
{children}
</CartContext.Provider>
);
};
// Custom hook to use cart context
export const useCart = () => {
const context = useContext(CartContext);
if (!context) {
throw new Error('useCart must be used within a CartProvider');
}
return context;
};
|
