ceb8910dcb
Some checks failed
platform/bro-js/challenge-pl/pipeline/head There was a failure building this commit
82 lines
2.1 KiB
TypeScript
82 lines
2.1 KiB
TypeScript
import React, { useEffect } from 'react'
|
||
import {
|
||
Box,
|
||
Button,
|
||
HStack,
|
||
Text,
|
||
Textarea,
|
||
VStack,
|
||
} from '@chakra-ui/react'
|
||
|
||
import type { ChallengeTask } from '../../__data__/types'
|
||
import { useChallenge } from '../../context/ChallengeContext'
|
||
import { useSubmission } from '../../hooks/useSubmission'
|
||
import { CheckStatusView } from './CheckStatusView'
|
||
import { ResultView } from './ResultView'
|
||
|
||
interface TaskWorkspaceProps {
|
||
task: ChallengeTask
|
||
onTaskComplete?: () => void
|
||
}
|
||
|
||
export const TaskWorkspace = ({ task, onTaskComplete }: TaskWorkspaceProps) => {
|
||
const { refreshStats } = useChallenge()
|
||
const { result, setResult, submit, reset, queueStatus, finalSubmission, isSubmitting } = useSubmission({
|
||
taskId: task.id,
|
||
})
|
||
|
||
const descriptionBg = 'gray.50'
|
||
|
||
useEffect(() => {
|
||
if (finalSubmission) {
|
||
refreshStats()
|
||
}
|
||
}, [finalSubmission, refreshStats])
|
||
|
||
if (queueStatus) {
|
||
return <CheckStatusView status={queueStatus} />
|
||
}
|
||
|
||
if (finalSubmission) {
|
||
return (
|
||
<ResultView submission={finalSubmission} onRetry={reset} onNext={onTaskComplete} />
|
||
)
|
||
}
|
||
|
||
return (
|
||
<VStack align="stretch" spacing={4}>
|
||
<Box borderWidth="1px" borderRadius="lg" borderColor="gray.200" p={4} bg={descriptionBg}>
|
||
<Text fontSize="lg" fontWeight="semibold" mb={2}>
|
||
{task.title}
|
||
</Text>
|
||
<Text whiteSpace="pre-line" color="gray.700">
|
||
{task.description}
|
||
</Text>
|
||
</Box>
|
||
|
||
<Box>
|
||
<Text fontWeight="medium" mb={2}>
|
||
Ваше решение
|
||
</Text>
|
||
<Textarea
|
||
value={result}
|
||
onChange={(event) => setResult(event.target.value)}
|
||
placeholder="Напишите ваше решение..."
|
||
rows={14}
|
||
bg="white"
|
||
/>
|
||
</Box>
|
||
|
||
<HStack justify="flex-end" spacing={3}>
|
||
<Button onClick={reset} variant="ghost">
|
||
Сбросить
|
||
</Button>
|
||
<Button onClick={submit} colorScheme="teal" isLoading={isSubmitting} isDisabled={!result.trim()}>
|
||
Отправить на проверку
|
||
</Button>
|
||
</HStack>
|
||
</VStack>
|
||
)
|
||
}
|
||
|