|
|
@@ -0,0 +1,72 @@
|
|
|
+'use client'
|
|
|
+
|
|
|
+import { useState } from 'react'
|
|
|
+import { useAuth } from '@/hooks/useAuth'
|
|
|
+
|
|
|
+export default function RegisterModal({ onClose }: { onClose: () => void }) {
|
|
|
+ const { register } = useAuth()
|
|
|
+ const [email, setEmail] = useState('')
|
|
|
+ const [password, setPassword] = useState('')
|
|
|
+ const [role, setRole] = useState('customer')
|
|
|
+ const [error, setError] = useState('')
|
|
|
+
|
|
|
+ const handleSubmit = async (e: React.FormEvent) => {
|
|
|
+ e.preventDefault()
|
|
|
+ try {
|
|
|
+ await register(email, password, role)
|
|
|
+ onClose()
|
|
|
+ } catch (err: any) {
|
|
|
+ setError(err.message || 'Registration failed')
|
|
|
+ }
|
|
|
+ }
|
|
|
+
|
|
|
+ return (
|
|
|
+ <div className="fixed inset-0 z-50 flex items-center justify-center bg-black/40" onClick={onClose}>
|
|
|
+ <form
|
|
|
+ onSubmit={handleSubmit}
|
|
|
+ onClick={(e) => e.stopPropagation()}
|
|
|
+ className="w-full max-w-sm space-y-4 rounded-2xl bg-green-600/15 p-8 backdrop-blur-md"
|
|
|
+ >
|
|
|
+ <h1 className="text-center text-2xl font-bold text-white">Регистрация</h1>
|
|
|
+
|
|
|
+ {error && <p className="text-sm text-red-400">{error}</p>}
|
|
|
+
|
|
|
+ <input
|
|
|
+ type="email"
|
|
|
+ placeholder="Email"
|
|
|
+ value={email}
|
|
|
+ onChange={(e) => setEmail(e.target.value)}
|
|
|
+ className="w-full rounded-lg border border-white/10 bg-white/5 px-4 py-3 text-white placeholder-white/40 outline-none focus:border-green-500"
|
|
|
+ required
|
|
|
+ />
|
|
|
+
|
|
|
+ <input
|
|
|
+ type="password"
|
|
|
+ placeholder="Пароль"
|
|
|
+ value={password}
|
|
|
+ onChange={(e) => setPassword(e.target.value)}
|
|
|
+ className="w-full rounded-lg border border-white/10 bg-white/5 px-4 py-3 text-white placeholder-white/40 outline-none focus:border-green-500"
|
|
|
+ required
|
|
|
+ minLength={6}
|
|
|
+ />
|
|
|
+
|
|
|
+ <select
|
|
|
+ value={role}
|
|
|
+ onChange={(e) => setRole(e.target.value)}
|
|
|
+ className="w-full rounded-lg border border-white/10 bg-white/5 px-4 py-3 text-white outline-none focus:border-green-500"
|
|
|
+ >
|
|
|
+ <option value="customer">Заказчик (ищу места)</option>
|
|
|
+ <option value="landlord">Арендодатель (сдаю студию)</option>
|
|
|
+ <option value="executor">Исполнитель (предлагаю услуги)</option>
|
|
|
+ </select>
|
|
|
+
|
|
|
+ <button
|
|
|
+ type="submit"
|
|
|
+ className="w-full rounded-lg bg-green-600 px-4 py-3 font-medium text-white hover:bg-green-500 transition"
|
|
|
+ >
|
|
|
+ Зарегистрироваться
|
|
|
+ </button>
|
|
|
+ </form>
|
|
|
+ </div>
|
|
|
+ )
|
|
|
+}
|