feat: show success message after registration

frontend/src/components/RegisterModal.tsx

@@ -1,6 +1,6 @@
 'use client'
 
-import { useState } from 'react'
+import { useState, useEffect } from 'react'
 import { useAuth } from '@/hooks/useAuth'
 
 export default function RegisterModal({ onClose }: { onClose: () => void }) {
@@ -9,12 +9,19 @@ export default function RegisterModal({ onClose }: { onClose: () => void }) {
   const [password, setPassword] = useState('')
   const [role, setRole] = useState('customer')
   const [error, setError] = useState('')
+  const [success, setSuccess] = useState(false)
+
+  useEffect(() => {
+    if (!success) return
+    const t = setTimeout(onClose, 3000)
+    return () => clearTimeout(t)
+  }, [success, onClose])
 
   const handleSubmit = async (e: React.FormEvent) => {
     e.preventDefault()
     try {
       await register(email, password, role)
-      onClose()
+      setSuccess(true)
     } catch (err: any) {
       setError(err.message || 'Registration failed')
     }
@@ -22,51 +29,59 @@ export default function RegisterModal({ onClose }: { onClose: () => void }) {
 
   return (
     <div className="fixed inset-0 z-50 flex items-center justify-center bg-black/40" onClick={onClose}>
-      <form
-        onSubmit={handleSubmit}
+      <div
         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>
+        {success ? (
+          <div className="space-y-2 text-center">
+            <p className="text-lg font-bold text-green-400">✓ Регистрация прошла успешно</p>
+            <p className="text-sm text-white/60">Добро пожаловать в PhotoPlaces!</p>
+          </div>
+        ) : (
+          <form onSubmit={handleSubmit} className="space-y-4">
+            <h1 className="text-center text-2xl font-bold text-white">Регистрация</h1>
 
-        {error && <p className="text-sm text-red-400">{error}</p>}
+            {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="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={8}
-        />
+            <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={8}
+            />
 
-        <select
-          value={role}
-          onChange={(e) => setRole(e.target.value)}
-          className="w-full rounded-lg border border-white/10 bg-[#15291C] 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>
+            <select
+              value={role}
+              onChange={(e) => setRole(e.target.value)}
+              className="w-full rounded-lg border border-white/10 bg-[#15291C] 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>
+            <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>
     </div>
   )
 }