import Link from 'next/link';
import type { Metadata } from 'next';
import { ROUTES } from '@/lib/routes';

export const metadata: Metadata = { title: 'Email Verification' };

// The backend redirects here after the user clicks the verification link in
// their inbox — the link itself points at the Laravel app, never at this
// frontend (see the guide, §3.1). This page just reads the outcome back
// out of the query string it was redirected here with.
const MESSAGES: Record<string, { title: string; body: string }> = {
  success: {
    title: 'Email Verified',
    body: 'Your email address has been verified — you now have full access to your account.',
  },
  'already-verified': {
    title: 'Already Verified',
    body: 'This email address was already verified. Nothing more to do here.',
  },
  invalid: {
    title: 'Link Invalid or Expired',
    body: 'That verification link is invalid or has expired. Sign in and request a new one from your account page.',
  },
};

export default function EmailVerifiedPage({ searchParams }: { searchParams: { status?: string } }) {
  const message = MESSAGES[searchParams?.status ?? ''] ?? MESSAGES.invalid;

  return (
    <section className="bg-beige py-16">
      <div className="container-page flex justify-center">
        <div className="card w-full max-w-md p-8 text-center">
          <h1 className="font-serif text-2xl font-bold text-navy-800">{message.title}</h1>
          <p className="mt-3 text-sm text-navy-600">{message.body}</p>
          <Link href={ROUTES.login} className="btn-primary mt-6 inline-block">Go to Sign In</Link>
        </div>
      </div>
    </section>
  );
}
