frontPanel/src/stores/quizes/actions.ts

import { quizApi } from "@api/quiz";
import { devlog, getMessageFromFetchError } from "@frontend/kitui";
import { EditQuizResponse, quizToEditQuizRequest } from "@model/quiz/edit";
import { Quiz, RawQuiz, rawQuizToQuiz } from "@model/quiz/quiz";
import { QuizConfig, QuizSetupStep, maxQuizSetupSteps } from "@model/quizSettings";
import { createQuestion } from "@root/questions/actions";
import { produce } from "immer";
import { enqueueSnackbar } from "notistack";
import { NavigateFunction } from "react-router-dom";
import { isAxiosCanceledError } from "../../utils/isAxiosCanceledError";
import { RequestQueue } from "../../utils/requestQueue";
import { QuizStore, useQuizStore } from "./store";


export const setEditQuizId = (quizId: number | null) => setProducedState(state => {
    state.editQuizId = quizId;
}, {
    type: "setEditQuizId",
    quizId,
});

export const resetEditConfig = () => setProducedState(state => {
    state.editQuizId = null;
    state.currentStep = 1;
});

export const setQuizes = (quizes: RawQuiz[] | null) => setProducedState(state => {
    state.quizById = {};
    if (quizes === null) return;

    quizes.forEach(quiz => state.quizById[quiz.id] = rawQuizToQuiz(quiz));
}, {
    type: "setQuizes",
    quizes,
});

export const setQuiz = (quiz: Quiz) => setProducedState(state => {
    state.quizById[quiz.id] = quiz;
}, {
    type: "setQuiz",
    quiz,
});

export const removeQuiz = (quizId: number) => setProducedState(state => {
    delete state.quizById[quizId];
}, {
    type: "removeQuiz",
    quizId,
});

export const setQuizField = <T extends keyof Quiz>(
    quizId: number,
    field: T,
    value: Quiz[T],
) => setProducedState(state => {
    const quiz = state.quizById[quizId];
    if (!quiz) return;

    const oldId = quiz.id;
    quiz[field] = value;

    if (field === "id") {
        delete state.quizById[oldId];
        state.quizById[value as number] = quiz;
    }
}, {
    type: "setQuizField",
    quizId,
    field,
    value,
});

export const incrementCurrentStep = () => setProducedState(state => {
    state.currentStep = Math.min(
        maxQuizSetupSteps, state.currentStep + 1
    ) as QuizSetupStep;
}, {
    type: "incrementCurrentStep",
});

export const decrementCurrentStep = () => setProducedState(state => {
    state.currentStep = Math.max(
        1, state.currentStep - 1
    ) as QuizSetupStep;
}, {
    type: "decrementCurrentStep",
});

export const setCurrentStep = (step: number) => setProducedState(state => {
    state.currentStep = Math.max(0, Math.min(maxQuizSetupSteps, step)) as QuizSetupStep;
});

export const setQuizType = (
    quizId: number,
    quizType: QuizConfig["type"],
) => {
    updateQuizWithFnOptimistic(
        quizId,
        quiz => {
            quiz.config.type = quizType;
        },
    );
    incrementCurrentStep();
};

export const setQuizStartpageType = (
    quizId: number | null,
    startpageType: QuizConfig["startpageType"],
) => {
    updateQuizWithFnOptimistic(
        quizId,
        quiz => {
            quiz.config.startpageType = startpageType;
        },
    );
    incrementCurrentStep();
};

const REQUEST_DEBOUNCE = 1000;
const requestQueue = new RequestQueue<EditQuizResponse>();
let requestTimeoutId: ReturnType<typeof setTimeout>;

export const updateQuizWithFnOptimistic = async (
    quizId: number | null,
    updateFn: (quiz: Quiz) => void,
) => {
    if (!quizId) return;

    const quiz = useQuizStore.getState().quizById[quizId];
    if (!quiz) return;

    const updatedQuiz = produce(quiz, updateFn);
    setQuiz(updatedQuiz);

    clearTimeout(requestTimeoutId);
    requestTimeoutId = setTimeout(async () => {
        requestQueue.enqueue(async (prevResponse) => {
            const quizId = prevResponse?.updated ?? updatedQuiz.id;
            const response = await quizApi.edit(quizToEditQuizRequest(updatedQuiz, quizId));

            setQuizField(quizId, "id", response.updated);
            setEditQuizId(response.updated);

            return response;
        }).catch(error => {
            if (isAxiosCanceledError(error)) return;

            devlog("Error editing quiz", { error, quiz, updatedQuiz });
            enqueueSnackbar("Не удалось сохранить настройки квиза");
        });
    }, REQUEST_DEBOUNCE);
};

export const createQuiz = async (navigate: NavigateFunction) => {
    try {
        const quiz = await quizApi.create();

        setQuiz(rawQuizToQuiz(quiz));
        setEditQuizId(quiz.id);
        navigate("/edit");

        await createQuestion(quiz.id);
    } catch (error) {
        devlog("Error creating quiz", error);

        const message = getMessageFromFetchError(error) ?? "";
        enqueueSnackbar(`Не удалось создать квиз. ${message}`);
    }
};

export const deleteQuiz = async (quizId: number) => {
    try {
        await quizApi.delete(quizId);

        removeQuiz(quizId);
    } catch (error) {
        devlog("Error deleting quiz", error);

        const message = getMessageFromFetchError(error) ?? "";
        enqueueSnackbar(`Не удалось удалить квиз. ${message}`);
    }
};

function setProducedState<A extends string | { type: unknown; }>(
    recipe: (state: QuizStore) => void,
    action?: A,
) {
    useQuizStore.setState(state => produce(state, recipe), false, action);
}