Skip to content

Commit

Permalink
Merge pull request #658 from bounswe/MOBILE-624
Browse files Browse the repository at this point in the history
feat(mobile): Integrating Quiz Solution Logic with Backend
  • Loading branch information
YavizGuldalf authored Nov 24, 2024
2 parents 98be923 + 4bf331e commit 690d7af
Show file tree
Hide file tree
Showing 5 changed files with 413 additions and 241 deletions.
11 changes: 7 additions & 4 deletions mobile/bulingo/app/(tabs)/quizzes/quizCreationInfo.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -10,7 +10,7 @@ const QuizCreationInfo = () => {
const [newAnswer, setNewAnswer] = useState('');
const [selectedAnswerIndex, setSelectedAnswerIndex] = useState<number | null>(null);
const [selectedType, setSelectedType] = useState('Type II');
const [correctAnswerIndex, setCorrectAnswerIndex] = useState(null)
const [correctAnswerIndex, setCorrectAnswerIndex] = useState<number | null>(null)

const isButtonDisabled = () => {
const nonEmptyAnswers = answers.filter(answer => answer.trim() !== "");
Expand All @@ -22,13 +22,16 @@ const QuizCreationInfo = () => {
const styles = getStyles(colorScheme);

// get params from the previous screen
const { initialQuestion, initialAnswers, initialCorrectAnswer, type, index} = useLocalSearchParams();
const { initialQuestion, initialAnswers, initialCorrectAnswer, type, index, trigger} = useLocalSearchParams();




useEffect(() => {
if (initialQuestion && initialAnswers && initialCorrectAnswer) {
setQuestion(Array.isArray(initialQuestion) ? initialQuestion[0] : initialQuestion);
setAnswers(JSON.parse(Array.isArray(initialAnswers) ? initialAnswers[0] : initialAnswers));
setCorrectAnswerIndex(JSON.parse(Array.isArray(initialAnswers) ? initialAnswers[0] : initialAnswers).indexOf(initialCorrectAnswer));
setCorrectAnswerIndex(Number(initialCorrectAnswer));
setSelectedType(type instanceof Array ? type[0] : type);
}
}, [initialQuestion, initialAnswers, initialCorrectAnswer]);
Expand Down Expand Up @@ -65,7 +68,7 @@ const QuizCreationInfo = () => {
};

const handleAddQuestion = () => {
router.navigate({ pathname: '/(tabs)/quizzes/quizCreationQuestionList', params: { question: question, answers: JSON.stringify(answers), correctAnswer: correctAnswerIndex, selectedType: selectedType, index: index } });
router.navigate({ pathname: '/(tabs)/quizzes/quizCreationQuestionList', params: { question: question, answers: JSON.stringify(answers), correctAnswer: correctAnswerIndex, selectedType: selectedType, index: index, trigger: trigger} });
};

const handleTypeSelect = (type: string) => {
Expand Down
27 changes: 12 additions & 15 deletions mobile/bulingo/app/(tabs)/quizzes/quizCreationQuestionList.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -21,8 +21,6 @@ type QuizDetails = {
tags: string[];
};

let uniqueQuestionKey = 0;

const QuizCreationQuestionList = () => {
const [questions, setQuestions] = useState<Question[]>([]);

Expand Down Expand Up @@ -59,20 +57,21 @@ const QuizCreationQuestionList = () => {
const colorScheme = useColorScheme();
const styles = getStyles(colorScheme);

const { question, answers, correctAnswer, selectedType, index } = useLocalSearchParams();

const { question, answers, correctAnswer, selectedType, index, trigger } = useLocalSearchParams();
const parsedAnswers = Array.isArray(answers) ? answers.join(', ') : answers ? JSON.parse(answers) : [];

const key = questions.length === 0 ? 0 : questions[questions.length - 1].id + 1;


useEffect(() => {
if (question && answers && correctAnswer && selectedType) {
const newQuestion = {
id: index !== undefined ? questions[Number(index)].id : uniqueQuestionKey,
id: index !== undefined ? questions[Number(index)].id : key,
name: Array.isArray(question) ? question[0] : question,
correctAnswer: Array.isArray(correctAnswer) ? correctAnswer[0] : correctAnswer,
answers: parsedAnswers,
type: Array.isArray(selectedType) ? selectedType[0] : selectedType
};
console.log(newQuestion);

if (index !== undefined) {
setQuestions((prevQuestions) => {
Expand All @@ -83,18 +82,19 @@ const QuizCreationQuestionList = () => {
});
return;
}
uniqueQuestionKey++;
setQuestions((prevQuestions) => [...prevQuestions, newQuestion]);

const newQuest = { ...newQuestion };
setQuestions((prevQuestions) => [...prevQuestions, newQuest]);
saveQuestions(questions);
}
}, [question, answers, correctAnswer, selectedType]);
}, [question, answers, correctAnswer, selectedType, trigger]);

const handleAddQuestion = () => {
router.navigate('/(tabs)/quizzes/quizCreationInfo');
router.navigate({pathname: '/(tabs)/quizzes/quizCreationInfo', params: { "trigger": key }});
};

const handleUpdateQuestion = (index: number) => {
router.navigate({pathname: '/(tabs)/quizzes/quizCreationInfo', params: { "initialQuestion": questions[index].name , "initialAnswers": JSON.stringify(questions[index].answers), "initialCorrectAnswer": questions[index].correctAnswer, "type": questions[index].type, "index": index}});
router.navigate({pathname: '/(tabs)/quizzes/quizCreationInfo', params: { "initialQuestion": questions[index].name , "initialAnswers": JSON.stringify(questions[index].answers), "initialCorrectAnswer": Number(questions[index].correctAnswer), "type": questions[index].type, "index": index, "trigger": key + 50}});
};

const handleCreateQuiz = async () => {
Expand All @@ -110,7 +110,6 @@ const QuizCreationQuestionList = () => {

const formattedTags = [{"name": quizDetails["level"]}];

console.log(formattedTags);

return {
quiz: {
Expand All @@ -126,14 +125,13 @@ const QuizCreationQuestionList = () => {
choice2: q.answers[1],
choice3: q.answers[2],
choice4: q.answers[3],
correct_choice: q.answers.indexOf(q.correctAnswer) + 1,
correct_choice: Number(q.correctAnswer) + 1,
})),
};
};

const createQuiz = async () => {
const quizData = prepareQuizData();
console.log('Quiz data:', quizData);
if (!quizData) return; // Ensure data is prepared

try {
Expand All @@ -151,7 +149,6 @@ const QuizCreationQuestionList = () => {
alert('Failed to create quiz. Please try again.');
} else {
const result = await response.json();
console.log('Quiz created successfully:', result);
alert('Quiz created successfully!');
await clearQuizDetails();
await clearQuestions();
Expand Down
38 changes: 19 additions & 19 deletions mobile/bulingo/app/(tabs)/quizzes/quizDetails.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -65,24 +65,26 @@ const QuizDetails = () => {


const data = await response.json();

if (response.ok) {
const formattedQuizDetails = {
id: data.id,
title: data.title,
description: data.description,
author: data.author.username,
tags: data.tags,
level: data.level,
question_count: data.question_count,
created_at: data.created_at,
times_taken: data.times_taken,
like_count: data.like_count,
average_score: data.average_score,
is_bookmarked: data.is_bookmarked,
is_liked: data.is_liked,
id: data.quiz.id,
title: data.quiz.title,
description: data.quiz.description,
author: data.quiz.author.username,
tags: data.quiz.tags,
level: data.quiz.level,
question_count: data.quiz.question_count,
created_at: data.quiz.created_at,
times_taken: data.quiz.times_taken,
like_count: data.quiz.like_count,
average_score: data.quiz.average_score,
is_bookmarked: data.quiz.is_bookmarked,
is_liked: data.quiz.is_liked,
is_solved: data.is_solved,
quiz_result_id: data.quiz_result_id, // This could be null
};

setQuizDetails(formattedQuizDetails);
setError(null);
} else {
Expand Down Expand Up @@ -128,11 +130,10 @@ const QuizDetails = () => {
<View style={[styles.elevation, styles.quizDetailsBox]}>
<Text style={styles.quizTitle}>{quizDetails.title}</Text>
<Text style={styles.quizDescription}>
Stats {'\n'}
Times Taken: {quizDetails.times_taken || 0} {'\n'}
Number of Questions: {quizDetails.question_count || 0} {'\n'}
Average Score: {quizDetails.average_score || 'N/A'} {'\n'}
Tags: {quizDetails.level || 'N/A'}
Level: {quizDetails.level || 'N/A'}
</Text>

{/* Bookmark button in the bottom right corner */}
Expand All @@ -143,8 +144,7 @@ const QuizDetails = () => {

<View style={styles.buttonContainer}>
<Shadow distance={8} startColor="#00000020" endColor="#00000000" offset={[0, 4]}>
<TouchableOpacity style={styles.quizButton}
onPress={() => router.navigate('/(tabs)/quizzes/quizQuestion')}
<TouchableOpacity style={styles.quizButton} onPress={() => router.push({ pathname: '/(tabs)/quizzes/quizQuestion', params: { quizId: id } })}
>
<Text style={styles.buttonText}>Take Quiz</Text>
</TouchableOpacity>
Expand Down
Loading

0 comments on commit 690d7af

Please sign in to comment.