подправлена стартовая станица мобилки, автофокус на инпуте, отправка данных при быстром переходе к следующему вопросу

This commit is contained in:
Tamara 2024-02-21 02:28:34 +03:00
parent 3b7bc5dafc
commit 19d805d4ff
2 changed files with 20 additions and 5 deletions

@ -302,7 +302,7 @@ function QuizPreviewLayoutByType({
justifyContent: "space-between",
alignItems: "flex-start",
p: "25px",
height: "80%",
height: "100%",
overflowY: "auto",
overflowX: "hidden"
}}

@ -8,7 +8,7 @@ import { sendAnswer } from "@api/quizRelase";
import { useQuizData } from "@contexts/QuizDataContext";
import { useRootContainerSize } from "@contexts/RootContainerWidthContext";
import { enqueueSnackbar } from "notistack";
import { useState } from "react";
import {useEffect, useState} from "react";
import { useDebouncedCallback } from "use-debounce";
import type { QuizQuestionText } from "../../../model/questionTypes/text";
@ -68,6 +68,12 @@ export const Text = ({ currentQuestion, stepNumber }: TextProps) => {
setIsSending(false);
}, 400);
useEffect(
() => () => {
inputHC.flush();
},
[inputHC]
);
switch (spec) {
case true:
return <TextSpecial currentQuestion={currentQuestion} spec={true} answer={answer} inputHC={inputHC} stepNumber={stepNumber}/>;
@ -78,7 +84,15 @@ export const Text = ({ currentQuestion, stepNumber }: TextProps) => {
}
};
const TextNormal = ({currentQuestion, spec, answer, inputHC}) => {
interface Props {
currentQuestion: QuizQuestionText;
spec: boolean | undefined;
answer: any,
stepNumber: number | null;
inputHC: (string) => void;
}
const TextNormal = ({currentQuestion, spec, answer, inputHC, stepNumber}: Props) => {
const isMobile = useRootContainerSize() < 650;
const theme = useTheme();
return(
@ -94,6 +108,7 @@ const TextNormal = ({currentQuestion, spec, answer, inputHC}) => {
}}
>
<CustomTextField
autoFocus={true}
placeholder={currentQuestion.content.placeholder}
// @ts-ignore
value={answer || ""}
@ -122,11 +137,10 @@ const TextNormal = ({currentQuestion, spec, answer, inputHC}) => {
)
};
const TextSpecial = ({currentQuestion, spec, answer, inputHC, stepNumber}) => {
const TextSpecial = ({currentQuestion, spec, answer, inputHC, stepNumber}: Props) => {
const theme = useTheme();
const isMobile = useRootContainerSize() < 650;
const isHorizontal = Orientation[stepNumber -1].horizontal
console.log(stepNumber)
return(
<Box sx={{display: "flex", flexDirection: isMobile? "column" : undefined, alignItems: isMobile ? "center" : undefined,}}>
<Box
@ -151,6 +165,7 @@ const TextNormal = ({currentQuestion, spec, answer, inputHC}) => {
</Box>
)}
<TextField
autoFocus={true}
multiline
maxRows={4}
placeholder={currentQuestion.content.placeholder}