import React, { useEffect } from "react"; import { Head, usePage } from "@inertiajs/react"; import MarketingLayout from "@/layouts/mainWebsite"; import type { CheckoutPackage, OAuthProfilePrefill } from "./checkout/types"; import { CheckoutWizard } from "./checkout/CheckoutWizard"; import { Alert, AlertDescription, AlertTitle } from "@/components/ui/alert"; import toast from "react-hot-toast"; import { useTranslation } from "react-i18next"; interface CheckoutWizardPageProps { package: CheckoutPackage; packageOptions: CheckoutPackage[]; privacyHtml: string; googleAuth?: { status?: string | null; error?: string | null; profile?: OAuthProfilePrefill | null; }; facebookAuth?: { status?: string | null; error?: string | null; profile?: OAuthProfilePrefill | null; }; paddle?: { environment?: string | null; client_token?: string | null; }; } const CheckoutWizardPage: React.FC = ({ package: initialPackage, packageOptions, privacyHtml, googleAuth, facebookAuth, paddle, }) => { const page = usePage<{ auth?: { user?: { id: number; email: string; name?: string; pending_purchase?: boolean } | null }, flash?: { verification?: { status: string; title?: string; message?: string } } }>(); const currentUser = page.props.auth?.user ?? null; const googleProfile = googleAuth?.profile ?? null; const facebookProfile = facebookAuth?.profile ?? null; const { t: tAuth } = useTranslation('auth'); const verificationFlash = page.props.flash?.verification; const dedupedOptions = React.useMemo(() => { const ids = new Set(); const list = [initialPackage, ...packageOptions]; return list.filter((pkg) => { if (ids.has(pkg.id)) { return false; } ids.add(pkg.id); return true; }); }, [initialPackage, packageOptions]); useEffect(() => { if (typeof window === 'undefined') { return; } const params = new URLSearchParams(window.location.search); if (params.get('verified') === '1') { toast.success(tAuth('verification.toast_success', 'Email verified successfully.')); params.delete('verified'); const next = params.toString(); const nextUrl = `${window.location.pathname}${next ? `?${next}` : ''}`; window.history.replaceState({}, '', nextUrl); } }, [tAuth]); return (

{verificationFlash && ( {verificationFlash.title} {verificationFlash.message} )}

); }; CheckoutWizardPage.layout = (page: React.ReactNode) => page; export default CheckoutWizardPage;