import { Head, Link, usePage } from '@inertiajs/react'; interface Tier { id: number; name: string; type: string; duration: string; price_usd: string; } interface Subscription { id: number; status: string; starts_at: string; expires_at: string | null; certificate_number: string | null; tier: Tier; } export default function PortalDashboard({ subscription }: { subscription: Subscription | null }) { const { auth } = usePage().props; const user = (auth as { user: { name: string; email: string; membership_number?: string } }).user; return ( <>

Welcome, {user.name}

Your ABEC membership dashboard

{subscription ? (

Membership

{subscription.tier.name}

{subscription.status}
{subscription.starts_at && (

Since

{new Date(subscription.starts_at).toLocaleDateString('en-GB', { day: 'numeric', month: 'long', year: 'numeric', })}

)} {subscription.expires_at && (

Expires

{new Date(subscription.expires_at).toLocaleDateString('en-GB', { day: 'numeric', month: 'long', year: 'numeric', })}

)} {subscription.certificate_number && (

Certificate No.

{subscription.certificate_number}

)}
) : (

No active membership

Apply for membership to access all ABEC benefits.

Apply Now
)} {/* Quick links */}
{[ { href: '/portal/membership', label: 'My Membership', description: 'View certificate & status' }, { href: '/portal/events', label: 'Events', description: 'Registered and upcoming' }, { href: '/portal/directory', label: 'Directory', description: 'Connect with members' }, { href: '/portal/profile', label: 'Profile', description: 'Update your details' }, ].map((link) => (

{link.label}

{link.description}

))}
); }