feat(#28): add continue arrow and auto-advance in BreakOrder step

- Auto-advance when selecting first breaker for Winnerbreak and 2-player Wechselbreak
- Keep auto-advance after choosing second for 3-player Wechselbreak
- Add explicit right arrow to continue manually based on current selection

Refs #28
This commit is contained in:
Frank Schwenk
2025-10-30 11:51:36 +01:00
parent a11d41f934
commit dc1d9a23a9

View File

@@ -845,8 +845,8 @@ const BreakOrderStep = ({ players, rule, onNext, onCancel }: BreakOrderStepProps
const handleFirst = (idx: number) => {
setFirst(idx);
if (rule === 'wechselbreak' && playerCount === 2) {
// second implied
// Auto-advance cases: winnerbreak (any players) OR wechselbreak with 2 players
if (rule === 'winnerbreak' || (rule === 'wechselbreak' && playerCount === 2)) {
onNext(idx);
}
};
@@ -879,6 +879,21 @@ const BreakOrderStep = ({ players, rule, onNext, onCancel }: BreakOrderStepProps
<button type="button" className={styles['arrow-btn']} aria-label="Zurück" onClick={onCancel} style={{ fontSize: 48, width: 80, height: 80, borderRadius: '50%', background: '#222', color: '#fff', border: 'none', boxShadow: '0 2px 8px rgba(0,0,0,0.15)', cursor: 'pointer' }}>
&#8592;
</button>
<button
type="button"
className={styles['arrow-btn']}
aria-label="Weiter"
onClick={() => {
if (rule === 'wechselbreak' && playerCount === 3) {
handleSecond(second);
} else {
onNext(first);
}
}}
style={{ fontSize: 48, width: 80, height: 80, borderRadius: '50%', background: '#222', color: '#fff', border: 'none', boxShadow: '0 2px 8px rgba(0,0,0,0.15)', cursor: 'pointer' }}
>
&#8594;
</button>
</div>
</form>
);