68 lines
2.2 KiB
TypeScript
68 lines
2.2 KiB
TypeScript
'use client';
|
|
|
|
import Checkout from '@/components/Checkout';
|
|
import { useRouter, useSearchParams } from 'next/navigation';
|
|
import { useEffect, useState, Suspense } from 'react';
|
|
|
|
function CheckoutContent() {
|
|
const router = useRouter();
|
|
const searchParams = useSearchParams();
|
|
const planId = searchParams.get('plan') || 'pro';
|
|
|
|
const [plan, setPlan] = useState<{ id: string, displayName: string, price: number } | null>(null);
|
|
|
|
useEffect(() => {
|
|
fetch('/api/plans', { cache: 'no-store' })
|
|
.then(res => res.json())
|
|
.then(data => {
|
|
const found = data.find((p: any) => p.id === planId);
|
|
if (found) {
|
|
setPlan(found);
|
|
} else {
|
|
setPlan(data.find((p: any) => p.id === 'pro') || { id: 'pro', displayName: 'Auteur Pro', price: 12.00 });
|
|
}
|
|
})
|
|
.catch(err => {
|
|
console.error(err);
|
|
setPlan({ id: 'pro', displayName: 'Auteur Pro', price: 12.00 });
|
|
});
|
|
}, [planId]);
|
|
|
|
const handleComplete = async () => {
|
|
if (plan) {
|
|
try {
|
|
await fetch('/api/user/profile', {
|
|
method: 'PUT',
|
|
headers: { 'Content-Type': 'application/json' },
|
|
body: JSON.stringify({ planId: plan.id })
|
|
});
|
|
// Force a full reload to update user context in providers
|
|
window.location.href = '/dashboard';
|
|
} catch (err) {
|
|
console.error('Failed to update plan', err);
|
|
router.push('/dashboard');
|
|
}
|
|
} else {
|
|
router.push('/dashboard');
|
|
}
|
|
};
|
|
|
|
if (!plan) return <div className="min-h-screen bg-[#eef2ff] flex items-center justify-center p-8">Chargement...</div>;
|
|
|
|
return (
|
|
<Checkout
|
|
plan={plan}
|
|
onComplete={handleComplete}
|
|
onCancel={() => router.push('/pricing')}
|
|
/>
|
|
);
|
|
}
|
|
|
|
export default function CheckoutPage() {
|
|
return (
|
|
<Suspense fallback={<div className="min-h-screen bg-[#eef2ff] flex items-center justify-center p-8">Chargement...</div>}>
|
|
<CheckoutContent />
|
|
</Suspense>
|
|
);
|
|
}
|