diff --git a/App.js b/App.js new file mode 100644 index 00000000..e894b486 --- /dev/null +++ b/App.js @@ -0,0 +1,22 @@ + +import React from 'react'; +import { NavigationContainer } from '@react-navigation/native'; +import { createStackNavigator } from '@react-navigation/stack'; +import QuizScreen from './QuizScreen'; +import ResultsScreen from './ResultsScreen'; + +const Stack = createStackNavigator(); + +function App() { + return ( + + + + + + + ); +} + +export default App; + \ No newline at end of file diff --git a/QuizScreen.js b/QuizScreen.js new file mode 100644 index 00000000..29faa0f8 --- /dev/null +++ b/QuizScreen.js @@ -0,0 +1,61 @@ + +import React, { useState, useEffect } from 'react'; +import { View, Text, Button, StyleSheet } from 'react-native'; +import { useDispatch, useSelector } from 'react-redux'; +import { setQuestion, setScore, nextQuestion } from './redux/actions'; +import { questions } from './data/questions.json'; + +const QuizScreen = ({ navigation }) => { + const dispatch = useDispatch(); + const currentQuestionIndex = useSelector((state) => state.currentQuestionIndex); + const score = useSelector((state) => state.score); + + const [timer, setTimer] = useState(30); + + useEffect(() => { + dispatch(setQuestion(questions[0])); + }, []); + + useEffect(() => { + if (timer > 0) { + const interval = setInterval(() => setTimer((prev) => prev - 1), 1000); + return () => clearInterval(interval); + } + }, [timer]); + + const handleAnswer = (selectedAnswer) => { + const correctAnswer = questions[currentQuestionIndex].answer; + if (selectedAnswer === correctAnswer) { + dispatch(setScore(score + 1)); + } + dispatch(nextQuestion()); + }; + + const currentQuestion = questions[currentQuestionIndex]; + + return ( + + {currentQuestion.question} + {currentQuestion.options.map((option, idx) => ( +