Merge branch 'master' of gitlab.prodcontest.ru:team-15/project

This commit is contained in:
ITQ
2025-03-03 18:30:23 +03:00
3 changed files with 53 additions and 20 deletions
@@ -1,5 +1,5 @@
import { useState } from "react"; import { useState, useEffect } from "react";
import { useParams, Navigate } from "react-router-dom"; import { useParams, Navigate, useNavigate } from "react-router-dom";
import CompetitionHeader from "./components/CompetitionHeader"; import CompetitionHeader from "./components/CompetitionHeader";
import TaskContent from "./components/TaskContent"; import TaskContent from "./components/TaskContent";
import TaskSolution from "./modules/TaskSolution"; import TaskSolution from "./modules/TaskSolution";
@@ -13,8 +13,10 @@ const CompetitionSession = () => {
const { id, taskId } = useParams<{ id: string; taskId?: string }>(); const { id, taskId } = useParams<{ id: string; taskId?: string }>();
const [answer, setAnswer] = useState(""); const [answer, setAnswer] = useState("");
const [selectedFile, setSelectedFile] = useState<File | null>(null); const [selectedFile, setSelectedFile] = useState<File | null>(null);
const [submissionSuccess, setSubmissionSuccess] = useState(false);
const competitionId = id || ""; const competitionId = id || "";
const queryClient = useQueryClient(); const queryClient = useQueryClient();
const navigate = useNavigate();
const competitionQuery = useQuery({ const competitionQuery = useQuery({
queryKey: ["competition", competitionId], queryKey: ["competition", competitionId],
@@ -45,14 +47,37 @@ const CompetitionSession = () => {
queryKey: ['solutionHistory', competitionId, taskId] queryKey: ['solutionHistory', competitionId, taskId]
}); });
setAnswer(""); setSubmissionSuccess(true); // Set flag to trigger the timeout
setSelectedFile(null);
}, },
onError: (error) => { onError: (error) => {
console.error("Error submitting solution:", error); console.error("Error submitting solution:", error);
} }
}); });
// Effect to handle the page reload after successful submission
useEffect(() => {
let timeoutId: number;
if (submissionSuccess) {
timeoutId = window.setTimeout(() => {
// Reload the current page
window.location.reload();
// Alternative: Use React Router's navigate to refresh
// navigate(`/competition/${competitionId}/tasks/${taskId}`, { replace: true });
setSubmissionSuccess(false);
}, 5000); // 5 seconds timeout
}
// Clean up timeout when component unmounts or when submissionSuccess changes
return () => {
if (timeoutId) {
window.clearTimeout(timeoutId);
}
};
}, [submissionSuccess, competitionId, taskId, navigate]);
const competition = competitionQuery.data; const competition = competitionQuery.data;
const tasks = tasksQuery.data || []; const tasks = tasksQuery.data || [];
const isLoading = tasksQuery.isLoading || competitionQuery.isLoading; const isLoading = tasksQuery.isLoading || competitionQuery.isLoading;
@@ -125,6 +150,16 @@ const CompetitionSession = () => {
onSubmit={handleSubmit} onSubmit={handleSubmit}
isSubmitting={submitMutation.isPending} isSubmitting={submitMutation.isPending}
/> />
{submissionSuccess && (
<div className="fixed inset-0 flex items-center justify-center bg-black bg-opacity-50 z-50">
<div className="bg-white p-6 rounded-lg shadow-xl text-center">
<Loader2 className="h-8 w-8 animate-spin text-blue-500 mx-auto mb-4" />
<p className="font-hse-sans text-gray-700">
Решение отправлено! Страница обновится через несколько секунд...
</p>
</div>
</div>
)}
</div> </div>
) : ( ) : (
<div className="flex h-40 items-center justify-center rounded-lg bg-white"> <div className="flex h-40 items-center justify-center rounded-lg bg-white">
@@ -70,14 +70,6 @@ const TaskSolution: React.FC<TaskSolutionProps> = ({
} }
}, [task.id, solutionHistory]); }, [task.id, solutionHistory]);
// useEffect(() => {
// if (solutionHistory.length > 0 &&
// (!displayedSolution ||
// (solutionHistory[solutionHistory.length - 1].id !== displayedSolution.id))) {
// setDisplayedSolution(solutionHistory[solutionHistory.length - 1]);
// }
// }, [solutionHistory, displayedSolution]);
useEffect(() => { useEffect(() => {
const loadSolutionContent = async () => { const loadSolutionContent = async () => {
if (!displayedSolution || !displayedSolution.content) return; if (!displayedSolution || !displayedSolution.content) return;
@@ -122,9 +114,6 @@ const TaskSolution: React.FC<TaskSolutionProps> = ({
<div className="md:w-[500px] flex flex-col gap-4"> <div className="md:w-[500px] flex flex-col gap-4">
{displayedSolution ? ( {displayedSolution ? (
<> <>
<div className="bg-gray-100 rounded-lg p-4 text-gray-600 font-hse-sans">
Результат последней посылки:
</div>
<SolutionStatus key={displayedSolution.id} solution={displayedSolution} maxPoints={task.points}/> <SolutionStatus key={displayedSolution.id} solution={displayedSolution} maxPoints={task.points}/>
</> </>
) : ( ) : (
@@ -1,13 +1,22 @@
import { buttonVariants } from "@/components/ui/button"; import { buttonVariants } from "@/components/ui/button";
import { DataRushReview } from "@/components/ui/icons/datarush-review"; import { DataRushReview } from "@/components/ui/icons/datarush-review";
import { Reviewer } from "@/shared/types/review"; import { Reviewer } from "@/shared/types/review";
import { Link } from "react-router"; import { useUserStore } from "@/shared/stores/user";
import { useNavigate } from "react-router-dom";
interface ReviewHeaderProps { interface ReviewHeaderProps {
reviewer: Reviewer; reviewer: Reviewer;
} }
export const ReviewHeader = ({ reviewer }: ReviewHeaderProps) => { export const ReviewHeader = ({ reviewer }: ReviewHeaderProps) => {
const clearUser = useUserStore((state) => state.clearUser);
const navigate = useNavigate();
const handleLogout = () => {
clearUser();
navigate("/");
};
return ( return (
<header className="flex h-[90px] items-center justify-between gap-4"> <header className="flex h-[90px] items-center justify-between gap-4">
<DataRushReview /> <DataRushReview />
@@ -15,12 +24,12 @@ export const ReviewHeader = ({ reviewer }: ReviewHeaderProps) => {
<p className="text-right font-semibold"> <p className="text-right font-semibold">
{reviewer.name} {reviewer.surname} {reviewer.name} {reviewer.surname}
</p> </p>
<Link <button
to="/" onClick={handleLogout}
className={buttonVariants({ size: "sm", variant: "secondary" })} className={buttonVariants({ size: "sm", variant: "secondary" })}
> >
Выйти Выйти
</Link> </button>
</div> </div>
</header> </header>
); );