import React, { createContext, useContext, useReducer, useEffect } from 'react'; export const ACTIONS = { START_GAME: 'start_game', ADD_ROUND: 'add_round', RESET_GAME: 'reset_game', SAVE_GAME: 'save_game', LOAD_HISTORY: 'load_history', SET_TARGET_FACE: 'set_target_face' }; // Define the available score values for each game type and target face export const TARGET_FACES = { '300': { 'standard': [0, 1, 2, 3, 4, 5, 'x'], // Standard scoring for 300 game '5-spot': [0, 4, 5, 'x'] // 5-spot target face for 300 game }, '450': { 'standard': [0, 1, 2, 3, 4, 5, 6, 7, 8, 9, 10, 'x'], // Standard scoring for 450 game '3-spot': [0, 6, 7, 8, 9, 10, 'x'] // 3-spot target face for 450 game } }; const initialState = { currentGame: { gameType: '', isLeague: false, targetFace: 'standard', // Default to standard target face rounds: [], totalScore: 0, totalBullseyes: 0, date: null, availableScores: [] // Will be populated based on gameType and targetFace }, history: [] }; // Helper function to get available scores based on game type and target face const getAvailableScores = (gameType, targetFace) => { if (!gameType || !targetFace) return []; return TARGET_FACES[gameType]?.[targetFace] || []; }; const scoreReducer = (state, action) => { switch (action.type) { case ACTIONS.START_GAME: // Changed from START_NEW_ROUND to match the exported ACTIONS const gameType = action.payload.gameType; const targetFace = action.payload.targetFace || 'standard'; return { ...state, currentGame: { gameType, isLeague: action.payload.isLeague, targetFace, rounds: [], totalScore: 0, totalBullseyes: 0, dateStarted: new Date().toISOString(), availableScores: getAvailableScores(gameType, targetFace) }, }; case ACTIONS.SET_TARGET_FACE: const newTargetFace = action.payload.targetFace; return { ...state, currentGame: { ...state.currentGame, targetFace: newTargetFace, availableScores: getAvailableScores(state.currentGame.gameType, newTargetFace) } }; case ACTIONS.ADD_ROUND: const updatedRounds = [...state.currentGame.rounds]; updatedRounds[action.payload.roundIndex] = { arrows: action.payload.arrows, total: action.payload.total, bullseyes: action.payload.arrows.filter(arrow => arrow.isBullseye).length }; const totalScore = updatedRounds.reduce((sum, round) => sum + round.total, 0); const totalBullseyes = updatedRounds.reduce((sum, round) => sum + round.bullseyes, 0); return { ...state, currentGame: { ...state.currentGame, rounds: updatedRounds, totalScore, totalBullseyes }, }; case ACTIONS.SAVE_GAME: if (!state.currentGame.isLeague) return state; // Only save league games const updatedHistory = [ ...state.history, { ...state.currentGame } ]; // Save to localStorage localStorage.setItem('archeryHistory', JSON.stringify(updatedHistory)); return { ...state, history: updatedHistory }; case ACTIONS.LOAD_HISTORY: return { ...state, history: action.payload }; case ACTIONS.RESET_GAME: return { ...state, currentGame: initialState.currentGame }; default: return state; } }; const ScoreContext = createContext(); export const ScoreProvider = ({ children }) => { const [state, dispatch] = useReducer(scoreReducer, initialState); // Load history from localStorage on initial mount useEffect(() => { const savedHistory = localStorage.getItem('archeryHistory'); if (savedHistory) { dispatch({ type: ACTIONS.LOAD_HISTORY, payload: JSON.parse(savedHistory) }); } }, []); return ( {children} ); }; export const useScore = () => { const context = useContext(ScoreContext); if (!context) { throw new Error('useScore must be used within a ScoreProvider'); } return context; };