54 lines
2.3 KiB
TypeScript
54 lines
2.3 KiB
TypeScript
import { Card, CardContent, CardDescription, CardHeader, CardTitle } from '@/components/ui/card'
|
|
import { Button } from '@/components/ui/button'
|
|
import Link from 'next/link'
|
|
import { Monitor, AlertTriangle, ArrowLeft } from 'lucide-react'
|
|
|
|
export default function AuthErrorPage() {
|
|
return (
|
|
<div className="flex min-h-svh w-full items-center justify-center p-6 md:p-10">
|
|
<div className="w-full max-w-md">
|
|
<div className="flex flex-col items-center gap-6">
|
|
<div className="flex items-center gap-2">
|
|
<div className="flex h-10 w-10 items-center justify-center rounded-lg bg-primary">
|
|
<Monitor className="h-5 w-5 text-primary-foreground" />
|
|
</div>
|
|
<span className="text-2xl font-bold">RemoteLink</span>
|
|
</div>
|
|
|
|
<Card className="w-full border-border/50">
|
|
<CardHeader className="text-center">
|
|
<div className="mx-auto mb-4 flex h-16 w-16 items-center justify-center rounded-full bg-destructive/10">
|
|
<AlertTriangle className="h-8 w-8 text-destructive" />
|
|
</div>
|
|
<CardTitle className="text-2xl">Authentication Error</CardTitle>
|
|
<CardDescription className="text-balance">
|
|
Something went wrong during authentication. This could be due to an expired link or an invalid request.
|
|
</CardDescription>
|
|
</CardHeader>
|
|
<CardContent className="space-y-4">
|
|
<div className="rounded-lg bg-muted/50 p-4 text-sm text-muted-foreground">
|
|
<p className="text-balance">
|
|
If you continue to experience issues, please contact support or try again later.
|
|
</p>
|
|
</div>
|
|
<div className="flex gap-3">
|
|
<Button asChild variant="outline" className="flex-1">
|
|
<Link href="/auth/login">
|
|
<ArrowLeft className="mr-2 h-4 w-4" />
|
|
Back to login
|
|
</Link>
|
|
</Button>
|
|
<Button asChild className="flex-1">
|
|
<Link href="/auth/sign-up">
|
|
Try again
|
|
</Link>
|
|
</Button>
|
|
</div>
|
|
</CardContent>
|
|
</Card>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
)
|
|
}
|