generated from muhtadeetaron/nextjs-template
fix(ui): refactor results page for exam results logic
This commit is contained in:
@ -1,22 +1,28 @@
|
||||
"use client";
|
||||
|
||||
import { create } from "zustand";
|
||||
import { Test, Answer } from "@/types/exam";
|
||||
import { Test, Answer, Question } from "@/types/exam";
|
||||
import { API_URL, getToken } from "@/lib/auth";
|
||||
import { ExamResult } from "@/types/exam";
|
||||
|
||||
// Result type (based on your API response)
|
||||
|
||||
interface ExamState {
|
||||
test: Test | null;
|
||||
answers: Answer[];
|
||||
result: ExamResult | null;
|
||||
|
||||
startExam: (testType: string, testId: string) => Promise<void>;
|
||||
startExam: (testType: string, testId: string) => Promise<Test | null>;
|
||||
setAnswer: (questionIndex: number, answer: Answer) => void;
|
||||
submitExam: (testType: string) => Promise<void>;
|
||||
submitExam: (testType: string) => Promise<ExamResult | null>;
|
||||
cancelExam: () => void;
|
||||
clearResult: () => void;
|
||||
}
|
||||
|
||||
export const useExamStore = create<ExamState>((set, get) => ({
|
||||
test: null,
|
||||
answers: [],
|
||||
result: null,
|
||||
|
||||
// start exam
|
||||
startExam: async (testType: string, testId: string) => {
|
||||
@ -35,9 +41,13 @@ export const useExamStore = create<ExamState>((set, get) => ({
|
||||
set({
|
||||
test: data,
|
||||
answers: Array(data.questions.length).fill(null),
|
||||
result: null, // clear old result
|
||||
});
|
||||
|
||||
return data;
|
||||
} catch (err) {
|
||||
console.error("startExam error:", err);
|
||||
return null;
|
||||
}
|
||||
},
|
||||
|
||||
@ -53,13 +63,12 @@ export const useExamStore = create<ExamState>((set, get) => ({
|
||||
// submit exam
|
||||
submitExam: async (testType: string) => {
|
||||
const { test, answers } = get();
|
||||
if (!test) return;
|
||||
if (!test) return null;
|
||||
|
||||
const token = await getToken();
|
||||
|
||||
try {
|
||||
const { test_id, attempt_id } = test.metadata;
|
||||
console.log(answers);
|
||||
const res = await fetch(
|
||||
`${API_URL}/tests/${testType}/${test_id}/${attempt_id}`,
|
||||
{
|
||||
@ -72,19 +81,26 @@ export const useExamStore = create<ExamState>((set, get) => ({
|
||||
}
|
||||
);
|
||||
|
||||
console.log(res);
|
||||
|
||||
if (!res.ok) throw new Error("Failed to submit exam");
|
||||
const result: ExamResult = await res.json();
|
||||
|
||||
// reset store
|
||||
set({ test: null, answers: [] });
|
||||
// save result, clear test+answers
|
||||
set({ test: null, answers: [], result });
|
||||
|
||||
return result;
|
||||
} catch (err) {
|
||||
console.error("Failed to submit exam. Reason:", err);
|
||||
return null;
|
||||
}
|
||||
},
|
||||
|
||||
// cancel exam
|
||||
cancelExam: () => {
|
||||
set({ test: null, answers: [] });
|
||||
set({ test: null, answers: [], result: null });
|
||||
},
|
||||
|
||||
// clear result manually (e.g., when leaving results page)
|
||||
clearResult: () => {
|
||||
set({ result: null });
|
||||
},
|
||||
}));
|
||||
|
||||
Reference in New Issue
Block a user