This commit is contained in:
rngsurrounded
2025-03-03 18:56:01 +09:00
parent 48de4f676f
commit ae04e453f6
2 changed files with 41 additions and 93 deletions
@@ -1,4 +1,4 @@
import React, { useState, useRef, useEffect } from 'react';
import React, { useState, useRef } from 'react';
import { useParams } from 'react-router-dom';
import { Task, TaskType, Solution } from '@/shared/types/task';
import { useQuery } from '@tanstack/react-query';
@@ -30,9 +30,7 @@ const TaskSolution: React.FC<TaskSolutionProps> = ({
const fileInputRef = useRef<HTMLInputElement>(null);
const [isHistoryOpen, setIsHistoryOpen] = useState(false);
const [selectedSolutionUrl, setSelectedSolutionUrl] = useState<string | null>(null);
const [currentSolution, setCurrentSolution] = useState<Solution | null>(null);
const { id: competitionId } = useParams<{ id: string }>();
const taskIdRef = useRef<string | null>(null);
const solutionsQuery = useQuery({
queryKey: ['solutionHistory', competitionId, task.id],
@@ -41,83 +39,45 @@ const TaskSolution: React.FC<TaskSolutionProps> = ({
});
const solutionHistory = solutionsQuery.data || [];
// Handle task changes
useEffect(() => {
if (taskIdRef.current !== task.id) {
setCurrentSolution(null);
setSelectedSolutionUrl(null);
setAnswer("");
setSelectedFile(null);
taskIdRef.current = task.id;
// Wait for the query to complete
if (!solutionsQuery.isLoading && solutionHistory.length > 0) {
// Get the most recent solution (last in the array)
const latestSolution = solutionHistory[solutionHistory.length - 1];
setCurrentSolution(latestSolution);
}
}
}, [task.id, solutionHistory, solutionsQuery.isLoading, setAnswer, setSelectedFile]);
// Refresh current solution when the solution history changes (after a new submission)
useEffect(() => {
if (!solutionsQuery.isLoading && solutionHistory.length > 0) {
// If we don't have a current solution or there's a new submission
// (which would be the last item in the array)
if (!currentSolution ||
currentSolution.id !== solutionHistory[solutionHistory.length - 1].id) {
// Set to the latest solution (last in the array)
setCurrentSolution(solutionHistory[solutionHistory.length - 1]);
}
}
}, [solutionHistory, currentSolution, solutionsQuery.isLoading]);
// Load solution content when current solution changes
useEffect(() => {
const loadSolutionContent = async () => {
if (!currentSolution || !currentSolution.content) return;
try {
if (task.type === TaskType.FILE) {
setSelectedFile(null);
setSelectedSolutionUrl(currentSolution.content);
} else {
const response = await fetch(currentSolution.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();
}, [currentSolution, task.type, setAnswer, setSelectedFile]);
const handleOpenHistory = () => {
setIsHistoryOpen(true);
};
const handleSolutionSelect = (solution: Solution) => {
setCurrentSolution(solution);
setIsHistoryOpen(false);
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);
}
};
// Function to clear the existing file URL
const handleClearExistingFile = () => {
setSelectedSolutionUrl(null);
};
const handleSubmitWrapper = () => {
onSubmit();
};
return (
<div className="md:w-[500px] flex flex-col gap-4">
{currentSolution ? (
<SolutionStatus solution={currentSolution} maxPoints={task.points}/>
{latestSolution ? (
<SolutionStatus solution={latestSolution} maxPoints={task.points}/>
) : (
<div className="bg-gray-100 rounded-lg p-4 text-gray-600 font-hse-sans">
Решение еще не отправлено
@@ -125,10 +85,7 @@ const TaskSolution: React.FC<TaskSolutionProps> = ({
)}
{task.type === TaskType.INPUT && (
<InputSolution
answer={answer}
setAnswer={setAnswer}
/>
<InputSolution answer={answer} setAnswer={setAnswer} />
)}
{task.type === TaskType.FILE && (
@@ -142,14 +99,11 @@ const TaskSolution: React.FC<TaskSolutionProps> = ({
)}
{task.type === TaskType.CODE && (
<CodeSolution
answer={answer}
setAnswer={setAnswer}
/>
<CodeSolution answer={answer} setAnswer={setAnswer} />
)}
<ActionButtons
onSubmit={handleSubmitWrapper}
onSubmit={onSubmit}
onHistoryClick={handleOpenHistory}
/>
@@ -159,10 +113,9 @@ const TaskSolution: React.FC<TaskSolutionProps> = ({
solutions={solutionHistory}
maxPoints={task.points}
onSolutionSelect={handleSolutionSelect}
currentSolutionId={currentSolution?.id}
/>
</div>
);
};
export default TaskSolution;
export default TaskSolution;