Keep tests pane open (display: none) so that we don't lose collapse s…

…tate of the accordions
France-ioi · Aug 11, 2023 · 906c086 · 906c086
1 parent 34c2ef3
commit 906c086
Show file tree

Hide file tree

Showing 7 changed files with 28 additions and 24 deletions.
diff --git a/frontend/submission/TestsPane.tsx b/frontend/submission/TestsPane.tsx
@@ -17,7 +17,11 @@ import {faClock} from '@fortawesome/free-solid-svg-icons';
 import {faTimes} from '@fortawesome/free-solid-svg-icons/faTimes';
 import {TaskSubmission, TaskSubmissionEvaluateOn, TaskSubmissionServer} from './submission_types';
 
-export function TestsPane() {
+export interface TestsPaneProps {
+    open: boolean,
+}
+
+export function TestsPane(props: TestsPaneProps) {
     const submissionResults = useAppSelector(state => state.submission.taskSubmissions);
     const dispatch = useDispatch();
     const currentSubmission = useAppSelector(state => null !== state.submission.currentSubmissionId ? submissionResults[state.submission.currentSubmissionId] : null);
@@ -69,7 +73,7 @@ export function TestsPane() {
     };
 
     return (
-        <div className="submission-results">
+        <div className="submission-results" style={{display: props.open ? 'block' : 'none'}}>
             <div className="submission-results__header">
                 <div className="submission-results__title">{getMessage(currentSubmission ? 'SUBMISSION_RESULTS_TITLE' : 'SUBMISSION_RESULTS_TESTS_TITLE')}</div>
                 <div className="submission-results__close" onClick={closePane}>
@@ -94,25 +98,24 @@ export function TestsPane() {
                     </Dropdown.Menu>
                 </Dropdown>
             </div>}
-            {null !== currentSubmission && <div className="submission-results__submission">
-                {currentSubmission.evaluated ?
+
+            <div className="submission-results__submission">
+                <div style={{display: !currentSubmission || currentSubmission.evaluated ? 'block' : 'none'}}>
                     <TestsPaneList
                         submission={currentSubmission}
                     />
-                    :
-                    (currentSubmission.crashed ? <div className="submission-results__submission-crashed">
+                </div>
+
+                {(currentSubmission && !currentSubmission.evaluated) && (
+                    currentSubmission.crashed ? <div className="submission-results__submission-crashed">
                         {getMessage('SUBMISSION_RESULTS_CRASHED')}
                     </div>
                         : <div className="submission-results__submission-loader">
                             <FontAwesomeIcon icon={faSpinner} className="fa-spin mr-2"/>
                             {getMessage('SUBMISSION_RESULTS_EVALUATING')}
-                        </div>)
-                }
-            </div>}
-            {null === currentSubmission && <div className="submission-results__submission">
-                <TestsPaneList
-                />
-            </div>}
+                        </div>
+                )}
+            </div>
         </div>
     )
 }
diff --git a/frontend/submission/TestsPaneList.tsx b/frontend/submission/TestsPaneList.tsx
@@ -30,7 +30,7 @@ export function TestsPaneList(props: SubmissionResultProps) {
     const currentTask = useAppSelector(state => state.task.currentTask);
     const testsOrdered = useAppSelector(selectTaskTests);
     const submission = props.submission;
-    const subTasksOrdered = currentTask.subTasks ? [...currentTask.subTasks] : [];
+    const subTasksOrdered = currentTask?.subTasks ? [...currentTask.subTasks] : [];
     subTasksOrdered.sort((a, b) => a.rank - b.rank);
     const submissionDisplayedError = useAppSelector(state => state.submission.submissionDisplayedError);
     const context = quickAlgoLibraries.getContext(null, 'main');
@@ -73,7 +73,7 @@ export function TestsPaneList(props: SubmissionResultProps) {
 
     return (
         <div className="submission-result">
-            {submission && isServerSubmission(submission) && TaskSubmissionMode.UserTest === submission.result.mode && <div>
+            {submission && isServerSubmission(submission) && TaskSubmissionMode.UserTest === submission.result?.mode && <div>
                 <Alert intent={Intent.WARNING}>{getMessage('SUBMISSION_USER_TEST_WARNING')}</Alert>
             </div>}
             {submission && !submission.evaluated && <div>
@@ -83,7 +83,7 @@ export function TestsPaneList(props: SubmissionResultProps) {
             <React.Fragment>
                 {compilationResult}
 
-                {submission && (!isServerSubmission(submission) || !submission.result.compilationError) && submission.result.tests.length === 0 && <div>
+                {submission && (!isServerSubmission(submission) || !submission.result?.compilationError) && submission.result?.tests.length === 0 && <div>
                     {getMessage('SUBMISSION_NO_TESTS')}
                 </div>}
 

diff --git a/frontend/submission/TestsPaneListSubTask.tsx b/frontend/submission/TestsPaneListSubTask.tsx
@@ -17,14 +17,14 @@ export interface SubmissionResultSubTaskProps {
 export function TestsPaneListSubTask(props: SubmissionResultSubTaskProps) {
     const taskTests = useAppSelector(selectTaskTests);
     const subTask = props.subTask;
-    const subTaskResult = props.submission && props.submission.result.subTasks ? props.submission.result.subTasks.find(submissionSubTask => submissionSubTask.subtaskId === subTask.id) : null;
+    const subTaskResult = props.submission && props.submission.result?.subTasks ? props.submission.result.subTasks.find(submissionSubTask => submissionSubTask.subtaskId === subTask.id) : null;
     const [open, setOpen] = useState(false);
 
     const testsOrdered = [...taskTests.filter(test => test.subtaskId === subTask.id)];
 
     const testsByIcon: {[key: number]: number} = {};
     let testsByIconValues: {errorCodeData: ErrorCodeData, count: number}[];
-    if (props.submission) {
+    if (props.submission && props.submission.result) {
         for (let test of testsOrdered) {
             const testResult = props.submission.result.tests.find(submissionTest => submissionTest.testId === test.id);
             if (testResult && null !== testResult.errorCode && undefined !== testResult.errorCode) {

diff --git a/frontend/submission/TestsPaneListTest.tsx b/frontend/submission/TestsPaneListTest.tsx
@@ -83,7 +83,7 @@ export const testErrorCodeData: {[property in SubmissionTestErrorCode]: ErrorCod
 export function TestsPaneListTest(props: SubmissionResultTestProps) {
     const test = props.test;
     const currentTestId = useAppSelector(state => state.task.currentTestId);
-    const testResult = props.submission ? props.submission.result.tests.find(otherTest => otherTest.testId === test.id) : null;
+    const testResult = props.submission && props.submission.result ? props.submission.result.tests.find(otherTest => otherTest.testId === test.id) : null;
     const testIndex = useAppSelector(state => selectTaskTests(state).findIndex(otherTest => otherTest.id === test.id));
 
     const hasRelativeScore = testResult && testResult.score > 0 && testResult.score < 1;

diff --git a/frontend/submission/TestsPaneListUserTests.tsx b/frontend/submission/TestsPaneListUserTests.tsx
@@ -1,4 +1,4 @@
-import React, {useState} from "react";
+import React, {useEffect, useState} from "react";
 import {useAppSelector} from "../hooks";
 import {Collapse} from 'react-bootstrap';
 import {FontAwesomeIcon} from '@fortawesome/react-fontawesome';
@@ -27,7 +27,7 @@ export function TestsPaneListUserTests(props: SubmissionResultSubTaskProps) {
 
     const testsByIcon: {[key: number]: number} = {};
     let testsByIconValues: {errorCodeData: ErrorCodeData, count: number}[];
-    if (props.submission) {
+    if (props.submission && props.submission.result) {
         for (let test of testsOrdered) {
             const testResult = props.submission.result.tests.find(submissionTest => submissionTest.testId === test.id);
             if (testResult && null !== testResult.errorCode && undefined !== testResult.errorCode) {

diff --git a/frontend/task/TaskApp.tsx b/frontend/task/TaskApp.tsx
@@ -136,7 +136,10 @@ export function TaskApp() {
         <Container key={language} fluid className={`task ${fullScreenActive ? 'full-screen' : ''} layout-${layoutType} task-player-${layoutPlayerMode} platform-${options.platform}`}>
             <div className="layout-general">
                 <div className={`task-section`}>
-                    {submissionsPaneOpen && <TestsPane/>}
+                    <TestsPane
+                        open={submissionsPaneOpen}
+                    />
+
                     <div className="task-section-container">
                         <div className="task-header">
                             <span className="task-header__quick">QUICK</span>

diff --git a/frontend/task/libs/printer/printer_lib.tsx b/frontend/task/libs/printer/printer_lib.tsx
@@ -747,8 +747,6 @@ export class PrinterLib extends QuickAlgoLibrary {
                 },
             };
 
-            console.log('the test', test);
-
             let unknownInput = true;
             let initial = '';
             if (undefined !== log.remainingInput) {