Files
craft2prints/src/components/ClearCartOnMount.tsx
T
Andymick f4a80d2a50 Improve: Cart clearing on success page with better state management
Use useCart.getState() to ensure we're clearing the current store state
and delete IndexedDB before clearing store. Add detailed logging to help
debug cart clearing issues. Ensures cart is completely emptied on checkout
success.
2026-07-18 20:29:51 +01:00

38 lines
1.1 KiB
TypeScript

'use client';
import { useEffect } from 'react';
import { useCart } from '@/lib/cartStore';
import { del as idbDel } from 'idb-keyval';
export default function ClearCartOnMount() {
useEffect(() => {
const clearCart = async () => {
try {
console.log('🧹 ClearCartOnMount: Clearing cart on success page');
// Delete IndexedDB storage first
await idbDel('personalize-studio-cart');
console.log('✓ Deleted cart from IndexedDB');
// Then clear the in-memory state by getting a fresh reference
// This ensures we're using the current store state
const { clear: clearStore } = useCart.getState();
clearStore();
console.log('✓ Cleared cart store state');
// Clear the isCheckingOut flag
if (typeof window !== 'undefined') {
sessionStorage.removeItem('isCheckingOut');
console.log('✓ Cleared checkout flag');
}
} catch (err) {
console.error('Error clearing cart:', err);
}
};
clearCart();
}, []); // Empty dependency array - run once on mount
return null;
}