Remove redundant email display logic in WinnerBadge component.
Simplified the WinnerBadge component by removing the conditional logic for optionally displaying the email when the display name is available. Updated WinnerCard to use display name as the primary label fallback for members, ensuring cleaner and consistent rendering.
This commit is contained in:
@@ -4,8 +4,7 @@ import { stylesTokens } from "../styles/theme";
|
|||||||
/**
|
/**
|
||||||
* Props:
|
* Props:
|
||||||
* - winner: { display_name?: string, email?: string } | null
|
* - winner: { display_name?: string, email?: string } | null
|
||||||
* (oder als Fallback:)
|
* - winnerEmail: string | null (legacy fallback)
|
||||||
* - winnerEmail: string | null
|
|
||||||
*/
|
*/
|
||||||
export default function WinnerBadge({ winner, winnerEmail }) {
|
export default function WinnerBadge({ winner, winnerEmail }) {
|
||||||
const name =
|
const name =
|
||||||
@@ -15,14 +14,6 @@ export default function WinnerBadge({ winner, winnerEmail }) {
|
|||||||
|
|
||||||
if (!name) return null;
|
if (!name) return null;
|
||||||
|
|
||||||
// Optional: wenn display_name vorhanden ist, Email klein anzeigen
|
|
||||||
const showEmail =
|
|
||||||
winner &&
|
|
||||||
(winner?.email || "").trim() &&
|
|
||||||
(winner?.display_name || "").trim() &&
|
|
||||||
winner.email.trim().toLowerCase() !== winner.display_name.trim().toLowerCase();
|
|
||||||
|
|
||||||
|
|
||||||
return (
|
return (
|
||||||
<div
|
<div
|
||||||
style={{
|
style={{
|
||||||
@@ -42,17 +33,9 @@ export default function WinnerBadge({ winner, winnerEmail }) {
|
|||||||
<div style={{ display: "flex", alignItems: "center", gap: 10 }}>
|
<div style={{ display: "flex", alignItems: "center", gap: 10 }}>
|
||||||
<div style={{ fontSize: 18 }}>🏆</div>
|
<div style={{ fontSize: 18 }}>🏆</div>
|
||||||
|
|
||||||
<div style={{ display: "grid", gap: 2 }}>
|
<div style={{ color: stylesTokens.textMain, fontWeight: 900 }}>
|
||||||
<div style={{ color: stylesTokens.textMain, fontWeight: 900 }}>
|
Sieger:
|
||||||
Sieger:
|
<span style={{ color: stylesTokens.textGold }}>{" "}{name}</span>
|
||||||
<span style={{ color: stylesTokens.textGold }}>{" "}{name}</span>
|
|
||||||
</div>
|
|
||||||
|
|
||||||
{showEmail && (
|
|
||||||
<div style={{ fontSize: 12, opacity: 0.8, color: stylesTokens.textDim }}>
|
|
||||||
{winner.email}
|
|
||||||
</div>
|
|
||||||
)}
|
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
|
|||||||
@@ -23,11 +23,14 @@ export default function WinnerCard({
|
|||||||
style={{ ...styles.input, flex: 1 }}
|
style={{ ...styles.input, flex: 1 }}
|
||||||
>
|
>
|
||||||
<option value="">— kein Sieger —</option>
|
<option value="">— kein Sieger —</option>
|
||||||
{members.map((m) => (
|
{members.map((m) => {
|
||||||
<option key={m.id} value={m.id}>
|
const dn = ((m.display_name || "").trim() || (m.email || "").trim());
|
||||||
{m.email}
|
return (
|
||||||
</option>
|
<option key={m.id} value={m.id}>
|
||||||
))}
|
{dn}
|
||||||
|
</option>
|
||||||
|
);
|
||||||
|
})}
|
||||||
</select>
|
</select>
|
||||||
|
|
||||||
<button onClick={onSave} style={styles.primaryBtn}>
|
<button onClick={onSave} style={styles.primaryBtn}>
|
||||||
|
|||||||
Reference in New Issue
Block a user