103 lines
3.0 KiB
TypeScript
103 lines
3.0 KiB
TypeScript
"use client";
|
|
import { Queries } from "@/api/queries";
|
|
import QuizHeader from "@/components/quiz/QuizHeader";
|
|
import QuizResultsSearch from "@/components/quiz/QuizResultsSearch";
|
|
import QuizResultsTabs from "@/components/quiz/QuizResultsTabs";
|
|
import QuizTapgyrResults from "@/components/quiz/QuizTapgyrResults";
|
|
import QuizTapgyrWinners from "@/components/quiz/QuizTapgyrWinners";
|
|
import { Data } from "@/models/quizQuestions.model";
|
|
import { useQuizResults } from "@/store/store";
|
|
import { notFound } from "next/navigation";
|
|
import React, { useEffect, useState } from "react";
|
|
|
|
interface IParams {
|
|
params: {
|
|
quiz_id: string;
|
|
};
|
|
}
|
|
|
|
const Page = ({ params }: IParams) => {
|
|
const [data, setData] = useState<Data>();
|
|
const [tab, setTab] = useState<number | string>(0);
|
|
const [loading, setLoading] = useState<boolean>(false);
|
|
const { resultData, error } = useQuizResults();
|
|
|
|
useEffect(() => {
|
|
const local_info = sessionStorage.getItem("TURKMENTV_QUIZ_RESULTS");
|
|
if (!resultData.length && !error) {
|
|
setLoading(true);
|
|
Queries.getQuizById(params.quiz_id)
|
|
.then((res) => {
|
|
setData(res.data);
|
|
if (res.data.steps?.length) {
|
|
if (local_info) {
|
|
if (
|
|
JSON.parse(local_info)?.tab &&
|
|
JSON.parse(local_info)?.uuid === res.data.uuid
|
|
) {
|
|
setTab(JSON.parse(local_info)?.tab);
|
|
} else {
|
|
setTab(res.data?.steps[res.data?.steps.length - 1].tapgyr - 1);
|
|
}
|
|
} else {
|
|
setTab(res.data?.steps[res.data?.steps.length - 1].tapgyr - 1);
|
|
}
|
|
}
|
|
setLoading(false);
|
|
})
|
|
.catch(() => {
|
|
setLoading(false);
|
|
notFound();
|
|
});
|
|
}
|
|
}, [resultData, error]);
|
|
|
|
useEffect(() => {
|
|
if (data) {
|
|
sessionStorage.setItem(
|
|
"TURKMENTV_QUIZ_RESULTS",
|
|
JSON.stringify({
|
|
uuid: data?.uuid,
|
|
tab: tab,
|
|
})
|
|
);
|
|
}
|
|
}, [data, tab]);
|
|
|
|
return (
|
|
<section className="container py-[40px]">
|
|
<div className="flex flex-col w-full py-[40px] gap-[80px]">
|
|
<QuizHeader data={data} />
|
|
<QuizResultsSearch id={params.quiz_id} />
|
|
<QuizResultsTabs
|
|
steps={data?.steps ? data?.steps : []}
|
|
tab={tab}
|
|
setStep={setTab}
|
|
loading={loading}
|
|
/>
|
|
{tab === "results" && (
|
|
<QuizTapgyrResults
|
|
id={params.quiz_id}
|
|
steps={
|
|
data?.steps ? data?.steps?.map((item) => String(item.tapgyr)) : []
|
|
}
|
|
/>
|
|
)}
|
|
{data?.has_steps &&
|
|
data.steps &&
|
|
data.steps?.length > 0 &&
|
|
tab !== "results" && (
|
|
<QuizTapgyrWinners
|
|
key={data.steps[Number(tab)].tapgyr}
|
|
id={params.quiz_id}
|
|
tapgyr={data.steps[Number(tab)].tapgyr}
|
|
questions={data.steps[Number(tab)].questions}
|
|
/>
|
|
)}
|
|
</div>
|
|
</section>
|
|
);
|
|
};
|
|
|
|
export default Page;
|