From 209f454b3aa1a0b80c5d2176f2f41173baa461fb Mon Sep 17 00:00:00 2001 From: rngsurrounded Date: Mon, 3 Mar 2025 19:43:04 +0900 Subject: [PATCH] solution status update --- .../components/SolutionHistorySheet/index.tsx | 20 +++- .../modules/TaskSolution/index.tsx | 109 +++++++++++++----- 2 files changed, 93 insertions(+), 36 deletions(-) diff --git a/services/frontend/src/pages/CompetitionSession/modules/TaskSolution/components/SolutionHistorySheet/index.tsx b/services/frontend/src/pages/CompetitionSession/modules/TaskSolution/components/SolutionHistorySheet/index.tsx index 4a21731..1abcabb 100644 --- a/services/frontend/src/pages/CompetitionSession/modules/TaskSolution/components/SolutionHistorySheet/index.tsx +++ b/services/frontend/src/pages/CompetitionSession/modules/TaskSolution/components/SolutionHistorySheet/index.tsx @@ -1,9 +1,9 @@ import React from 'react'; import { Sheet, SheetClose, SheetContent, SheetHeader, SheetTitle } from "@/components/ui/sheet"; import { Button } from "@/components/ui/button"; -import { X } from "lucide-react"; +import { X, Check } from "lucide-react"; import SolutionStatus from '../SolutionStatus'; -import { Solution, TaskType } from '@/shared/types/task'; +import { Solution } from '@/shared/types/task'; interface SolutionHistorySheetProps { isOpen: boolean; @@ -11,6 +11,7 @@ interface SolutionHistorySheetProps { solutions: Solution[]; maxPoints: number; onSolutionSelect: (solution: Solution) => void; + currentSolutionId?: string; } const SolutionHistorySheet: React.FC = ({ @@ -18,7 +19,8 @@ const SolutionHistorySheet: React.FC = ({ onOpenChange, solutions, maxPoints, - onSolutionSelect + onSolutionSelect, + currentSolutionId }) => { return ( @@ -39,12 +41,18 @@ const SolutionHistorySheet: React.FC = ({ solutions.map((solution, index) => (
{ onSolutionSelect(solution); - onOpenChange(false); + onOpenChange(false); }} > + {solution.id === currentSolutionId && ( +
+ +
+ )}
)) @@ -59,4 +67,4 @@ const SolutionHistorySheet: React.FC = ({ ); }; -export default SolutionHistorySheet; +export default SolutionHistorySheet; \ No newline at end of file diff --git a/services/frontend/src/pages/CompetitionSession/modules/TaskSolution/index.tsx b/services/frontend/src/pages/CompetitionSession/modules/TaskSolution/index.tsx index 6c7899a..3d6352a 100644 --- a/services/frontend/src/pages/CompetitionSession/modules/TaskSolution/index.tsx +++ b/services/frontend/src/pages/CompetitionSession/modules/TaskSolution/index.tsx @@ -1,4 +1,4 @@ -import React, { useState, useRef } from 'react'; +import React, { useState, useRef, useEffect } from 'react'; import { useParams } from 'react-router-dom'; import { Task, TaskType, Solution } from '@/shared/types/task'; import { useQuery } from '@tanstack/react-query'; @@ -30,7 +30,9 @@ const TaskSolution: React.FC = ({ const fileInputRef = useRef(null); const [isHistoryOpen, setIsHistoryOpen] = useState(false); const [selectedSolutionUrl, setSelectedSolutionUrl] = useState(null); + const [displayedSolution, setDisplayedSolution] = useState(null); const { id: competitionId } = useParams<{ id: string }>(); + const prevTaskIdRef = useRef(null); const solutionsQuery = useQuery({ queryKey: ['solutionHistory', competitionId, task.id], @@ -40,44 +42,85 @@ const TaskSolution: React.FC = ({ const solutionHistory = solutionsQuery.data || []; + // Set initial solution to the last one (most recent) when solutions are loaded + useEffect(() => { + if (solutionHistory.length > 0 && !displayedSolution) { + const latestSolution = solutionHistory[solutionHistory.length - 1]; + setDisplayedSolution(latestSolution); + } + }, [solutionHistory, displayedSolution]); + + // When task changes, reset everything and load the latest solution for the new task + useEffect(() => { + if (prevTaskIdRef.current !== task.id) { + // Reset states for new task + setDisplayedSolution(null); + setSelectedSolutionUrl(null); + + // If solutions are already loaded for the new task, set the latest one + if (solutionHistory.length > 0) { + const latestSolution = solutionHistory[solutionHistory.length - 1]; + setDisplayedSolution(latestSolution); + } + + prevTaskIdRef.current = task.id; + } + }, [task.id, solutionHistory]); + + // Check if a new solution was submitted (latest solution ID changed) + useEffect(() => { + if (solutionHistory.length > 0 && displayedSolution) { + const latestSolution = solutionHistory[solutionHistory.length - 1]; + + // If the latest solution ID is different from the displayed one, + // a new solution was submitted - update to show the latest + if (latestSolution.id !== displayedSolution.id) { + setDisplayedSolution(latestSolution); + } + } + }, [solutionHistory, displayedSolution]); + + // Load solution content when the displayed solution changes + useEffect(() => { + const loadSolutionContent = async () => { + if (!displayedSolution || !displayedSolution.content) return; + + try { + if (task.type === TaskType.FILE) { + setSelectedFile(null); + setSelectedSolutionUrl(displayedSolution.content); + } else { + const response = await fetch(displayedSolution.content); + if (!response.ok) { + throw new Error(`Failed to fetch solution content: ${response.status}`); + } + const text = await response.text(); + setAnswer(text); + } + } catch (error) { + console.error('Error loading solution content:', error); + } + }; + + loadSolutionContent(); + }, [displayedSolution, task.type, setAnswer, setSelectedFile]); + const handleOpenHistory = () => { setIsHistoryOpen(true); }; - const latestSolution = solutionHistory && solutionHistory.length > 0 ? solutionHistory[0] : null; - - const handleSolutionSelect = async (solution: Solution) => { - if (!solution.content) return; - - try { - if (task.type === TaskType.FILE) { - // For file tasks, just store the URL - setSelectedFile(null); // Clear any selected file first - setSelectedSolutionUrl(solution.content); - } else { - // For INPUT and CODE tasks, fetch the content and set as answer - const response = await fetch(solution.content); - if (!response.ok) { - throw new Error(`Failed to fetch solution content: ${response.status}`); - } - const text = await response.text(); - setAnswer(text); - } - } catch (error) { - console.error('Error loading solution content:', error); - } + const handleSolutionSelect = (solution: Solution) => { + setDisplayedSolution(solution); }; - // Function to clear the existing file URL const handleClearExistingFile = () => { setSelectedSolutionUrl(null); }; - return (
- {latestSolution ? ( - + {displayedSolution ? ( + ) : (
Решение еще не отправлено @@ -85,7 +128,10 @@ const TaskSolution: React.FC = ({ )} {task.type === TaskType.INPUT && ( - + )} {task.type === TaskType.FILE && ( @@ -99,7 +145,10 @@ const TaskSolution: React.FC = ({ )} {task.type === TaskType.CODE && ( - + )} = ({ ); }; -export default TaskSolution; +export default TaskSolution; \ No newline at end of file