Enhance TaskWorkspace component to manage submission results more effectively. Introduce state for last submission result and update rendering logic to display either the current or last result. Refactor status display to ensure consistent feedback during task processing, improving user experience.
Some checks failed
platform/bro-js/challenge-pl/pipeline/head There was a failure building this commit

This commit is contained in:
2025-12-12 15:11:35 +03:00
parent 0965318bca
commit fb8da4ffd9

View File

@@ -1,4 +1,4 @@
import React, { useEffect } from 'react' import React, { useEffect, useState } from 'react'
import { import {
Box, Box,
Button, Button,
@@ -26,16 +26,31 @@ export const TaskWorkspace = ({ task, onTaskComplete }: TaskWorkspaceProps) => {
taskId: task.id, taskId: task.id,
}) })
// Сохраняем последний результат, чтобы блок не исчезал
const [lastResult, setLastResult] = useState<typeof finalSubmission>(null)
const isChecking = !!queueStatus || isSubmitting const isChecking = !!queueStatus || isSubmitting
const isAccepted = finalSubmission?.status === 'accepted' const isAccepted = finalSubmission?.status === 'accepted'
const needsRevision = finalSubmission?.status === 'needs_revision' const needsRevision = finalSubmission?.status === 'needs_revision'
// Обновляем сохраненный результат только когда получаем новый
useEffect(() => {
if (finalSubmission) {
setLastResult(finalSubmission)
}
}, [finalSubmission])
useEffect(() => { useEffect(() => {
if (finalSubmission) { if (finalSubmission) {
refreshStats() refreshStats()
} }
}, [finalSubmission, refreshStats]) }, [finalSubmission, refreshStats])
// Используем либо текущий результат, либо последний сохраненный
const displayedSubmission = finalSubmission || lastResult
const showAccepted = displayedSubmission?.status === 'accepted'
const showNeedsRevision = displayedSubmission?.status === 'needs_revision'
return ( return (
<VStack align="stretch" gap={3}> <VStack align="stretch" gap={3}>
<Box borderWidth="1px" borderRadius="md" borderColor="gray.200" p={4} bg="white" shadow="sm"> <Box borderWidth="1px" borderRadius="md" borderColor="gray.200" p={4} bg="white" shadow="sm">
@@ -212,8 +227,9 @@ export const TaskWorkspace = ({ task, onTaskComplete }: TaskWorkspaceProps) => {
</Box> </Box>
</Box> </Box>
{/* Статус проверки */} {/* Статус проверки и результат - фиксированное место */}
{queueStatus && !finalSubmission && ( <Box minH="80px">
{queueStatus && !finalSubmission ? (
<Box borderWidth="1px" borderRadius="md" borderColor="blue.200" bg="blue.50" p={2}> <Box borderWidth="1px" borderRadius="md" borderColor="blue.200" bg="blue.50" p={2}>
<HStack gap={2}> <HStack gap={2}>
<Spinner size="sm" color="blue.500" /> <Spinner size="sm" color="blue.500" />
@@ -223,10 +239,7 @@ export const TaskWorkspace = ({ task, onTaskComplete }: TaskWorkspaceProps) => {
</Text> </Text>
</HStack> </HStack>
</Box> </Box>
)} ) : showAccepted ? (
{/* Результат проверки - успех */}
{isAccepted && (
<Box borderWidth="1px" borderRadius="md" borderColor="green.300" bg="green.50" p={3}> <Box borderWidth="1px" borderRadius="md" borderColor="green.300" bg="green.50" p={3}>
<HStack justify="space-between" align="start"> <HStack justify="space-between" align="start">
<HStack align="start" gap={2} flex={1}> <HStack align="start" gap={2} flex={1}>
@@ -235,9 +248,9 @@ export const TaskWorkspace = ({ task, onTaskComplete }: TaskWorkspaceProps) => {
<Text fontSize="md" fontWeight="bold" color="green.700"> <Text fontSize="md" fontWeight="bold" color="green.700">
Задание принято! Задание принято!
</Text> </Text>
{finalSubmission?.feedback && ( {displayedSubmission?.feedback && (
<Text fontSize="sm" color="gray.700" mt={1}> <Text fontSize="sm" color="gray.700" mt={1}>
{finalSubmission.feedback} {displayedSubmission.feedback}
</Text> </Text>
)} )}
</Box> </Box>
@@ -247,31 +260,29 @@ export const TaskWorkspace = ({ task, onTaskComplete }: TaskWorkspaceProps) => {
</Button> </Button>
</HStack> </HStack>
</Box> </Box>
)} ) : showNeedsRevision ? (
{/* Результат проверки - требуется доработка */}
{needsRevision && (
<Box borderWidth="1px" borderRadius="md" borderColor="orange.300" bg="orange.50" p={3}> <Box borderWidth="1px" borderRadius="md" borderColor="orange.300" bg="orange.50" p={3}>
<HStack align="start" gap={2}> <HStack align="start" gap={2}>
<Text fontSize="xl"></Text> <Text fontSize="xl"></Text>
<Box flex={1}> <Box flex={1}>
<HStack> <HStack>
<Text fontSize="md" fontWeight="bold" color="orange.700"> <Text fontSize="md" fontWeight="bold" color="orange.700">
Требуется доработка Задание требует доработки
</Text> </Text>
<Text fontSize="xs" color="gray.600"> <Text fontSize="xs" color="gray.600">
(попытка {finalSubmission?.attemptNumber}) (попытка {displayedSubmission?.attemptNumber})
</Text> </Text>
</HStack> </HStack>
{finalSubmission?.feedback && ( {displayedSubmission?.feedback && (
<Text fontSize="sm" color="gray.700" mt={1}> <Text fontSize="sm" color="gray.700" mt={1}>
{finalSubmission.feedback} {displayedSubmission.feedback}
</Text> </Text>
)} )}
</Box> </Box>
</HStack> </HStack>
</Box> </Box>
)} ) : null}
</Box>
<Box> <Box>
<Text fontWeight="medium" mb={1} fontSize="sm"> <Text fontWeight="medium" mb={1} fontSize="sm">