40 lines
1.4 KiB
TypeScript
40 lines
1.4 KiB
TypeScript
|
'use client'
|
||
|
|
|
||
|
|
import { useSearchParams } from 'next/navigation'
|
||
|
|
import Link from 'next/link'
|
||
|
|
import { Card, CardContent, CardHeader, CardTitle } from '@/components/ui/card'
|
||
|
|
import { Button } from '@/components/ui/button'
|
||
|
|
import { AlertCircle } from 'lucide-react'
|
||
|
|
|
||
|
|
const errorMessages: Record<string, string> = {
|
||
|
|
Configuration: 'There is a problem with the server configuration.',
|
||
|
|
AccessDenied: 'You do not have access to this resource.',
|
||
|
|
Verification: 'The verification link has expired or already been used.',
|
||
|
|
Default: 'An error occurred during authentication.',
|
||
|
|
}
|
||
|
|
|
||
|
|
export default function AuthErrorPage() {
|
||
|
|
const searchParams = useSearchParams()
|
||
|
|
const error = searchParams.get('error') || 'Default'
|
||
|
|
const message = errorMessages[error] || errorMessages.Default
|
||
|
|
|
||
|
|
return (
|
||
|
|
<Card className="w-full max-w-md">
|
||
|
|
<CardHeader className="text-center">
|
||
|
|
<div className="mx-auto mb-4 flex h-12 w-12 items-center justify-center rounded-full bg-destructive/10">
|
||
|
|
<AlertCircle className="h-6 w-6 text-destructive" />
|
||
|
|
</div>
|
||
|
|
<CardTitle className="text-xl">Authentication Error</CardTitle>
|
||
|
|
</CardHeader>
|
||
|
|
<CardContent className="space-y-4 text-center">
|
||
|
|
<p className="text-muted-foreground">{message}</p>
|
||
|
|
<div className="border-t pt-4">
|
||
|
|
<Button asChild>
|
||
|
|
<Link href="/login">Try again</Link>
|
||
|
|
</Button>
|
||
|
|
</div>
|
||
|
|
</CardContent>
|
||
|
|
</Card>
|
||
|
|
)
|
||
|
|
}
|