v1.0.0

frontend/src/pages/Register.jsx

@@ -0,0 +1,68 @@
+import { useState } from 'react';
+import { Link, useNavigate, useSearchParams } from 'react-router-dom';
+import { useAuth } from '../auth/AuthContext.jsx';
+import { useJoinHousehold } from '../api/queries.js';
+import { useHouseholdContext } from '../household/HouseholdContext.jsx';
+import PasswordField from '../components/PasswordField.jsx';
+
+export default function Register() {
+  const { register } = useAuth();
+  const navigate = useNavigate();
+  const [params] = useSearchParams();
+  const inviteCode = params.get('code') || '';
+  const joinHousehold = useJoinHousehold();
+  const { switchHousehold } = useHouseholdContext();
+  const [name, setName] = useState('');
+  const [email, setEmail] = useState('');
+  const [password, setPassword] = useState('');
+  const [error, setError] = useState('');
+  const [loading, setLoading] = useState(false);
+
+  async function handleSubmit(e) {
+    e.preventDefault();
+    setError('');
+    setLoading(true);
+    try {
+      await register(email, password, name);
+      if (inviteCode) {
+        const result = await joinHousehold.mutateAsync(inviteCode);
+        switchHousehold(result.household.id);
+        navigate('/', { replace: true });
+      } else {
+        navigate('/onboarding', { replace: true });
+      }
+    } catch (err) {
+      setError(err.message);
+    } finally {
+      setLoading(false);
+    }
+  }
+
+  return (
+    <div className="auth-page">
+      <h1>KtoCo</h1>
+      <p className="auth-subtitle">
+        {inviteCode
+          ? 'Załóż konto, aby dołączyć do zaproszonego gospodarstwa domowego'
+          : 'Załóż konto, by zacząć dzielić wydatki'}
+      </p>
+      <form onSubmit={handleSubmit} className="auth-form">
+        <input type="text" placeholder="Imię" value={name} onChange={(e) => setName(e.target.value)} required />
+        <input type="email" placeholder="E-mail" value={email} onChange={(e) => setEmail(e.target.value)} required />
+        <PasswordField
+          placeholder="Hasło (min. 6 znaków)"
+          value={password}
+          onChange={(e) => setPassword(e.target.value)}
+        />
+        {error && <p className="form-error">{error}</p>}
+        <button type="submit" className="btn-primary" disabled={loading}>
+          {loading ? 'Tworzenie konta…' : 'Zarejestruj się'}
+        </button>
+      </form>
+      <p>
+        Masz już konto?{' '}
+        <Link to={inviteCode ? `/login?code=${encodeURIComponent(inviteCode)}` : '/login'}>Zaloguj się</Link>
+      </p>
+    </div>
+  );
+}