feat(game): add configurable rounds per room

app/api/rooms/[code]/route.ts

@@ -65,8 +65,8 @@ export async function PATCH(
       if (!playerName || typeof playerName !== "string" || playerName.trim() === "") {
         return Response.json({ error: "Pseudo invalide" }, { status: 400 });
       }
-      if (room.players.length >= 8) {
+      if (room.players.length >= room.maxPlayers) {
-        return Response.json({ error: "Salle pleine (8 joueurs max)" }, { status: 409 });
+        return Response.json({ error: `Salle pleine (${room.maxPlayers} joueurs max)` }, { status: 409 });
       }
       if (room.phase !== "waiting" && room.phase !== "results") {
         return Response.json({ error: "Partie en cours, attends la prochaine manche" }, { status: 409 });

app/api/rooms/route.ts

@@ -21,6 +21,7 @@ export type Room = {
   phase: "waiting" | "countdown" | "playing" | "results";
   round: number;
   totalRounds: number;
+  maxPlayers: number;
   startArticle: string;
   targetArticle: string;
   roundWinner: string | null; // player id
@@ -75,12 +76,15 @@ function pruneOldRooms(rooms: Map<string, Room>) {
 // Response: { room: Room, playerId: string }
 export async function POST(request: NextRequest) {
   const body = await request.json();
-  const { playerName } = body as { playerName: string };
+  const { playerName, maxPlayers, totalRounds } = body as { playerName: string; maxPlayers?: number; totalRounds?: number };
 
   if (!playerName || typeof playerName !== "string" || playerName.trim() === "") {
     return Response.json({ error: "Pseudo invalide" }, { status: 400 });
   }
 
+  const clampedMax = Math.min(Math.max(typeof maxPlayers === "number" ? Math.floor(maxPlayers) : 16, 2), 16);
+  const clampedRounds = Math.min(Math.max(typeof totalRounds === "number" ? Math.floor(totalRounds) : 3, 1), 10);
+
   const rooms = getRooms();
   pruneOldRooms(rooms);
 
@@ -109,7 +113,8 @@ export async function POST(request: NextRequest) {
     ],
     phase: "waiting",
     round: 0,
-    totalRounds: 3,
+    totalRounds: clampedRounds,
+    maxPlayers: clampedMax,
     startArticle: "",
     targetArticle: "",
     roundWinner: null,

app/components/HomeScreen.tsx

@@ -30,6 +30,10 @@ type HomeScreenProps = {
   setPlayerName: (v: string) => void;
   joinCode: string;
   setJoinCode: (v: string) => void;
+  maxPlayers: number;
+  setMaxPlayers: (v: number) => void;
+  totalRounds: number;
+  setTotalRounds: (v: number) => void;
   error: string | null;
   setError: (v: string | null) => void;
   loading: boolean;
@@ -49,6 +53,10 @@ export function HomeScreen({
   setPlayerName,
   joinCode,
   setJoinCode,
+  maxPlayers,
+  setMaxPlayers,
+  totalRounds,
+  setTotalRounds,
   error,
   setError,
   loading,
@@ -147,13 +155,47 @@ export function HomeScreen({
             <h3 className="text-[10px] sm:text-xs font-bold text-[#888] uppercase tracking-wider">
               Multijoueur
             </h3>
+            <div className="flex items-center justify-between gap-3">
               <button
-            className="w-full min-h-11 rounded-xl text-sm font-semibold bg-[#7c3aed] text-white hover:bg-[#6d28d9] disabled:opacity-50 cursor-pointer transition-colors"
+                className="flex-1 min-h-11 rounded-xl text-sm font-semibold bg-[#7c3aed] text-white hover:bg-[#6d28d9] disabled:opacity-50 cursor-pointer transition-colors"
                 onClick={onCreateRoom}
                 disabled={loading}
               >
                 {loading ? "Création..." : "Créer une partie"}
               </button>
+              <div className="flex items-center gap-1.5 shrink-0">
+                <span className="text-xs text-[#888] whitespace-nowrap">
+                  Max
+                </span>
+                <select
+                  value={maxPlayers}
+                  onChange={(e) => setMaxPlayers(Number(e.target.value))}
+                  className="min-h-11 px-2 bg-[#1a1a1a] border border-[#2e2e2e] rounded-xl text-sm text-[#f0f0f0] outline-none focus:border-[#7c3aed] cursor-pointer transition-colors"
+                >
+                  {[2, 3, 4, 5, 6, 7, 8, 10, 12, 14, 16].map((n) => (
+                    <option key={n} value={n}>
+                      {n} joueurs
+                    </option>
+                  ))}
+                </select>
+              </div>
+              <div className="flex items-center gap-1.5 shrink-0">
+                <span className="text-xs text-[#888] whitespace-nowrap">
+                  Manches
+                </span>
+                <select
+                  value={totalRounds}
+                  onChange={(e) => setTotalRounds(Number(e.target.value))}
+                  className="min-h-11 px-2 bg-[#1a1a1a] border border-[#2e2e2e] rounded-xl text-sm text-[#f0f0f0] outline-none focus:border-[#7c3aed] cursor-pointer transition-colors"
+                >
+                  {[1, 2, 3, 4, 5, 7, 10].map((n) => (
+                    <option key={n} value={n}>
+                      {n}
+                    </option>
+                  ))}
+                </select>
+              </div>
+            </div>
             {/* Join row - colonne sur mobile, ligne sur sm+ */}
             <div className="flex flex-col sm:flex-row gap-2">
               <input

app/components/LobbyScreen.tsx

@@ -62,7 +62,7 @@ export function LobbyScreen({
       {/* Players */}
       <div className="w-full">
         <h3 className="text-[10px] sm:text-xs font-bold text-[#888] uppercase tracking-wider mb-2">
-          Joueurs ({room.players.length}/8)
+          Joueurs ({room.players.length}/{room.maxPlayers})
         </h3>
         <ul className="flex flex-col gap-2">
           {room.players.map((p) => (

app/components/ScreenRouter.tsx

@@ -28,6 +28,10 @@ type Props = {
   setPlayerName: Dispatch<SetStateAction<string>>;
   joinCode: string;
   setJoinCode: Dispatch<SetStateAction<string>>;
+  maxPlayers: number;
+  setMaxPlayers: Dispatch<SetStateAction<number>>;
+  totalRounds: number;
+  setTotalRounds: Dispatch<SetStateAction<number>>;
   error: string | null;
   setError: Dispatch<SetStateAction<string | null>>;
   loading: boolean;
@@ -38,6 +42,8 @@ type Props = {
 export function ScreenRouter({
   screen, setScreen, session, solo, multi, handlers,
   playerName, setPlayerName, joinCode, setJoinCode,
+  maxPlayers, setMaxPlayers,
+  totalRounds, setTotalRounds,
   error, setError, loading, showAuth, setShowAuth,
 }: Props) {
   if (screen === "profile") return (
@@ -61,6 +67,8 @@ export function ScreenRouter({
       <HomeScreen
         playerName={playerName} setPlayerName={setPlayerName}
         joinCode={joinCode} setJoinCode={setJoinCode}
+        maxPlayers={maxPlayers} setMaxPlayers={setMaxPlayers}
+        totalRounds={totalRounds} setTotalRounds={setTotalRounds}
         error={error} setError={setError} loading={loading}
         onCreateRoom={handlers.handleCreateRoom}
         onJoinRoom={handlers.handleJoinRoom}

app/page.tsx

@@ -12,6 +12,8 @@ export default function WikiRush() {
   const [screen, setScreen] = useState<Screen>("home");
   const [playerName, setPlayerName] = useState("");
   const [joinCode, setJoinCode] = useState("");
+  const [maxPlayers, setMaxPlayers] = useState(16);
+  const [totalRounds, setTotalRounds] = useState(3);
   const [error, setError] = useState<string | null>(null);
   const [loading, setLoading] = useState(false);
   const [showAuth, setShowAuth] = useState(false);
@@ -20,7 +22,7 @@ export default function WikiRush() {
   const multi = useMultiGame();
 
   const { session } = useGameEffects({ solo, multi, screen, setScreen, setPlayerName });
-  const handlers = useGameHandlers({ solo, multi, playerName, joinCode, setScreen, setError, setLoading });
+  const handlers = useGameHandlers({ solo, multi, playerName, joinCode, maxPlayers, totalRounds, setScreen, setError, setLoading });
 
   return (
     <ScreenRouter
@@ -28,6 +30,8 @@ export default function WikiRush() {
       solo={solo} multi={multi} handlers={handlers}
       playerName={playerName} setPlayerName={setPlayerName}
       joinCode={joinCode} setJoinCode={setJoinCode}
+      maxPlayers={maxPlayers} setMaxPlayers={setMaxPlayers}
+      totalRounds={totalRounds} setTotalRounds={setTotalRounds}
       error={error} setError={setError} loading={loading}
       showAuth={showAuth} setShowAuth={setShowAuth}
     />

lib/useGameHandlers.ts

@@ -11,18 +11,20 @@ type Handlers = {
   multi: UseMultiGame;
   playerName: string;
   joinCode: string;
+  maxPlayers: number;
+  totalRounds: number;
   setScreen: Dispatch<SetStateAction<Screen>>;
   setError: Dispatch<SetStateAction<string | null>>;
   setLoading: Dispatch<SetStateAction<boolean>>;
 };
 
 export function useGameHandlers({
-  solo, multi, playerName, joinCode, setScreen, setError, setLoading,
+  solo, multi, playerName, joinCode, maxPlayers, totalRounds, setScreen, setError, setLoading,
 }: Handlers) {
   async function handleCreateRoom() {
     if (!playerName.trim()) { setError("Entre ton pseudo !"); return; }
     setLoading(true); setError(null);
-    const { error: err } = await multi.createRoom(playerName.trim());
+    const { error: err } = await multi.createRoom(playerName.trim(), maxPlayers, totalRounds);
     setLoading(false);
     if (err) { setError(err); return; }
     setScreen("lobby");

lib/useMultiGame.ts

@@ -152,11 +152,11 @@ export function useMultiGame() {
 
   // Room actions
 
-  async function createRoom(playerName: string): Promise<{ error?: string }> {
+  async function createRoom(playerName: string, maxPlayers = 16, totalRounds = 3): Promise<{ error?: string }> {
     const res = await fetch("/api/rooms", {
       method: "POST",
       headers: { "Content-Type": "application/json" },
-      body: JSON.stringify({ playerName }),
+      body: JSON.stringify({ playerName, maxPlayers, totalRounds }),
     });
     const data = await res.json() as { room?: Room; playerId?: string; error?: string };
     if (!res.ok) return { error: data.error ?? "Erreur" };