70 lines
3.0 KiB
TypeScript
Executable File
70 lines
3.0 KiB
TypeScript
Executable File
import { Box, Button } from "@mui/material";
|
||
import CreationCard from "@ui_kit/CreationCard";
|
||
import quizCreationImage1 from "../../assets/quiz-creation-1.png";
|
||
import quizCreationImage2 from "../../assets/quiz-creation-2.png";
|
||
import { setQuizType } from "@root/quizes/actions";
|
||
import { useCurrentQuiz } from "@root/quizes/hooks";
|
||
|
||
|
||
export default function StepOne() {
|
||
const quiz = useCurrentQuiz();
|
||
const config = quiz?.config;
|
||
|
||
if (!config) return null; // TODO throw and catch with error boundary
|
||
|
||
return (
|
||
<Box
|
||
sx={{
|
||
overflowX: "scroll",
|
||
padding: "0 5px 15px",
|
||
"&::-webkit-scrollbar": { width: 0 },
|
||
}}
|
||
>
|
||
<Box
|
||
sx={{
|
||
minWidth: "720px",
|
||
display: "flex",
|
||
gap: "20px",
|
||
mt: "60px",
|
||
}}
|
||
>
|
||
<Button
|
||
variant="text"
|
||
data-cy="create-quiz-card"
|
||
onClick={() => {
|
||
setQuizType(quiz.id, "quiz");
|
||
}}
|
||
>
|
||
<CreationCard
|
||
header="Создание квиз-опроса"
|
||
text="У стартовой страницы одна ключевая задача - заинтересовать посетителя пройти квиз. С ней сложно ошибиться, сформулируйте суть предложения и подберите живую фотографию, остальное мы сделаем за вас"
|
||
image={quizCreationImage1}
|
||
border={
|
||
config.type === "quiz"
|
||
? "1px solid #7E2AEA"
|
||
: "none"
|
||
}
|
||
/>
|
||
</Button>
|
||
<Button
|
||
variant="text"
|
||
onClick={() => {
|
||
setQuizType(quiz.id, "form");
|
||
}}
|
||
>
|
||
<CreationCard
|
||
header="Создание анкеты"
|
||
text="У стартовой страницы одна ключевая задача - заинтересовать посетителя пройти квиз. С ней сложно ошибиться, сформулируйте суть предложения и подберите живую фотографию, остальное мы сделаем за вас"
|
||
image={quizCreationImage2}
|
||
border={
|
||
config.type === "form"
|
||
? "1px solid #7E2AEA"
|
||
: "none"
|
||
}
|
||
/>
|
||
</Button>
|
||
</Box>
|
||
</Box>
|
||
);
|
||
}
|