crowetic/commerce
1
0
Fork 1
mirror of https://github.com/vercel/commerce.git synced 2025-07-09 06:11:21 +00:00
Code Issues Packages Projects Releases Wiki Activity

Merge cf3c0be0f3edecd0b367cb2510d3b6ae1f19407b into fa1306916c652ea5f820d5b400087bece13460fd

Browse Source
This commit is contained in:
Franco May 2025-07-01 10:51:09 +02:00 committed by GitHub
commit 5784881a16
No known key found for this signature in database
GPG Key ID: B5690EEEBB952194
1 changed files with 13 additions and 11 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

24
components/cart/cart-context.tsx
View File

@ -28,6 +28,8 @@ type CartAction =
type CartContextType = { type CartContextType = {
cartPromise: Promise<Cart | undefined>; cartPromise: Promise<Cart | undefined>;
optimisticCart: Cart | undefined;
updateOptimisticCart: (action: CartAction) => void;
}; };
const CartContext = createContext<CartContextType | undefined>(undefined); const CartContext = createContext<CartContextType | undefined>(undefined);
@ -197,8 +199,14 @@ export function CartProvider({
children: React.ReactNode; children: React.ReactNode;
cartPromise: Promise<Cart | undefined>; cartPromise: Promise<Cart | undefined>;
}) { }) {
const initialCart = use(cartPromise);
const [optimisticCart, updateOptimisticCart] = useOptimistic(
initialCart,
cartReducer
);
return ( return (
<CartContext.Provider value={{ cartPromise }}> <CartContext.Provider value={{ cartPromise, optimisticCart, updateOptimisticCart }}>
{children} {children}
</CartContext.Provider> </CartContext.Provider>
); );
@ -210,29 +218,23 @@ export function useCart() {
throw new Error('useCart must be used within a CartProvider'); throw new Error('useCart must be used within a CartProvider');
} }
const initialCart = use(context.cartPromise);
const [optimisticCart, updateOptimisticCart] = useOptimistic(
initialCart,
cartReducer
);
const updateCartItem = (merchandiseId: string, updateType: UpdateType) => { const updateCartItem = (merchandiseId: string, updateType: UpdateType) => {
updateOptimisticCart({ context.updateOptimisticCart({
type: 'UPDATE_ITEM', type: 'UPDATE_ITEM',
payload: { merchandiseId, updateType } payload: { merchandiseId, updateType }
}); });
}; };
const addCartItem = (variant: ProductVariant, product: Product) => { const addCartItem = (variant: ProductVariant, product: Product) => {
updateOptimisticCart({ type: 'ADD_ITEM', payload: { variant, product } }); context.updateOptimisticCart({ type: 'ADD_ITEM', payload: { variant, product } });
}; };
return useMemo( return useMemo(
() => ({ () => ({
cart: optimisticCart, cart: context.optimisticCart,
updateCartItem, updateCartItem,
addCartItem addCartItem
}), }),
[optimisticCart] [context.optimisticCart, context.updateOptimisticCart]
); );
} }