From b15418e949b5cf98d79599607022c50bab6eea7a Mon Sep 17 00:00:00 2001 From: jessy-david-dev Date: Fri, 10 Apr 2026 18:58:41 +0200 Subject: [PATCH] =?UTF-8?q?refactor:=20migrate=20all=20components=20to=20T?= =?UTF-8?q?ailwind,=20globals.css=201676=20=E2=86=92=2088=20lignes?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- app/components/AuthModal.tsx | 77 +- app/components/Breadcrumbs.tsx | 8 +- app/components/GameScreen.tsx | 176 +-- app/components/HomeScreen.tsx | 91 +- app/components/LeaderboardScreen.tsx | 74 +- app/components/LobbyScreen.tsx | 78 +- app/components/ProfileScreen.tsx | 113 +- app/components/SoloScreen.tsx | 193 +-- app/globals.css | 1677 +------------------------- 9 files changed, 488 insertions(+), 1999 deletions(-) diff --git a/app/components/AuthModal.tsx b/app/components/AuthModal.tsx index 0865562..c941215 100644 --- a/app/components/AuthModal.tsx +++ b/app/components/AuthModal.tsx @@ -17,7 +17,6 @@ export function AuthModal({ onClose, onSuccess }: { onClose: () => void; onSucce e.preventDefault(); setError(null); setLoading(true); - try { if (mode === "register") { const res = await fetch("/api/register", { @@ -28,11 +27,7 @@ export function AuthModal({ onClose, onSuccess }: { onClose: () => void; onSucce const data = await res.json() as { error?: string }; if (!res.ok) { setError(data.error ?? "Erreur"); return; } } - - const result = await signIn("credentials", { - email, password, redirect: false, - }); - + const result = await signIn("credentials", { email, password, redirect: false }); if (result?.error) { setError("Email ou mot de passe incorrect"); return; } onSuccess(); } finally { @@ -40,62 +35,40 @@ export function AuthModal({ onClose, onSuccess }: { onClose: () => void; onSucce } } + const inputCls = "w-full min-h-11 px-3.5 bg-[#0f0f0f] border-[1.5px] border-[#2e2e2e] rounded-xl text-[#f0f0f0] text-sm outline-none focus:border-[#7c3aed]"; + return ( -
-
e.stopPropagation()}> -
- - +
+
e.stopPropagation()}> + + +
+ {(["login", "register"] as Mode[]).map((m) => ( + + ))}
-
+ {mode === "register" && ( - setName(e.target.value)} - required - maxLength={30} - /> + setName(e.target.value)} required maxLength={30} /> )} - setEmail(e.target.value)} - required - /> - setPassword(e.target.value)} - required - minLength={6} - /> + setEmail(e.target.value)} required /> + setPassword(e.target.value)} required minLength={6} /> - {error &&
{error}
} + {error && ( +
{error}
+ )} -
- -
); diff --git a/app/components/Breadcrumbs.tsx b/app/components/Breadcrumbs.tsx index d4e235f..92c23ac 100644 --- a/app/components/Breadcrumbs.tsx +++ b/app/components/Breadcrumbs.tsx @@ -4,11 +4,11 @@ import { useRef } from "react"; export function Breadcrumbs({ history, endRef }: { history: string[]; endRef: React.RefObject }) { return ( -
+
{history.map((title, i) => ( - - {i > 0 && ›} - + + {i > 0 && ›} + {title} diff --git a/app/components/GameScreen.tsx b/app/components/GameScreen.tsx index 835ad7c..a235729 100644 --- a/app/components/GameScreen.tsx +++ b/app/components/GameScreen.tsx @@ -36,100 +36,109 @@ export function GameScreen({ breadcrumbEndRef.current?.scrollIntoView({ behavior: "smooth", block: "nearest", inline: "end" }); }, [history]); - if (room.phase === "results") { - return ( -
-
-
- {winner ? ( - <> -
Victoire !
-
{winner.name} a gagne la manche !
- - ) : ( -
Manche terminee !
- )} -
-
- {room.startArticle} - → - {room.targetArticle} -
-
-

Classement

-
    - {sortedPlayers.map((p, i) => ( -
  • - #{i + 1} - {p.name} - {p.hasWon && Gagnant} - {p.score} pts -
    • - ))} -
-
- {isHost ? ( -
- - -
+ // Results + if (room.phase === "results") return ( +
+
+
+ {winner ? ( + <> +
🏆
+
{winner.name} a gagné la manche !
+ ) : ( -

En attente de l'hote...

+
Manche terminée !
)}
-
- ); - } - - if (room.phase === "countdown") { - return ( -
-
-
-
- Depart - {room.startArticle} -
-
→
-
- Cible - {room.targetArticle} -
+
+ {room.startArticle} + → + {room.targetArticle} +
+
+

Classement

+
    + {sortedPlayers.map((p, i) => ( +
  • + #{i + 1} + {p.name} + {p.hasWon && Gagnant} + {p.score} pts +
    • + ))} +
+
+ {isHost ? ( +
+ +
-
- {countdown !== null && countdown > 0 ? countdown : "Partez !"} + ) : ( +

En attente de l'hôte...

+ )} +
+
+ ); + + // Countdown + if (room.phase === "countdown") return ( +
+
+
+
+ Départ + {room.startArticle} +
+ → +
+ Cible + {room.targetArticle}
+
+ {countdown !== null && countdown > 0 ? countdown : "Partez !"} +
- ); - } +
+ ); + // Playing return ( -
-
-
-
- CIBLE - {room.targetArticle} +
+ {/* Topbar */} +
+
+
+ Cible + {room.targetArticle}
-
- {elapsed} - {clicks} clics - {myPlayer?.score ?? 0} pts +
+ {elapsed} + {clicks} clics + {myPlayer?.score ?? 0} pts
-
-
+ {/* Content + sidebar */} +
+
{loading && ( -
Chargement...
+
+
Chargement... +
)} {loadError && ( -
-

{loadError}

- +
+

{loadError}

+
)} {!loading && !loadError && html && ( @@ -140,14 +149,15 @@ export function GameScreen({ )}
-