diff --git a/src/App.tsx b/src/App.tsx
index 88333692..7b818cae 100644
--- a/src/App.tsx
+++ b/src/App.tsx
@@ -56,7 +56,7 @@ export default function App() {
{routeslink.map((e, i) => (
} />
))}
- } />
+ } />
} />
} />
} />
diff --git a/src/pages/createQuize/QuizCard.tsx b/src/pages/createQuize/QuizCard.tsx
index b25ffb40..7de6d989 100755
--- a/src/pages/createQuize/QuizCard.tsx
+++ b/src/pages/createQuize/QuizCard.tsx
@@ -11,7 +11,7 @@ import {
useMediaQuery,
useTheme,
} from "@mui/material";
-import { deleteQuiz } from "@root/quizes/actions";
+import { deleteQuiz, setEditQuizId } from "@root/quizes/actions";
import { useNavigate } from "react-router-dom";
@@ -33,7 +33,8 @@ export default function QuizCard({
const navigate = useNavigate();
function handleEditClick() {
- navigate(`/setting/${quiz.id}`);
+ setEditQuizId(quiz.id);
+ navigate("/settings");
}
return (
diff --git a/src/pages/startPage/stepOne.tsx b/src/pages/startPage/stepOne.tsx
index 4c7083d2..918a3961 100755
--- a/src/pages/startPage/stepOne.tsx
+++ b/src/pages/startPage/stepOne.tsx
@@ -1,6 +1,5 @@
import { Box, Button } from "@mui/material";
import CreationCard from "@ui_kit/CreationCard";
-import { useNavigate } from "react-router-dom";
import quizCreationImage1 from "../../assets/quiz-creation-1.png";
import quizCreationImage2 from "../../assets/quiz-creation-2.png";
import { setQuizType } from "@root/quizes/actions";
@@ -8,7 +7,6 @@ import { useCurrentQuiz } from "@root/quizes/hooks";
export default function StepOne() {
- const navigate = useNavigate();
const { quiz } = useCurrentQuiz();
const config = quiz?.config;
@@ -34,7 +32,7 @@ export default function StepOne() {
variant="text"
data-cy="create-quiz-card"
onClick={() => {
- setQuizType(quiz.id, "quiz", navigate);
+ setQuizType(quiz.id, "quiz");
}}
>
{
- setQuizType(quiz.id, "form", navigate);
+ setQuizType(quiz.id, "form");
}}
>
{
- setQuizStartpageType(quiz.id, "standard", navigate);
+ setQuizStartpageType(quiz.id, "standard");
}}
>
{
- setQuizStartpageType(quiz.id, "expanded", navigate);
+ setQuizStartpageType(quiz.id, "expanded");
}}
>
{
- setQuizStartpageType(quiz.id, "centered", navigate);
+ setQuizStartpageType(quiz.id, "centered");
}}
>
setProducedState(state => {
+ state.editQuizId = quizId;
+});
+
export const setQuizes = (quizes: RawQuiz[] | null) => setProducedState(state => {
state.quizById = {};
if (quizes === null) return;
@@ -98,7 +102,8 @@ export const createQuiz = async (navigate: NavigateFunction) => {
});
setQuiz(rawQuizToQuiz(quiz));
- navigate(`/setting/${quiz.id}`);
+ setEditQuizId(quiz.id);
+ navigate("/settings");
} catch (error) {
devlog("Error creating quiz", error);
@@ -123,29 +128,25 @@ export const deleteQuiz = async (quizId: number) => {
export const setQuizType = (
quizId: number,
quizType: QuizConfig["type"],
- navigate: NavigateFunction,
) => {
updateQuizWithFnOptimistic(
quizId,
quiz => {
quiz.config.type = quizType;
},
- navigate,
);
incrementCurrentStep();
};
export const setQuizStartpageType = (
- quizId: number | undefined,
+ quizId: number | null,
startpageType: QuizConfig["startpageType"],
- navigate: NavigateFunction,
) => {
updateQuizWithFnOptimistic(
quizId,
quiz => {
quiz.config.startpageType = startpageType;
},
- navigate,
);
incrementCurrentStep();
};
@@ -154,9 +155,8 @@ let savedOriginalQuiz: Quiz | null = null;
let controller: AbortController | null = null;
export const updateQuizWithFnOptimistic = async (
- quizId: number | undefined,
+ quizId: number | null,
updateFn: (quiz: Quiz) => void,
- navigate: NavigateFunction,
rollbackOnError = true,
) => {
if (!quizId) return;
@@ -176,7 +176,6 @@ export const updateQuizWithFnOptimistic = async (
// await new Promise((resolve, reject) => setTimeout(reject, 2000, new Error("Api rejected")));
setQuizField(quiz.id, "id", newId);
- navigate(`/setting/${newId}`, { replace: true });
controller = null;
savedOriginalQuiz = null;
diff --git a/src/stores/quizes/hooks.ts b/src/stores/quizes/hooks.ts
index b3b0b548..4a782de6 100644
--- a/src/stores/quizes/hooks.ts
+++ b/src/stores/quizes/hooks.ts
@@ -1,8 +1,7 @@
import { Quiz } from "@model/quiz/quiz";
-import { useNavigate, useParams } from "react-router-dom";
-import { useQuizStore } from "./store";
import { useCallback } from "react";
import { updateQuizWithFnOptimistic } from "./actions";
+import { useQuizStore } from "./store";
export function useQuizArray(): Quiz[] {
@@ -12,13 +11,12 @@ export function useQuizArray(): Quiz[] {
}
export function useCurrentQuiz() {
- const navigate = useNavigate();
- const quizId = parseInt(useParams().quizId ?? "");
- const quiz = useQuizStore(state => state.quizById[quizId]);
+ const quizId = useQuizStore(state => state.editQuizId);
+ const quiz = useQuizStore(state => state.quizById[quizId ?? -1]);
const updateQuiz = useCallback((updateFn: (quiz: Quiz) => void) => {
- updateQuizWithFnOptimistic(quizId, updateFn, navigate);
- }, [navigate, quizId]);
+ updateQuizWithFnOptimistic(quizId, updateFn);
+ }, [quizId]);
return { quiz, updateQuiz };
}
diff --git a/src/stores/quizes/store.ts b/src/stores/quizes/store.ts
index 07cd8aff..a641cb7f 100644
--- a/src/stores/quizes/store.ts
+++ b/src/stores/quizes/store.ts
@@ -6,11 +6,13 @@ import { devtools } from "zustand/middleware";
export type QuizStore = {
quizById: Record;
+ editQuizId: number | null;
currentStep: QuizSetupStep;
};
const initialState: QuizStore = {
quizById: {},
+ editQuizId: null,
currentStep: 1,
};