diff --git a/frontend/src/components/TestCase/index.tsx b/frontend/src/components/TestCase/index.tsx index a430d67225..07c8394ed3 100644 --- a/frontend/src/components/TestCase/index.tsx +++ b/frontend/src/components/TestCase/index.tsx @@ -1,10 +1,10 @@ import { Box, styled, Typography } from "@mui/material"; +import { CompilerResult } from "../../contexts/CollabContext"; type TestCaseProps = { input: string; - output?: string; - stdout: string; - result?: string; + expected: string; + result: CompilerResult; }; const StyledBox = styled(Box)(({ theme }) => ({ @@ -18,34 +18,58 @@ const StyledTypography = styled(Typography)(({ theme }) => ({ whiteSpace: "pre-line", })); -const TestCase: React.FC = ({ - input, - output, - stdout, - result, -}) => { +const TestCase: React.FC = ({ input, expected, result }) => { return ( - ({ marginBottom: theme.spacing(2) })}> + {"isMatch" in result && result.isMatch && ( + + + Accepted + + + )} + {"isMatch" in result && !result.isMatch && ( + + + Wrong Answer + + + )} + {result.stderr && ( + + Error + + {result.stderr} + + + )} + Input {input} - {output && ( + + Expected + {expected} + + {"actualResult" in result && ( - Output - {output} + Actual + + {result.actualResult || "\u00A0"} + )} - {stdout && ( + {"stdout" in result && ( Stdout - {stdout} + + {result.stdout || "\u00A0"} + )} - - Expected - {result} - ); }; diff --git a/frontend/src/contexts/CollabContext.tsx b/frontend/src/contexts/CollabContext.tsx index 2392ed44bb..7d81ed2d03 100644 --- a/frontend/src/contexts/CollabContext.tsx +++ b/frontend/src/contexts/CollabContext.tsx @@ -19,7 +19,7 @@ import { CollabEvents, collabSocket, leave } from "../utils/collabSocket"; import { communicationSocket } from "../utils/communicationSocket"; import useAppNavigate from "../components/UseAppNavigate"; -type CompilerResult = { +export type CompilerResult = { status: string; exception: string | null; stdout: string; @@ -29,6 +29,7 @@ type CompilerResult = { stout: string; actualResult: string; expectedResult: string; + isMatch: boolean; }; type CollabContextType = { @@ -39,6 +40,7 @@ type CollabContextType = { checkPartnerStatus: () => void; setCode: React.Dispatch>; compilerResult: CompilerResult[]; + setCompilerResult: React.Dispatch>; isEndSessionModalOpen: boolean; }; @@ -78,12 +80,12 @@ const CollabProvider: React.FC<{ children?: React.ReactNode }> = (props) => { try { const res = await codeExecutionClient.post("/", { questionId, - code, + // Replace tabs with 4 spaces to prevent formatting issues + code: code.replace(/\t/g, " ".repeat(4)), language: matchCriteria?.language.toLowerCase(), }); - - console.log(res.data.data); - setCompilerResult(res.data.data); + console.log([...res.data.data]); + setCompilerResult([...res.data.data]); let isMatch = true; for (let i = 0; i < res.data.data.length; i++) { @@ -156,6 +158,7 @@ const CollabProvider: React.FC<{ children?: React.ReactNode }> = (props) => { checkPartnerStatus, setCode, compilerResult, + setCompilerResult, isEndSessionModalOpen, }} > diff --git a/frontend/src/pages/CollabSandbox/index.tsx b/frontend/src/pages/CollabSandbox/index.tsx index 323457dee4..5c27452f42 100644 --- a/frontend/src/pages/CollabSandbox/index.tsx +++ b/frontend/src/pages/CollabSandbox/index.tsx @@ -12,7 +12,7 @@ import { Tabs, } from "@mui/material"; import classes from "./index.module.css"; -import { useCollab } from "../../contexts/CollabContext"; +import { CompilerResult, useCollab } from "../../contexts/CollabContext"; import { useMatch } from "../../contexts/MatchContext"; import { COLLAB_CONNECTION_ERROR, @@ -61,6 +61,8 @@ const CollabSandbox: React.FC = () => { } const { + compilerResult, + setCompilerResult, handleRejectEndSession, handleConfirmEndSession, checkPartnerStatus, @@ -79,6 +81,7 @@ const CollabSandbox: React.FC = () => { return; } getQuestionById(questionId, dispatch); + setCompilerResult([]); const matchId = getMatchId(); if (!matchUser || !matchId) { @@ -95,7 +98,7 @@ const CollabSandbox: React.FC = () => { toast.error(COLLAB_CONNECTION_ERROR); setIsConnecting(false); } - } catch (error) { + } catch { toast.error(COLLAB_CONNECTION_ERROR); setIsConnecting(false); } @@ -122,7 +125,7 @@ const CollabSandbox: React.FC = () => { return ; } - if (!selectedQuestion || !editorState) { + if (!selectedQuestion || !editorState || !compilerResult) { return ; } @@ -262,9 +265,12 @@ const CollabSandbox: React.FC = () => { {/* display result of each test case in the output (result) and stdout (any print statements executed) */} 0 + ? compilerResult[selectedTestcase] + : ({} as CompilerResult) + } />