Add tournament and multiplayer community chat moderation

components/MultiplayerRoom.tsx

@@ -7,6 +7,7 @@ import { Copy, Users, Crown, Trophy, MessageCircle } from "lucide-react";
 import { Brand } from "./Brand";
 import { MultiplayerGame } from "./MultiplayerGame";
 import { RoomChat } from "./RoomChat";
+import { TournamentModeration } from "./TournamentModeration";
 import { useI18n } from "./I18nProvider";
 import { api } from "@/lib/client-api";
 import { roundClock } from "@/shared/round-clock";
@@ -154,6 +155,16 @@ export function MultiplayerRoom({ id }: { id: string }) {
           available={room.status !== "closed"}
           playing
         />
+        <TournamentModeration
+          party
+          playing
+          id={id}
+          players={room.players
+            .filter((p) => !p.left)
+            .map((p) => ({ accountId: p.id, name: p.name }))}
+          ownerId={room.hostId}
+          you={room.you}
+        />
       </>
     );
   const owner = !!room?.you && room.you === room.hostId;
@@ -167,7 +178,11 @@ export function MultiplayerRoom({ id }: { id: string }) {
           {t("Play & maps")}
         </Link>
       </header>
-      <main className="section page-content multiplayer-lobby" id="main-content" tabIndex={-1}>
+      <main
+        className="section page-content multiplayer-lobby"
+        id="main-content"
+        tabIndex={-1}
+      >
         {error && (
           <p className="error-message" role="alert">
             {t(error)}{" "}
@@ -184,16 +199,15 @@ export function MultiplayerRoom({ id }: { id: string }) {
               <Users size={16} /> {t("Multiplayer")} · {room.name}
             </span>
             <p className="muted">
-              {t("Difficulty")}: <strong>
+              {t("Difficulty")}:{" "}
+              <strong>
                 {room.difficultySettings.id in difficulties
                   ? t(room.difficultySettings.name)
                   : room.difficultySettings.name}
               </strong>
               {" · "}
               {room.difficultySettings.seconds} {t("s per round")} ·{" "}
-              {room.difficultySettings.zoom
-                ? t("Zoom allowed")
-                : t("No zoom")}
+              {room.difficultySettings.zoom ? t("Zoom allowed") : t("No zoom")}
             </p>
             <h1>
               {finished
@@ -248,6 +262,15 @@ export function MultiplayerRoom({ id }: { id: string }) {
             )}
             {room.you && room.status === "lobby" && (
               <>
+                <TournamentModeration
+                  party
+                  id={id}
+                  players={room.players
+                    .filter((p) => !p.left)
+                    .map((p) => ({ accountId: p.id, name: p.name }))}
+                  ownerId={room.hostId}
+                  you={room.you}
+                />
                 <p className="lead">
                   {owner
                     ? t(