76 lines
2.0 KiB
TypeScript
76 lines
2.0 KiB
TypeScript
|
import { Box, IconButton, Typography, useTheme } from "@mui/material";
|
|||
|
|
|
|||
|
|
import { sendAnswer } from "@api/quizRelase";
|
|||
|
|
import { useQuizData } from "@contexts/QuizDataContext";
|
|||
|
|
import { useQuizViewStore } from "@stores/quizView";
|
|||
|
|
|
|||
|
|
import CloseBold from "@icons/CloseBold";
|
|||
|
|
|
|||
|
|
import type { QuizQuestionFile } from "@model/questionTypes/file";
|
|||
|
|
|
|||
|
|
type UploadedFileProps = {
|
|||
|
|
currentQuestion: QuizQuestionFile;
|
|||
|
|
setIsSending: (isSending: boolean) => void;
|
|||
|
|
};
|
|||
|
|
|
|||
|
|
export const UploadedFile = ({
|
|||
|
|
currentQuestion,
|
|||
|
|
setIsSending,
|
|||
|
|
}: UploadedFileProps) => {
|
|||
|
|
const { quizId, preview } = useQuizData();
|
|||
|
|
const answers = useQuizViewStore((state) => state.answers);
|
|||
|
|
const { updateAnswer } = useQuizViewStore((state) => state);
|
|||
|
|
const theme = useTheme();
|
|||
|
|
|
|||
|
|
const answer = answers.find(
|
|||
|
|
({ questionId }) => questionId === currentQuestion.id
|
|||
|
|
)?.answer as string;
|
|||
|
|
|
|||
|
|
const deleteFile = async () => {
|
|||
|
|
if (answer.length > 0) {
|
|||
|
|
setIsSending(true);
|
|||
|
|
|
|||
|
|
await sendAnswer({
|
|||
|
|
questionId: currentQuestion.id,
|
|||
|
|
body: "",
|
|||
|
|
qid: quizId,
|
|||
|
|
preview,
|
|||
|
|
});
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
updateAnswer(currentQuestion.id, "", 0);
|
|||
|
|
setIsSending(false);
|
|||
|
|
};
|
|||
|
|
|
|||
|
|
return (
|
|||
|
|
<Box sx={{ display: "flex", alignItems: "center", gap: "15px" }}>
|
|||
|
|
<Typography color={theme.palette.text.primary}>Вы загрузили:</Typography>
|
|||
|
|
<Box
|
|||
|
|
sx={{
|
|||
|
|
padding: "5px 5px 5px 16px",
|
|||
|
|
backgroundColor: theme.palette.primary.main,
|
|||
|
|
borderRadius: "8px",
|
|||
|
|
color: "#FFFFFF",
|
|||
|
|
display: "flex",
|
|||
|
|
alignItems: "center",
|
|||
|
|
overflow: "hidden",
|
|||
|
|
gap: "15px",
|
|||
|
|
}}
|
|||
|
|
>
|
|||
|
|
<Typography
|
|||
|
|
sx={{
|
|||
|
|
whiteSpace: "nowrap",
|
|||
|
|
textOverflow: "ellipsis",
|
|||
|
|
overflow: "hidden",
|
|||
|
|
}}
|
|||
|
|
>
|
|||
|
|
{answer?.split("|")[0]}
|
|||
|
|
</Typography>
|
|||
|
|
<IconButton sx={{ p: 0 }} onClick={deleteFile}>
|
|||
|
|
<CloseBold />
|
|||
|
|
</IconButton>
|
|||
|
|
</Box>
|
|||
|
|
</Box>
|
|||
|
|
);
|
|||
|
|
};
|