import Link from 'next/link'
import { registerAction } from '@/actions/auth'
import { AuthForm } from '@/components/auth/auth-form'

export default function RegisterPage() {
  return (
    <main className="min-h-screen bg-background flex items-center justify-center p-4">
      <div className="w-full max-w-sm space-y-6">

        {/* Logo / titel */}
        <div className="text-center space-y-1">
          <h1 className="text-2xl font-medium text-foreground">Scrum4Me</h1>
          <p className="text-sm text-muted-foreground">Nieuw account aanmaken</p>
        </div>

        {/* Formulier */}
        <div className="bg-surface-container-low rounded-xl p-6 space-y-4 border border-border">
          <AuthForm action={registerAction} submitLabel="Account aanmaken" />

          <div className="text-center text-sm text-muted-foreground">
            Al een account?{' '}
            <Link href="/login" className="text-primary hover:underline font-medium">
              Inloggen
            </Link>
          </div>
        </div>

      </div>
    </main>
  )
}
