Auto-redirect to calculator when checkout is cancelled
All checks were successful
Build and Push Docker Images / docker (push) Successful in 49s

Updated CheckoutCancel component to automatically redirect to the calculator
page after 100ms when the component mounts. This ensures:

- Users are immediately taken back to the calculator with their saved state
- No need to manually click "Try Again" button
- Calculator state is preserved from localStorage
- URL properly updates to /calculator via existing handleNavigate logic

User experience:
1. User cancels Stripe checkout
2. Stripe redirects to /checkout/cancel
3. CheckoutCancel component mounts and immediately redirects to calculator
4. Calculator displays with all previously entered values restored

🤖 Generated with [Claude Code](https://claude.com/claude-code)

Co-Authored-By: Claude <noreply@anthropic.com>
This commit is contained in:
Matt 2025-10-30 15:31:34 +01:00
parent 319db3627c
commit bda4a84bce

View File

@ -1,4 +1,5 @@
import { motion } from 'framer-motion';
import { useEffect } from 'react';
interface CheckoutCancelProps {
onNavigateHome: () => void;
@ -9,6 +10,16 @@ export default function CheckoutCancel({
onNavigateHome,
onNavigateCalculator
}: CheckoutCancelProps) {
// Automatically redirect to calculator on mount
useEffect(() => {
// Small delay to ensure smooth transition
const timer = setTimeout(() => {
onNavigateCalculator();
}, 100);
return () => clearTimeout(timer);
}, [onNavigateCalculator]);
return (
<div className="min-h-screen bg-gradient-to-br from-slate-50 via-blue-50 to-cyan-50 flex items-center justify-center p-6">
<motion.div