Hide game sheet sections and winner selection until game has started

Wrapped WinnerBadge, SheetSection grid, and WinnerCard components in conditional rendering based on `gameStarted` flag derived from game metadata's `started` property. Prevents display of game content in lobby state before host initiates gameplay.
This commit is contained in:
2026-08-02 09:21:01 +02:00
parent 46c6044948
commit 1bbbe31500
+33 -27
View File
@@ -622,6 +622,7 @@ export default function App() {
: []; : [];
const isHost = !!(me?.id && gameMeta?.host_user_id && me.id === gameMeta.host_user_id); const isHost = !!(me?.id && gameMeta?.host_user_id && me.id === gameMeta.host_user_id);
const gameStarted = !!gameMeta?.started;
return ( return (
<div style={styles.page}> <div style={styles.page}>
@@ -666,38 +667,43 @@ export default function App() {
onStartGame={startGame} onStartGame={startGame}
/> />
{/* Sieger Badge: zwischen Spiel und Verdächtigte Person */} {gameStarted && (
<WinnerBadge <WinnerBadge
winner={{ winner={{
display_name: gameMeta?.winner_display_name || "", display_name: gameMeta?.winner_display_name || "",
email: gameMeta?.winner_email || "", email: gameMeta?.winner_email || "",
}} }}
/> />
)}
<HelpModal open={helpOpen} onClose={() => setHelpOpen(false)} /> <HelpModal open={helpOpen} onClose={() => setHelpOpen(false)} />
<div style={{ marginTop: 14, display: "grid", gap: 14 }}> {gameStarted && (
{sections.map((sec) => ( <div style={{ marginTop: 14, display: "grid", gap: 14 }}>
<SheetSection {sections.map((sec) => (
key={sec.key} <SheetSection
title={sec.title} key={sec.key}
entries={sec.entries} title={sec.title}
pulseId={pulseId} entries={sec.entries}
onCycleStatus={cycleStatus} pulseId={pulseId}
onToggleTag={toggleTag} onCycleStatus={cycleStatus}
displayTag={displayTag} onToggleTag={toggleTag}
/> displayTag={displayTag}
))} />
</div> ))}
</div>
)}
{/* Host-only Winner Auswahl */} {/* Host-only Winner Auswahl */}
<WinnerCard {gameStarted && (
isHost={isHost} <WinnerCard
members={members} isHost={isHost}
winnerUserId={winnerUserId} members={members}
setWinnerUserId={setWinnerUserId} winnerUserId={winnerUserId}
onSave={saveWinner} setWinnerUserId={setWinnerUserId}
/> onSave={saveWinner}
/>
)}
<div style={{ height: 24 }} /> <div style={{ height: 24 }} />
</div> </div>