mirror of https://github.com/kortix-ai/suna.git
131 lines
4.2 KiB
TypeScript
131 lines
4.2 KiB
TypeScript
'use client';
|
|
|
|
import { useState } from 'react';
|
|
import { useRouter, useSearchParams } from 'next/navigation';
|
|
import Link from 'next/link';
|
|
import { Button } from '@/components/ui/button';
|
|
import { Input } from '@/components/ui/input';
|
|
import { Label } from '@/components/ui/label';
|
|
import { createClient } from '@/utils/supabase/client';
|
|
import { toast } from 'sonner';
|
|
|
|
export default function LoginPage() {
|
|
const router = useRouter();
|
|
const searchParams = useSearchParams();
|
|
const [email, setEmail] = useState('');
|
|
const [password, setPassword] = useState('');
|
|
const [isLoading, setIsLoading] = useState(false);
|
|
|
|
const handleSubmit = async (e: React.FormEvent) => {
|
|
e.preventDefault();
|
|
setIsLoading(true);
|
|
|
|
try {
|
|
const supabase = createClient();
|
|
const { error } = await supabase.auth.signInWithPassword({
|
|
email,
|
|
password,
|
|
});
|
|
|
|
if (error) throw error;
|
|
|
|
toast.success('Successfully logged in!');
|
|
|
|
// Get the redirect URL from search params or default to /projects
|
|
const redirectTo = searchParams.get('redirectedFrom') || '/projects';
|
|
router.push(redirectTo);
|
|
router.refresh();
|
|
} catch (err: any) {
|
|
console.error('Login error:', err);
|
|
toast.error(err.message || 'Failed to login');
|
|
} finally {
|
|
setIsLoading(false);
|
|
}
|
|
};
|
|
|
|
return (
|
|
<div className="flex-1 flex flex-col items-center justify-center h-full py-8">
|
|
<div className="w-full max-w-md mx-auto px-8">
|
|
<div className="flex items-center justify-center mb-8">
|
|
<svg
|
|
xmlns="http://www.w3.org/2000/svg"
|
|
viewBox="0 0 24 24"
|
|
fill="none"
|
|
stroke="currentColor"
|
|
strokeWidth="2"
|
|
strokeLinecap="round"
|
|
strokeLinejoin="round"
|
|
className="mr-2 h-8 w-8"
|
|
>
|
|
<path d="M15 6v12a3 3 0 1 0 3-3H6a3 3 0 1 0 3 3V6a3 3 0 1 0-3 3h12a3 3 0 1 0-3-3" />
|
|
</svg>
|
|
<span className="text-2xl font-bold">AgentPress</span>
|
|
</div>
|
|
|
|
<div className="bg-white p-8 rounded-lg border shadow-sm">
|
|
<div className="text-center mb-6">
|
|
<h1 className="text-2xl font-semibold tracking-tight">
|
|
Welcome back
|
|
</h1>
|
|
<p className="text-sm text-muted-foreground mt-1">
|
|
Enter your credentials to sign in to your account
|
|
</p>
|
|
</div>
|
|
|
|
<form onSubmit={handleSubmit} className="space-y-4">
|
|
<div className="space-y-2">
|
|
<Label htmlFor="email">Email</Label>
|
|
<Input
|
|
id="email"
|
|
type="email"
|
|
value={email}
|
|
onChange={(e) => setEmail(e.target.value)}
|
|
placeholder="name@example.com"
|
|
required
|
|
disabled={isLoading}
|
|
autoCapitalize="none"
|
|
autoComplete="email"
|
|
autoCorrect="off"
|
|
/>
|
|
</div>
|
|
|
|
<div className="space-y-2">
|
|
<div className="flex items-center justify-between">
|
|
<Label htmlFor="password">Password</Label>
|
|
<Link
|
|
href="/auth/forgot-password"
|
|
className="text-xs font-medium text-primary hover:underline"
|
|
>
|
|
Forgot password?
|
|
</Link>
|
|
</div>
|
|
<Input
|
|
id="password"
|
|
type="password"
|
|
value={password}
|
|
onChange={(e) => setPassword(e.target.value)}
|
|
required
|
|
disabled={isLoading}
|
|
/>
|
|
</div>
|
|
|
|
<Button
|
|
type="submit"
|
|
className="w-full mt-1"
|
|
disabled={isLoading}
|
|
>
|
|
{isLoading ? 'Signing in...' : 'Sign in'}
|
|
</Button>
|
|
</form>
|
|
|
|
<div className="mt-4 text-center text-sm text-muted-foreground">
|
|
Don't have an account?{' '}
|
|
<Link href="/auth/signup" className="font-medium text-primary hover:underline">
|
|
Create an account
|
|
</Link>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
);
|
|
}
|