Files
goGin/frontend/app/auth/login/page.tsx
Beyhan Oğur 2a5b661443 first commit
2026-04-26 21:46:42 +03:00

156 lines
4.9 KiB
TypeScript
Raw Blame History

This file contains ambiguous Unicode characters
This file contains Unicode characters that might be confused with other characters. If you think that this is intentional, you can safely ignore this warning. Use the Escape button to reveal them.
"use client"
import React, { useState } from 'react'
import { useForm } from 'react-hook-form'
import { zodResolver } from '@hookform/resolvers/zod'
import { loginSchema, LoginInput } from '@/lib/auth-schema'
import { Input } from '@/components/ui/input'
import { Button } from '@/components/ui/button'
import { Card, CardContent, CardDescription, CardFooter, CardHeader, CardTitle } from '@/components/ui/card'
import { Label } from '@/components/ui/label'
import { Turnstile } from 'nextjs-turnstile'
import { signIn } from 'next-auth/react'
import Swal from 'sweetalert2'
import { useRouter } from 'next/navigation'
import Link from 'next/link'
const LoginPage = () => {
const [isLoading, setIsLoading] = useState(false)
const [turnstileToken, setTurnstileToken] = useState<string | null>(null)
const router = useRouter()
const {
register,
handleSubmit,
formState: { errors },
} = useForm<LoginInput>({
resolver: zodResolver(loginSchema),
})
const siteKey = process.env.NEXT_PUBLIC_TURNSTILE_SITEKEY
const onSubmit = async (data: LoginInput) => {
if (siteKey && !turnstileToken) {
Swal.fire({
icon: 'warning',
title: 'Güvenlik Doğrulaması',
text: 'Lütfen robot olmadığınızı doğrulayın.',
})
return
}
setIsLoading(true)
try {
const result = await signIn('credentials', {
redirect: false,
email: data.email,
password: data.password,
})
if (result?.error) {
throw new Error(result.error)
}
if (result?.ok) {
Swal.fire({
icon: 'success',
title: 'Giriş Başarılı',
text: 'Yönlendiriliyorsunuz...',
timer: 1500,
showConfirmButton: false,
}).then(() => {
const callbackUrl = new URLSearchParams(window.location.search).get("callbackUrl") || "/"
router.push(callbackUrl)
router.refresh()
})
}
} catch {
Swal.fire({
icon: 'error',
title: 'Giriş Başarısız',
text: 'E-posta veya şifre hatalı olabilir.',
})
} finally {
setIsLoading(false)
}
}
return (
<div className="flex min-h-screen items-center justify-center bg-gray-100 p-4 dark:bg-gray-900">
<Card className="w-full max-w-md shadow-xl">
<CardHeader className="space-y-1">
<CardTitle className="text-2xl font-bold text-center">Giriş Yap</CardTitle>
<CardDescription className="text-center">
Hesabınıza erişmek için bilgilerinizi girin
</CardDescription>
</CardHeader>
<CardContent>
<form onSubmit={handleSubmit(onSubmit)} className="space-y-4">
<div className="space-y-2">
<Label htmlFor="email">E-posta</Label>
<Input
id="email"
type="email"
placeholder="ornek@domain.com"
{...register('email')}
className={errors.email ? 'border-red-500' : ''}
/>
{errors.email && (
<p className="text-sm text-red-500">{errors.email.message}</p>
)}
</div>
<div className="space-y-2">
<div className="flex items-center justify-between">
<Label htmlFor="password">Şifre</Label>
<Link
href="/auth/forgot-password"
className="text-sm text-blue-600 hover:underline"
>
Şifremi Unuttum?
</Link>
</div>
<Input
id="password"
type="password"
placeholder="********"
{...register('password')}
className={errors.password ? 'border-red-500' : ''}
/>
{errors.password && (
<p className="text-sm text-red-500">{errors.password.message}</p>
)}
</div>
{siteKey && (
<div className="flex justify-center my-4">
<Turnstile
siteKey={siteKey}
onSuccess={(token) => setTurnstileToken(token)}
onError={() => setTurnstileToken(null)}
onExpire={() => setTurnstileToken(null)}
/>
</div>
)}
<Button type="submit" className="w-full" disabled={isLoading}>
{isLoading ? 'Giriş Yapılıyor...' : 'Giriş Yap'}
</Button>
</form>
</CardContent>
<CardFooter className="justify-center">
<p className="text-sm text-gray-500">
Hesabınız yok mu?{' '}
<Link href="/auth/register" className="text-blue-600 hover:underline">
Kayıt Ol
</Link>
</p>
</CardFooter>
</Card>
</div>
)
}
export default LoginPage