aboutsummaryrefslogtreecommitdiffhomepage
path: root/frontend/app/components/Gaming/SubmitResult.tsx
blob: 6f4cb0eb5d6769fecd06fd769d2a8a677d69fc12 (plain)
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
import { faArrowDown } from "@fortawesome/free-solid-svg-icons";
import { FontAwesomeIcon } from "@fortawesome/react-fontawesome";
import React from "react";
import type { SubmitResult } from "../../models/SubmitResult";
import BorderedContainer from "../BorderedContainer";
import SubmitStatusLabel from "../SubmitStatusLabel";
import ExecStatusIndicatorIcon from "./ExecStatusIndicatorIcon";

type Props = {
	result: SubmitResult;
	submitButton?: React.ReactNode;
};

export default function SubmitResult({ result, submitButton }: Props) {
	return (
		<div className="flex flex-col gap-2">
			<div className="flex">
				{submitButton}
				<div className="grow font-bold text-xl text-center">
					<SubmitStatusLabel status={result.status} />
				</div>
			</div>
			<ul className="flex flex-col gap-2">
				{result.execResults.map((r, idx) => (
					<li key={r.testcase_id ?? -1} className="flex gap-2">
						<div className="flex flex-col gap-2 p-2">
							<ExecStatusIndicatorIcon status={r.status} />
							{idx !== result.execResults.length - 1 && (
								<div>
									<FontAwesomeIcon
										icon={faArrowDown}
										fixedWidth
										className="text-gray-500"
									/>
								</div>
							)}
						</div>
						<div className="grow p-2">
							<BorderedContainer>
								<div className="font-semibold">{r.label}</div>
								<pre className="overflow-y-hidden max-h-96 whitespace-pre-wrap break-words">
									<code>
										{r.stdout}
										{r.stderr}
									</code>
								</pre>
							</BorderedContainer>
						</div>
					</li>
				))}
			</ul>
		</div>
	);
}