Skip to content

Commit f72e8ec

Browse files
eduardconstantineduardconstantin
authored
Merge pull request eduardconstantin#112 from eduardconstantin/fix/practice-quiz
Fix/practice quiz
2 parents 1a44a09 + ef8fbed commit f72e8ec

File tree

7 files changed

+16
-15
lines changed

7 files changed

+16
-15
lines changed

‎app/exam/page.tsx‎

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -92,7 +92,7 @@ const Exam: NextPage<{ searchParams: { url: string; name: string } }> = ({
9292
const numberOfQuestions = data.randomQuestions.length || 0;
9393

9494
return (
95-
<div className="py-10 px-5 mx-auto w-5/6 sm:w-1/2 bg-slate-800 border-2 border-slate-700 rounded-lg">
95+
<div className="py-10 px-5 mb-6 mx-auto w-5/6 sm:w-1/2 bg-slate-800 border-2 border-slate-700 rounded-lg">
9696
<div>
9797
<div className="px-2 sm:px-10 w-full flex flex-row justify-between items-center">
9898
<p className="text-white font-bold text-sm sm:text-2xl">

‎app/layout.tsx‎

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -24,7 +24,7 @@ export default function RootLayout({ children }: RootLayoutProps) {
2424
<body className="bg-slate-900">
2525
<ApolloProvider>
2626
<TopNav />
27-
<main className="flex flex-col justify-between md:h-[calc(100vh-2.5rem-64px)]">
27+
<main className="flex flex-col justify-between md:h-[calc(100vh-2.5rem-64px)] h-full">
2828
{children}
2929
<Footer />
3030
<Cookie />

‎app/modes/layout.tsx‎

Lines changed: 1 addition & 5 deletions
Original file line numberDiff line numberDiff line change
@@ -14,9 +14,5 @@ type ModesLayoutProps = {
1414
};
1515

1616
export default function ModesLayout({ children }: ModesLayoutProps) {
17-
return (
18-
<main className="flex flex-col justify-between h-[calc(100vh-2.5rem-64px)]">
19-
{children}
20-
</main>
21-
);
17+
return <>{children}</>;
2218
}

‎app/modes/page.tsx‎

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -7,8 +7,8 @@ const Modes: NextPage<{ searchParams: { url: string; name: string } }> = ({
77
const { url, name } = searchParams;
88

99
return (
10-
<div className="mx-auto w-5/6 sm:w-2/3 lg:w-2/3 xl:w-2/4 text-center">
11-
<h2 className="text-white text-4xl text-leading font-bold uppercase mt-14">
10+
<div className="mx-auto mb-6 w-5/6 sm:w-2/3 lg:w-2/3 xl:w-2/4 text-center">
11+
<h2 className="text-white text-4xl text-leading font-bold uppercase md:mt-14">
1212
{name}
1313
</h2>
1414
<p className="text-white text-lg mt-4 mb-14 px-5 leading-6">

‎app/page.tsx‎

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -4,8 +4,8 @@ import exams from "@azure-fundamentals/lib/exams.json";
44

55
const Home: NextPage = () => {
66
return (
7-
<div className="mx-auto w-5/6 sm:w-2/3 lg:w-2/3 xl:w-2/4 text-center">
8-
<h2 className="text-white text-5xl text-leading font-bold uppercase mt-14">
7+
<div className="mx-auto mb-6 w-5/6 sm:w-2/3 lg:w-2/3 xl:w-2/4 text-center">
8+
<h2 className="text-white text-5xl text-leading font-bold uppercase md:mt-14">
99
Welcome!
1010
</h2>
1111
<p className="text-white text-lg mt-4 mb-14 px-5 leading-6">

‎app/practice/page.tsx‎

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -58,7 +58,7 @@ const Practice: NextPage<{ searchParams: { url: string; name: string } }> = ({
5858
if (questionsError) return <p>Oh no... {questionsError.message}</p>;
5959

6060
return (
61-
<div className="py-10 px-5 sm:p-10 mx-auto w-5/6 sm:w-1/2 bg-slate-800 border-2 border-slate-700 rounded-lg">
61+
<div className="py-10 px-5 mb-6 sm:p-10 mx-auto w-5/6 sm:w-1/2 bg-slate-800 border-2 border-slate-700 rounded-lg">
6262
<QuizForm
6363
isLoading={loading || questionsLoading}
6464
questionSet={data?.questionById}

‎components/QuizForm.tsx‎

Lines changed: 8 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -1,4 +1,4 @@
1-
import { FC, useState } from "react";
1+
import { type FC, useState } from "react";
22
import { useForm, FieldValues } from "react-hook-form";
33
import { Question } from "./types";
44
import Image from "next/image";
@@ -22,7 +22,7 @@ const QuizForm: FC<Props> = ({
2222
totalQuestions,
2323
link,
2424
}) => {
25-
const { register, handleSubmit, reset } = useForm();
25+
const { register, handleSubmit, reset, watch } = useForm();
2626
const [showCorrectAnswer, setShowCorrectAnswer] = useState<boolean>(false);
2727
const [lastIndex, setLastIndex] = useState<number>(1);
2828
const [canGoBack, setCanGoBack] = useState<boolean>(false);
@@ -55,6 +55,7 @@ const QuizForm: FC<Props> = ({
5555

5656
if (isLoading) return <p>Loading...</p>;
5757
const { question, options, images } = questionSet!;
58+
const watchInput = watch(`options.${currentQuestionIndex}`);
5859

5960
const noOfAnswers = options.filter((el) => el.isAnswer === true).length;
6061
return (
@@ -144,7 +145,7 @@ const QuizForm: FC<Props> = ({
144145
</svg>
145146
</button>
146147
</div>
147-
<p className="text-white px-12 pt-10 pb-5 select-none">{question}</p>
148+
<p className="text-white md:px-12 pt-10 pb-5 select-none">{question}</p>
148149
{images.length !== 0 && (
149150
<ul className="flex flex-row justify-center gap-2 mt-5 mb-8 select-none md:px-12 px-0">
150151
{images.map((image) => (
@@ -213,6 +214,10 @@ const QuizForm: FC<Props> = ({
213214
disabled={currentQuestionIndex < lastIndex}
214215
onClick={() => {
215216
setShowCorrectAnswer(false);
217+
setSavedAnswers((prev) => ({
218+
...prev,
219+
[currentQuestionIndex]: watchInput,
220+
}));
216221
if (currentQuestionIndex === totalQuestions) {
217222
handleNextQuestion(1);
218223
setLastIndex(1);

0 commit comments

Comments
 (0)