feat: Implement rematch functionality

Refs #17

Adds a 'Rematch' button to the game completion modal.

Introduces a 'handleRematch' function in 'App.jsx' to create a new game with the same players and settings as the previous game.

The 'onRematch' handler is passed down to the 'GameCompletionModal' component.

Adds '.gitea' to '.gitignore' to prevent tracking local issue context.
This commit is contained in:
Frank Schwenk
2025-06-20 13:35:42 +02:00
parent 429d479f69
commit 875e9c8795
3 changed files with 21 additions and 2 deletions

2
.gitignore vendored
View File

@@ -24,4 +24,4 @@ pnpm-debug.log*
.idea/
.gitea
dev/
dev/.gitea

View File

@@ -117,6 +117,22 @@ const App = () => {
setScreen('game-detail');
}, [currentGameId]);
const handleRematch = useCallback(() => {
const completedGame = games.find(g => g.id === currentGameId);
if (!completedGame) return;
const newId = handleCreateGame({
player1: completedGame.player1,
player2: completedGame.player2,
player3: completedGame.player3,
gameType: completedGame.gameType,
raceTo: completedGame.raceTo,
});
setCompletionModal({ open: false, game: null });
showGameDetail(newId);
}, [games, currentGameId, handleCreateGame, showGameDetail]);
// Delete game
const handleDeleteGame = useCallback((id) => {
setModal({ open: true, gameId: id });
@@ -258,6 +274,7 @@ const App = () => {
game={completionModal.game}
onConfirm={handleConfirmCompletion}
onClose={() => setCompletionModal({ open: false, game: null })}
onRematch={handleRematch}
/>
<FullscreenToggle />
</div>

View File

@@ -9,9 +9,10 @@ import styles from './GameCompletionModal.module.css';
* @param {object} props.game
* @param {Function} props.onConfirm
* @param {Function} props.onClose
* @param {Function} props.onRematch
* @returns {import('preact').VNode|null}
*/
const GameCompletionModal = ({ open, game, onConfirm, onClose }) => {
const GameCompletionModal = ({ open, game, onConfirm, onClose, onRematch }) => {
if (!open || !game) return null;
const playerNames = [game.player1, game.player2, game.player3].filter(Boolean);
const scores = [game.score1, game.score2, game.score3].filter((_, i) => playerNames[i]);
@@ -41,6 +42,7 @@ const GameCompletionModal = ({ open, game, onConfirm, onClose }) => {
</div>
<div className={modalStyles['modal-footer']}>
<button className={styles['btn'] + ' ' + styles['btn--warning']} onClick={onConfirm} aria-label="Bestätigen">Bestätigen</button>
<button className={styles['btn'] + ' ' + styles['btn--primary']} onClick={onRematch} aria-label="Rematch">Rematch</button>
<button className={styles['btn']} onClick={onClose} aria-label="Abbrechen">Abbrechen</button>
</div>
</div>