Mission editing slang

src/components/NavigationBar.tsx

@@ -61,7 +61,7 @@ const NavigationBar: React.SFC<INavigationBarProps> = props => (
         to="/incubator"
       >
         <Icon icon={IconNames.CODE} />
-        <div className="navbar-button-text hidden-xs">Incubator</div>
+        <div className="navbar-button-text hidden-xs">Mission-Control</div>
       </NavLink>
 
       <NavLink

src/components/__tests__/__snapshots__/NavigationBar.tsx.snap

@@ -26,7 +26,7 @@ exports[`NavigationBar renders "Not logged in" correctly 1`] = `
     <NavLink activeClassName=\\"pt-active\\" className=\\"NavigationBar__link pt-button pt-minimal\\" to=\\"/incubator\\" ariaCurrent=\\"true\\">
       <Blueprint2.Icon icon=\\"code\\" />
       <div className=\\"navbar-button-text hidden-xs\\">
-        Incubator
+        Mission-Control
       </div>
     </NavLink>
     <NavLink activeClassName=\\"pt-active\\" className=\\"NavigationBar__link pt-button pt-minimal\\" to=\\"/playground\\" ariaCurrent=\\"true\\">
@@ -72,7 +72,7 @@ exports[`NavigationBar renders correctly with username 1`] = `
     <NavLink activeClassName=\\"pt-active\\" className=\\"NavigationBar__link pt-button pt-minimal\\" to=\\"/incubator\\" ariaCurrent=\\"true\\">
       <Blueprint2.Icon icon=\\"code\\" />
       <div className=\\"navbar-button-text hidden-xs\\">
-        Incubator
+        Mission-Control
       </div>
     </NavLink>
     <NavLink activeClassName=\\"pt-active\\" className=\\"NavigationBar__link pt-button pt-minimal\\" to=\\"/playground\\" ariaCurrent=\\"true\\">

src/components/assessment/AssessmentWorkspace.tsx

@@ -1,11 +1,21 @@
-import { Button, Card, Dialog, NonIdealState, Spinner } from '@blueprintjs/core';
+import {
+  Button,
+  ButtonGroup,
+  Card,
+  Classes,
+  Dialog,
+  Intent,
+  NonIdealState,
+  Spinner
+} from '@blueprintjs/core';
 import { IconNames } from '@blueprintjs/icons';
 import * as React from 'react';
 
 import { InterpreterOutput, IWorkspaceState } from '../../reducers/states';
 import { beforeNow } from '../../utils/dateHelpers';
 import { history } from '../../utils/history';
 import { assessmentCategoryLink } from '../../utils/paramParseHelpers';
+import { controlButton } from '../commons';
 import Markdown from '../commons/Markdown';
 import Workspace, { WorkspaceProps } from '../workspace';
 import { ControlBarProps } from '../workspace/ControlBar';
@@ -67,13 +77,15 @@ export type DispatchProps = {
 
 class AssessmentWorkspace extends React.Component<
   AssessmentWorkspaceProps,
-  { showOverlay: boolean }
+  { showOverlay: boolean; showResetOverlay: boolean }
 > {
   public constructor(props: AssessmentWorkspaceProps) {
     super(props);
     this.state = {
-      showOverlay: false
+      showOverlay: false,
+      showResetOverlay: false
     };
+    this.props.handleEditorValueChange('');
   }
 
   /**
@@ -86,6 +98,20 @@ class AssessmentWorkspace extends React.Component<
     if (this.props.questionId === 0 && this.props.notAttempted) {
       this.setState({ showOverlay: true });
     }
+    if (this.props.assessment) {
+      const question: IQuestion = this.props.assessment.questions[
+        this.props.questionId >= this.props.assessment.questions.length
+          ? this.props.assessment.questions.length - 1
+          : this.props.questionId
+      ];
+      this.props.handleEditorValueChange(
+        question.type === QuestionTypes.programming
+          ? question.answer !== null
+            ? ((question as IProgrammingQuestion).answer as string)
+            : (question as IProgrammingQuestion).solutionTemplate
+          : ''
+      );
+    }
   }
 
   /**
@@ -119,24 +145,53 @@ class AssessmentWorkspace extends React.Component<
         </Card>
       </Dialog>
     );
+
+    const resetOverlay = (
+      <Dialog
+        className="assessment-reset"
+        icon={IconNames.ERROR}
+        isCloseButtonShown={false}
+        isOpen={this.state.showResetOverlay}
+        title="Confirmation: Reset editor?"
+      >
+        <div className={Classes.DIALOG_BODY}>
+          <Markdown content="Are you sure you want to reset the template?" />
+          <Markdown content="*Note this will not affect the saved copy of your code, unless you save over it.*" />
+        </div>
+        <div className={Classes.DIALOG_FOOTER}>
+          <ButtonGroup>
+            {controlButton('Cancel', null, () => this.setState({ showResetOverlay: false }), {
+              minimal: false
+            })}
+            {controlButton(
+              'Confirm',
+              null,
+              () => {
+                this.setState({ showResetOverlay: false });
+                this.props.handleEditorValueChange(
+                  (this.props.assessment!.questions[questionId] as IProgrammingQuestion)
+                    .solutionTemplate
+                );
+                this.props.handleUpdateHasUnsavedChanges(true);
+              },
+              { minimal: false, intent: Intent.DANGER }
+            )}
+          </ButtonGroup>
+        </div>
+      </Dialog>
+    );
     /* If questionId is out of bounds, set it to the max. */
     const questionId =
       this.props.questionId >= this.props.assessment.questions.length
         ? this.props.assessment.questions.length - 1
         : this.props.questionId;
     const question: IQuestion = this.props.assessment.questions[questionId];
-    const editorValue =
-      question.type === QuestionTypes.programming
-        ? question.answer !== null
-          ? ((question as IProgrammingQuestion).answer as string)
-          : (question as IProgrammingQuestion).solutionTemplate
-        : null;
     const workspaceProps: WorkspaceProps = {
       controlBarProps: this.controlBarProps(this.props, questionId),
       editorProps:
         question.type === QuestionTypes.programming
           ? {
-              editorValue: editorValue!,
+              editorValue: this.props.editorValue!,
               handleEditorEval: this.props.handleEditorEval,
               handleEditorValueChange: this.props.handleEditorValueChange,
               handleUpdateHasUnsavedChanges: this.props.handleUpdateHasUnsavedChanges
@@ -165,6 +220,7 @@ class AssessmentWorkspace extends React.Component<
     return (
       <div className="WorkspaceParent pt-dark">
         {overlay}
+        {resetOverlay}
         <Workspace {...workspaceProps} />
       </div>
     );
@@ -194,7 +250,7 @@ class AssessmentWorkspace extends React.Component<
           ? question.answer !== null
             ? ((question as IProgrammingQuestion).answer as string)
             : (question as IProgrammingQuestion).solutionTemplate
-          : null;
+          : '';
       this.props.handleUpdateCurrentAssessmentId(assessmentId, questionId);
       this.props.handleResetWorkspace({ editorValue });
       this.props.handleClearContext(question.library);
@@ -286,6 +342,9 @@ class AssessmentWorkspace extends React.Component<
           this.props.assessment!.questions[questionId].id,
           this.props.editorValue!
         ),
+      onClickReset: () => {
+        this.setState({ showResetOverlay: true });
+      },
       questionProgress: [questionId + 1, this.props.assessment!.questions.length],
       sourceChapter: this.props.assessment!.questions[questionId].library.chapter
     };

src/components/assessment/__tests__/__snapshots__/AssessmentWorkspace.tsx.snap

@@ -10,6 +10,22 @@ exports[`AssessmentWorkspace page with MCQ question renders correctly 1`] = `
       <Blueprint2.Button className=\\"assessment-briefing-button\\" onClick={[Function: onClick]} text=\\"Continue\\" />
     </Blueprint2.Card>
   </Blueprint2.Dialog>
+  <Blueprint2.Dialog className=\\"assessment-reset\\" icon=\\"error\\" isCloseButtonShown={false} isOpen={false} title=\\"Confirmation: Reset editor?\\" canOutsideClickClose={true}>
+    <div className=\\"pt-dialog-body\\">
+      <Markdown content=\\"Are you sure you want to reset the template?\\" />
+      <Markdown content=\\"*Note this will not affect the saved copy of your code, unless you save over it.*\\" />
+    </div>
+    <div className=\\"pt-dialog-footer\\">
+      <Blueprint2.ButtonGroup>
+        <Blueprint2.Button disabled={false} fill={false} intent=\\"none\\" minimal={false} className=\\"\\" onClick={[Function]}>
+          Cancel
+        </Blueprint2.Button>
+        <Blueprint2.Button disabled={false} fill={false} intent=\\"danger\\" minimal={false} className=\\"\\" onClick={[Function]}>
+          Confirm
+        </Blueprint2.Button>
+      </Blueprint2.ButtonGroup>
+    </div>
+  </Blueprint2.Dialog>
   <Workspace controlBarProps={{...}} editorProps={[undefined]} editorWidth=\\"50%\\" handleEditorWidthChange={[Function: handleEditorWidthChange]} handleSideContentHeightChange={[Function: handleSideContentHeightChange]} hasUnsavedChanges={false} mcqProps={{...}} sideContentHeight={[undefined]} sideContentProps={{...}} replProps={{...}} />
 </div>"
 `;
@@ -22,6 +38,22 @@ exports[`AssessmentWorkspace page with overdue assessment renders correctly 1`]
       <Blueprint2.Button className=\\"assessment-briefing-button\\" onClick={[Function: onClick]} text=\\"Continue\\" />
     </Blueprint2.Card>
   </Blueprint2.Dialog>
+  <Blueprint2.Dialog className=\\"assessment-reset\\" icon=\\"error\\" isCloseButtonShown={false} isOpen={false} title=\\"Confirmation: Reset editor?\\" canOutsideClickClose={true}>
+    <div className=\\"pt-dialog-body\\">
+      <Markdown content=\\"Are you sure you want to reset the template?\\" />
+      <Markdown content=\\"*Note this will not affect the saved copy of your code, unless you save over it.*\\" />
+    </div>
+    <div className=\\"pt-dialog-footer\\">
+      <Blueprint2.ButtonGroup>
+        <Blueprint2.Button disabled={false} fill={false} intent=\\"none\\" minimal={false} className=\\"\\" onClick={[Function]}>
+          Cancel
+        </Blueprint2.Button>
+        <Blueprint2.Button disabled={false} fill={false} intent=\\"danger\\" minimal={false} className=\\"\\" onClick={[Function]}>
+          Confirm
+        </Blueprint2.Button>
+      </Blueprint2.ButtonGroup>
+    </div>
+  </Blueprint2.Dialog>
   <Workspace controlBarProps={{...}} editorProps={{...}} editorWidth=\\"50%\\" handleEditorWidthChange={[Function: handleEditorWidthChange]} handleSideContentHeightChange={[Function: handleSideContentHeightChange]} hasUnsavedChanges={false} mcqProps={{...}} sideContentHeight={[undefined]} sideContentProps={{...}} replProps={{...}} />
 </div>"
 `;
@@ -34,6 +66,22 @@ exports[`AssessmentWorkspace page with programming question renders correctly 1`
       <Blueprint2.Button className=\\"assessment-briefing-button\\" onClick={[Function: onClick]} text=\\"Continue\\" />
     </Blueprint2.Card>
   </Blueprint2.Dialog>
+  <Blueprint2.Dialog className=\\"assessment-reset\\" icon=\\"error\\" isCloseButtonShown={false} isOpen={false} title=\\"Confirmation: Reset editor?\\" canOutsideClickClose={true}>
+    <div className=\\"pt-dialog-body\\">
+      <Markdown content=\\"Are you sure you want to reset the template?\\" />
+      <Markdown content=\\"*Note this will not affect the saved copy of your code, unless you save over it.*\\" />
+    </div>
+    <div className=\\"pt-dialog-footer\\">
+      <Blueprint2.ButtonGroup>
+        <Blueprint2.Button disabled={false} fill={false} intent=\\"none\\" minimal={false} className=\\"\\" onClick={[Function]}>
+          Cancel
+        </Blueprint2.Button>
+        <Blueprint2.Button disabled={false} fill={false} intent=\\"danger\\" minimal={false} className=\\"\\" onClick={[Function]}>
+          Confirm
+        </Blueprint2.Button>
+      </Blueprint2.ButtonGroup>
+    </div>
+  </Blueprint2.Dialog>
   <Workspace controlBarProps={{...}} editorProps={{...}} editorWidth=\\"50%\\" handleEditorWidthChange={[Function: handleEditorWidthChange]} handleSideContentHeightChange={[Function: handleSideContentHeightChange]} hasUnsavedChanges={false} mcqProps={{...}} sideContentHeight={[undefined]} sideContentProps={{...}} replProps={{...}} />
 </div>"
 `;

src/components/assessment/assessmentShape.ts

@@ -46,7 +46,7 @@ export type GradingStatus = keyof typeof GradingStatuses;
 export interface IAssessment {
   category: AssessmentCategory;
   globalDeployment?: Library;
-  graderDeployment?: any;
+  graderDeployment?: Library;
   id: number;
   longSummary: string;
   missionPDF: string;
@@ -84,6 +84,7 @@ export interface IQuestion {
   content: string;
   id: number;
   library: Library;
+  graderLibrary?: Library;
   type: QuestionType;
   grader: {
     name: string;

src/components/incubator/EditingOverviewCard.tsx

@@ -105,7 +105,7 @@ export class EditingOverviewCard extends React.Component<Props, IState> {
             {this.state.editingOverviewField === 'shortSummary' ? (
               this.makeEditingOverviewTextarea('shortSummary')
             ) : (
-              <Markdown content={overview.shortSummary} />
+              <Markdown content={createPlaceholder(overview.shortSummary)} />
             )}
           </div>
           <div className="listing-controls">
@@ -138,7 +138,7 @@ export class EditingOverviewCard extends React.Component<Props, IState> {
         <h4 onClick={this.toggleEditField('title')}>
           {this.state.editingOverviewField === 'title'
             ? this.makeEditingOverviewTextarea('title')
-            : title}{' '}
+            : createPlaceholder(title)}
         </h4>
       </Text>
       <div className="col-xs-2">{this.makeExportButton(overview)}</div>
@@ -160,6 +160,14 @@ export class EditingOverviewCard extends React.Component<Props, IState> {
   );
 }
 
+const createPlaceholder = (str: string): string => {
+  if (str.match('^\n*$')) {
+    return 'Enter Value Here.';
+  } else {
+    return str;
+  }
+};
+
 const makeOverviewCardButton = (overview: IAssessmentOverview, listingPath: string | undefined) => {
   const icon: IconName = IconNames.EDIT;
   const label: string = 'Edit mission';