+ Saisis le code à 6 chiffres affiché sur ton Ti-Pote
+
+
+
+
+
+
+
+ ← Retour au tableau de bord
+
+
+
+
+
💡 Comment obtenir le code ?
+
+ Allume ton Ti-Pote. Lors du premier démarrage, il annonce vocalement un code à
+ 6 chiffres et l'affiche (écran / LED / logs). Ce code n'est valable que 10 minutes.
+
+
+
+
+ );
+}
diff --git a/apps/frontend/src/pages/RegisterPage.tsx b/apps/frontend/src/pages/RegisterPage.tsx
new file mode 100644
index 0000000..b8d0d73
--- /dev/null
+++ b/apps/frontend/src/pages/RegisterPage.tsx
@@ -0,0 +1,119 @@
+import { useState, type FormEvent } from 'react';
+import { Link, useNavigate } from 'react-router-dom';
+import { Button, Card, Input } from '../components/ui';
+import { useAuth } from '../context/AuthContext';
+import { ApiError } from '../lib/api';
+
+export function RegisterPage() {
+ const { register } = useAuth();
+ const navigate = useNavigate();
+
+ const [displayName, setDisplayName] = useState('');
+ const [homeName, setHomeName] = useState('');
+ const [email, setEmail] = useState('');
+ const [password, setPassword] = useState('');
+ const [submitting, setSubmitting] = useState(false);
+ const [error, setError] = useState(null);
+
+ async function onSubmit(e: FormEvent) {
+ e.preventDefault();
+ setError(null);
+
+ if (password.length < 8) {
+ setError('Le mot de passe doit faire au moins 8 caractères.');
+ return;
+ }
+
+ setSubmitting(true);
+ try {
+ await register({ email, password, displayName, homeName });
+ navigate('/', { replace: true });
+ } catch (err) {
+ if (err instanceof ApiError) {
+ setError(
+ err.status === 409
+ ? 'Cette adresse email est déjà utilisée.'
+ : err.message || "Erreur lors de l'inscription.",
+ );
+ } else {
+ setError('Impossible de joindre le serveur.');
+ }
+ } finally {
+ setSubmitting(false);
+ }
+ }
+
+ return (
+
+
+
+
+ ✨
+
+
Crée ton compte
+
+ Associe un Ti-Pote à ta maison en quelques secondes
+