fixed remaining errors in phys

1 files changed, 69 insertions, 63 deletions

diff --git a/src/client/views/nodes/PhysicsBox/PhysicsSimulationBox.tsx b/src/client/views/nodes/PhysicsBox/PhysicsSimulationBox.tsx
index fa47a218b..eb41e0de8 100644
--- a/src/client/views/nodes/PhysicsBox/PhysicsSimulationBox.tsx
+++ b/src/client/views/nodes/PhysicsBox/PhysicsSimulationBox.tsx
@@ -66,7 +66,7 @@ interface TutorialTemplate {
             directionInDegrees: number;
             component: boolean;
         }[];
-        show_Magnitude: boolean;
+        showMagnitude: boolean;
     }[];
 }
 
@@ -168,6 +168,16 @@ export class PhysicsSimulationBox extends ViewBoxAnnotatableComponent<FieldViewP
     radius = 50;
     wallPositions: IWallProps[] = [];
 
+    @computed get selectedQuestion() {
+        return this.dataDoc.selectedQuestion ? (JSON.parse(StrCast(this.dataDoc.selectedQuestion)) as QuestionTemplate) : questions.inclinePlane[0];
+    }
+    @computed get tutorial() {
+        return this.dataDoc.tutorial ? (JSON.parse(StrCast(this.dataDoc.tutorial)) as TutorialTemplate) : tutorials.inclinePlane;
+    }
+    @computed get selectedSolutions() {
+        return NumListCast(this.dataDoc.selectedSolutions);
+    }
+
     componentDidMount() {
         // Used throughout sims
         this.layoutDoc._width = 1000;
@@ -182,12 +192,8 @@ export class PhysicsSimulationBox extends ViewBoxAnnotatableComponent<FieldViewP
         // this.dataDoc.forceSketches = this.dataDoc.forceSketches ?? [];
         this.dataDoc.questionPartOne = '';
         this.dataDoc.questionPartTwo = '';
-        this.dataDoc.selectedQuestion = this.dataDoc.selectedQuestion ?? questions.inclinePlane[0];
         // this.dataDoc.sketching = this.dataDoc.sketching ?? false;
 
-        // Used for tutorial mode
-        this.dataDoc.tutorial = this.dataDoc.tutorial ?? tutorials.inclinePlane;
-
         // Setup simulation
         this.setupSimulation();
 
@@ -314,7 +320,7 @@ export class PhysicsSimulationBox extends ViewBoxAnnotatableComponent<FieldViewP
                 this.dataDoc.simulation_showForces = true;
                 this.dataDoc.mass1_positionYstart = this.yMax - 100;
                 this.dataDoc.mass1_positionXstart = (this.xMax + this.xMin) / 2 - 0.08 * this.layoutDoc[HeightSym]();
-                this.dataDoc.tutorial = tutorials.freeWeight;
+                this.dataDoc.tutorial = JSON.stringify(tutorials.freeWeight);
                 this.dataDoc.mass1_forcesStart = JSON.stringify(tutorials.freeWeight.steps[0].forces);
                 this.dataDoc.simulation_showForceMagnitudes = tutorials.freeWeight.steps[0].showMagnitude;
             } else if (this.simulationType == 'Spring') {
@@ -322,37 +328,37 @@ export class PhysicsSimulationBox extends ViewBoxAnnotatableComponent<FieldViewP
                 this.setupSpring();
                 this.dataDoc.mass1_positionYstart = this.yMin + 200 + 19.62;
                 this.dataDoc.mass1_positionXstart = (this.xMax + this.xMin) / 2 - 0.08 * this.layoutDoc[HeightSym]();
-                this.dataDoc.tutorial = tutorials.spring;
+                this.dataDoc.tutorial = JSON.stringify(tutorials.spring);
                 this.dataDoc.mass1_forcesStart = JSON.stringify(tutorials.spring.steps[0].forces);
                 this.dataDoc.simulation_showForceMagnitudes = tutorials.spring.steps[0].showMagnitude;
             } else if (this.simulationType == 'Pendulum') {
                 this.setupPendulum();
-                this.dataDoc.tutorial = tutorials.pendulum;
+                this.dataDoc.tutorial = JSON.stringify(tutorials.pendulum);
                 this.dataDoc.mass1_forcesStart = JSON.stringify(tutorials.pendulum.steps[0].forces);
                 this.dataDoc.simulation_showForceMagnitudes = tutorials.pendulum.steps[0].showMagnitude;
             } else if (this.simulationType == 'Inclined Plane') {
                 this.dataDoc.simulation_showForces = true;
                 this.dataDoc.wedge_angle = 26;
                 this.changeWedgeBasedOnNewAngle(26);
-                this.dataDoc.tutorial = tutorials.inclinePlane;
+                this.dataDoc.tutorial = JSON.stringify(tutorials.inclinePlane);
                 this.dataDoc.mass1_forcesStart = JSON.stringify(tutorials.inclinePlane.steps[0].forces);
                 this.dataDoc.simulation_showForceMagnitudes = tutorials.inclinePlane.steps[0].showMagnitude;
             } else if (this.simulationType == 'Circular Motion') {
                 this.dataDoc.simulation_showForces = true;
                 this.setupCircular(40);
-                this.dataDoc.tutorial = tutorials.circular;
+                this.dataDoc.tutorial = JSON.stringify(tutorials.circular);
                 this.dataDoc.mass1_forcesStart = JSON.stringify(tutorials.circular.steps[0].forces);
                 this.dataDoc.simulation_showForceMagnitudes = tutorials.circular.steps[0].showMagnitude;
             } else if (this.simulationType == 'Pulley') {
                 this.dataDoc.simulation_showForces = true;
                 this.setupPulley();
-                this.dataDoc.tutorial = tutorials.pulley;
+                this.dataDoc.tutorial = JSON.stringify(tutorials.pulley);
                 this.dataDoc.mass1_forcesStart = JSON.stringify(tutorials.pulley.steps[0].forces);
                 this.dataDoc.simulation_showForceMagnitudes = tutorials.pulley.steps[0].showMagnitude;
             } else if (this.simulationType == 'Suspension') {
                 this.dataDoc.simulation_showForces = true;
                 this.setupSuspension();
-                this.dataDoc.tutorial = tutorials.suspension;
+                this.dataDoc.tutorial = JSON.stringify(tutorials.suspension);
                 this.dataDoc.mass1_forcesStart = JSON.stringify(tutorials.suspension.steps[0].forces);
                 this.dataDoc.simulation_showForceMagnitudes = tutorials.suspension.steps[0].showMagnitude;
             }
@@ -469,7 +475,7 @@ export class PhysicsSimulationBox extends ViewBoxAnnotatableComponent<FieldViewP
     // In review mode, update forces when coefficient of static friction changed
     updateReviewForcesBasedOnCoefficient = (coefficient: number) => {
         let theta = this.wedgeAngle;
-        let index = this.dataDoc.selectedQuestion.variablesForQuestionSetup.indexOf('theta - max 45');
+        let index = this.selectedQuestion.variablesForQuestionSetup.indexOf('theta - max 45');
         if (index >= 0) {
             theta = NumListCast(this.dataDoc.questionVariables)[index];
         }
@@ -550,7 +556,7 @@ export class PhysicsSimulationBox extends ViewBoxAnnotatableComponent<FieldViewP
                 solutions.push((Math.atan(muS) * 180) / Math.PI);
             }
         }
-        this.dataDoc.selectedSolutions = solutions;
+        this.dataDoc.selectedSolutions = new List<number>(solutions);
         return solutions;
     };
 
@@ -558,38 +564,38 @@ export class PhysicsSimulationBox extends ViewBoxAnnotatableComponent<FieldViewP
     checkAnswers = (showAlert: boolean = true) => {
         let error: boolean = false;
         let epsilon: number = 0.01;
-        if (this.dataDoc.selectedQuestion) {
-            for (let i = 0; i < this.dataDoc.selectedQuestion.answerParts.length; i++) {
-                if (this.dataDoc.selectedQuestion.answerParts[i] == 'force of gravity') {
-                    if (Math.abs(NumCast(this.dataDoc.review_GravityMagnitude) - this.dataDoc.selectedSolutions[i]) > epsilon) {
+        if (this.selectedQuestion) {
+            for (let i = 0; i < this.selectedQuestion.answerParts.length; i++) {
+                if (this.selectedQuestion.answerParts[i] == 'force of gravity') {
+                    if (Math.abs(NumCast(this.dataDoc.review_GravityMagnitude) - this.selectedSolutions[i]) > epsilon) {
                         error = true;
                     }
-                } else if (this.dataDoc.selectedQuestion.answerParts[i] == 'angle of gravity') {
-                    if (Math.abs(NumCast(this.dataDoc.review_GravityAngle) - this.dataDoc.selectedSolutions[i]) > epsilon) {
+                } else if (this.selectedQuestion.answerParts[i] == 'angle of gravity') {
+                    if (Math.abs(NumCast(this.dataDoc.review_GravityAngle) - this.selectedSolutions[i]) > epsilon) {
                         error = true;
                     }
-                } else if (this.dataDoc.selectedQuestion.answerParts[i] == 'normal force') {
-                    if (Math.abs(NumCast(this.dataDoc.review_NormalMagnitude) - this.dataDoc.selectedSolutions[i]) > epsilon) {
+                } else if (this.selectedQuestion.answerParts[i] == 'normal force') {
+                    if (Math.abs(NumCast(this.dataDoc.review_NormalMagnitude) - this.selectedSolutions[i]) > epsilon) {
                         error = true;
                     }
-                } else if (this.dataDoc.selectedQuestion.answerParts[i] == 'angle of normal force') {
-                    if (Math.abs(NumCast(this.dataDoc.review_NormalAngle) - this.dataDoc.selectedSolutions[i]) > epsilon) {
+                } else if (this.selectedQuestion.answerParts[i] == 'angle of normal force') {
+                    if (Math.abs(NumCast(this.dataDoc.review_NormalAngle) - this.selectedSolutions[i]) > epsilon) {
                         error = true;
                     }
-                } else if (this.dataDoc.selectedQuestion.answerParts[i] == 'force of static friction') {
-                    if (Math.abs(NumCast(this.dataDoc.review_StaticMagnitude) - this.dataDoc.selectedSolutions[i]) > epsilon) {
+                } else if (this.selectedQuestion.answerParts[i] == 'force of static friction') {
+                    if (Math.abs(NumCast(this.dataDoc.review_StaticMagnitude) - this.selectedSolutions[i]) > epsilon) {
                         error = true;
                     }
-                } else if (this.dataDoc.selectedQuestion.answerParts[i] == 'angle of static friction') {
-                    if (Math.abs(NumCast(this.dataDoc.review_StaticAngle) - this.dataDoc.selectedSolutions[i]) > epsilon) {
+                } else if (this.selectedQuestion.answerParts[i] == 'angle of static friction') {
+                    if (Math.abs(NumCast(this.dataDoc.review_StaticAngle) - this.selectedSolutions[i]) > epsilon) {
                         error = true;
                     }
-                } else if (this.dataDoc.selectedQuestion.answerParts[i] == 'coefficient of static friction') {
-                    if (Math.abs(NumCast(this.dataDoc.coefficientOfStaticFriction) - this.dataDoc.selectedSolutions[i]) > epsilon) {
+                } else if (this.selectedQuestion.answerParts[i] == 'coefficient of static friction') {
+                    if (Math.abs(NumCast(this.dataDoc.coefficientOfStaticFriction) - this.selectedSolutions[i]) > epsilon) {
                         error = true;
                     }
-                } else if (this.dataDoc.selectedQuestion.answerParts[i] == 'wedge angle') {
-                    if (Math.abs(this.wedgeAngle - this.dataDoc.selectedSolutions[i]) > epsilon) {
+                } else if (this.selectedQuestion.answerParts[i] == 'wedge angle') {
+                    if (Math.abs(this.wedgeAngle - this.selectedSolutions[i]) > epsilon) {
                         error = true;
                     }
                 }
@@ -608,7 +614,7 @@ export class PhysicsSimulationBox extends ViewBoxAnnotatableComponent<FieldViewP
                 }, 3000);
             }
         }
-        if (this.dataDoc.selectedQuestion.goal == 'noMovement') {
+        if (this.selectedQuestion.goal == 'noMovement') {
             if (!error) {
                 this.dataDoc.noMovement = true;
             } else {
@@ -674,7 +680,7 @@ export class PhysicsSimulationBox extends ViewBoxAnnotatableComponent<FieldViewP
             }
         }
         this.dataDoc.questionVariables = new List<number>(vars);
-        this.dataDoc.selectedQuestion = question;
+        this.dataDoc.selectedQuestion = JSON.stringify(question);
         this.dataDoc.questionPartOne = q;
         this.dataDoc.questionPartTwo = question.question;
         this.dataDoc.answers = new List<number>(this.getAnswersToQuestion(question, vars));
@@ -1111,7 +1117,7 @@ export class PhysicsSimulationBox extends ViewBoxAnnotatableComponent<FieldViewP
                                 <Dialog maxWidth={'sm'} fullWidth={true} open={BoolCast(this.dataDoc.hintDialogueOpen)} onClose={() => (this.dataDoc.hintDialogueOpen = false)}>
                                     <DialogTitle>Hints</DialogTitle>
                                     <DialogContent>
-                                        {this.dataDoc.selectedQuestion.hints?.map((hint: any, index: number) => (
+                                        {this.selectedQuestion.hints?.map((hint: any, index: number) => (
                                             <div key={index}>
                                                 <DialogContentText>
                                                     <details>
@@ -1136,7 +1142,7 @@ export class PhysicsSimulationBox extends ViewBoxAnnotatableComponent<FieldViewP
                                         <p>{StrCast(this.dataDoc.questionPartTwo)}</p>
                                     </div>
                                     <div className="answers">
-                                        {this.dataDoc.selectedQuestion.answerParts.includes('force of gravity') && (
+                                        {this.selectedQuestion.answerParts.includes('force of gravity') && (
                                             <InputField
                                                 label={<p>Gravity magnitude</p>}
                                                 lowerBound={0}
@@ -1147,11 +1153,11 @@ export class PhysicsSimulationBox extends ViewBoxAnnotatableComponent<FieldViewP
                                                 upperBound={50}
                                                 value={NumCast(this.dataDoc.review_GravityMagnitude)}
                                                 showIcon={BoolCast(this.dataDoc.simulation_showIcon)}
-                                                correctValue={NumListCast(this.dataDoc.answers)[this.dataDoc.selectedQuestion.answerParts.indexOf('force of gravity')]}
+                                                correctValue={NumListCast(this.dataDoc.answers)[this.selectedQuestion.answerParts.indexOf('force of gravity')]}
                                                 labelWidth={'7em'}
                                             />
                                         )}
-                                        {this.dataDoc.selectedQuestion.answerParts.includes('angle of gravity') && (
+                                        {this.selectedQuestion.answerParts.includes('angle of gravity') && (
                                             <InputField
                                                 label={<p>Gravity angle</p>}
                                                 lowerBound={0}
@@ -1163,11 +1169,11 @@ export class PhysicsSimulationBox extends ViewBoxAnnotatableComponent<FieldViewP
                                                 value={NumCast(this.dataDoc.review_GravityAngle)}
                                                 radianEquivalent={true}
                                                 showIcon={BoolCast(this.dataDoc.simulation_showIcon)}
-                                                correctValue={NumListCast(this.dataDoc.answers)[this.dataDoc.selectedQuestion.answerParts.indexOf('angle of gravity')]}
+                                                correctValue={NumListCast(this.dataDoc.answers)[this.selectedQuestion.answerParts.indexOf('angle of gravity')]}
                                                 labelWidth={'7em'}
                                             />
                                         )}
-                                        {this.dataDoc.selectedQuestion.answerParts.includes('normal force') && (
+                                        {this.selectedQuestion.answerParts.includes('normal force') && (
                                             <InputField
                                                 label={<p>Normal force magnitude</p>}
                                                 lowerBound={0}
@@ -1178,11 +1184,11 @@ export class PhysicsSimulationBox extends ViewBoxAnnotatableComponent<FieldViewP
                                                 upperBound={50}
                                                 value={NumCast(this.dataDoc.review_NormalMagnitude)}
                                                 showIcon={BoolCast(this.dataDoc.simulation_showIcon)}
-                                                correctValue={NumListCast(this.dataDoc.answers)[this.dataDoc.selectedQuestion.answerParts.indexOf('normal force')]}
+                                                correctValue={NumListCast(this.dataDoc.answers)[this.selectedQuestion.answerParts.indexOf('normal force')]}
                                                 labelWidth={'7em'}
                                             />
                                         )}
-                                        {this.dataDoc.selectedQuestion.answerParts.includes('angle of normal force') && (
+                                        {this.selectedQuestion.answerParts.includes('angle of normal force') && (
                                             <InputField
                                                 label={<p>Normal force angle</p>}
                                                 lowerBound={0}
@@ -1194,11 +1200,11 @@ export class PhysicsSimulationBox extends ViewBoxAnnotatableComponent<FieldViewP
                                                 value={NumCast(this.dataDoc.review_NormalAngle)}
                                                 radianEquivalent={true}
                                                 showIcon={BoolCast(this.dataDoc.simulation_showIcon)}
-                                                correctValue={NumListCast(this.dataDoc.answers)[this.dataDoc.selectedQuestion.answerParts.indexOf('angle of normal force')]}
+                                                correctValue={NumListCast(this.dataDoc.answers)[this.selectedQuestion.answerParts.indexOf('angle of normal force')]}
                                                 labelWidth={'7em'}
                                             />
                                         )}
-                                        {this.dataDoc.selectedQuestion.answerParts.includes('force of static friction') && (
+                                        {this.selectedQuestion.answerParts.includes('force of static friction') && (
                                             <InputField
                                                 label={<p>Static friction magnitude</p>}
                                                 lowerBound={0}
@@ -1209,11 +1215,11 @@ export class PhysicsSimulationBox extends ViewBoxAnnotatableComponent<FieldViewP
                                                 upperBound={50}
                                                 value={NumCast(this.dataDoc.review_StaticMagnitude)}
                                                 showIcon={BoolCast(this.dataDoc.simulation_showIcon)}
-                                                correctValue={NumListCast(this.dataDoc.answers)[this.dataDoc.selectedQuestion.answerParts.indexOf('force of static friction')]}
+                                                correctValue={NumListCast(this.dataDoc.answers)[this.selectedQuestion.answerParts.indexOf('force of static friction')]}
                                                 labelWidth={'7em'}
                                             />
                                         )}
-                                        {this.dataDoc.selectedQuestion.answerParts.includes('angle of static friction') && (
+                                        {this.selectedQuestion.answerParts.includes('angle of static friction') && (
                                             <InputField
                                                 label={<p>Static friction angle</p>}
                                                 lowerBound={0}
@@ -1225,11 +1231,11 @@ export class PhysicsSimulationBox extends ViewBoxAnnotatableComponent<FieldViewP
                                                 value={NumCast(this.dataDoc.review_StaticAngle)}
                                                 radianEquivalent={true}
                                                 showIcon={BoolCast(this.dataDoc.simulation_showIcon)}
-                                                correctValue={NumListCast(this.dataDoc.answers)[this.dataDoc.selectedQuestion.answerParts.indexOf('angle of static friction')]}
+                                                correctValue={NumListCast(this.dataDoc.answers)[this.selectedQuestion.answerParts.indexOf('angle of static friction')]}
                                                 labelWidth={'7em'}
                                             />
                                         )}
-                                        {this.dataDoc.selectedQuestion.answerParts.includes('coefficient of static friction') && (
+                                        {this.selectedQuestion.answerParts.includes('coefficient of static friction') && (
                                             <InputField
                                                 label={
                                                     <Box>
@@ -1245,10 +1251,10 @@ export class PhysicsSimulationBox extends ViewBoxAnnotatableComponent<FieldViewP
                                                 value={NumCast(this.dataDoc.coefficientOfStaticFriction)}
                                                 effect={this.updateReviewForcesBasedOnCoefficient}
                                                 showIcon={BoolCast(this.dataDoc.simulation_showIcon)}
-                                                correctValue={NumListCast(this.dataDoc.answers)[this.dataDoc.selectedQuestion.answerParts.indexOf('coefficient of static friction')]}
+                                                correctValue={NumListCast(this.dataDoc.answers)[this.selectedQuestion.answerParts.indexOf('coefficient of static friction')]}
                                             />
                                         )}
-                                        {this.dataDoc.selectedQuestion.answerParts.includes('wedge angle') && (
+                                        {this.selectedQuestion.answerParts.includes('wedge angle') && (
                                             <InputField
                                                 label={<Box>&theta;</Box>}
                                                 lowerBound={0}
@@ -1264,7 +1270,7 @@ export class PhysicsSimulationBox extends ViewBoxAnnotatableComponent<FieldViewP
                                                 }}
                                                 radianEquivalent={true}
                                                 showIcon={BoolCast(this.dataDoc.simulation_showIcon)}
-                                                correctValue={NumListCast(this.dataDoc.answers)[this.dataDoc.selectedQuestion.answerParts.indexOf('wedge angle')]}
+                                                correctValue={NumListCast(this.dataDoc.answers)[this.selectedQuestion.answerParts.indexOf('wedge angle')]}
                                             />
                                         )}
                                     </div>
@@ -1275,7 +1281,7 @@ export class PhysicsSimulationBox extends ViewBoxAnnotatableComponent<FieldViewP
                             <div className="wordProblemBox">
                                 <div className="question">
                                     <h2>Problem</h2>
-                                    <p>{this.dataDoc.tutorial.question}</p>
+                                    <p>{this.tutorial.question}</p>
                                 </div>
                                 <div
                                     style={{
@@ -1287,32 +1293,32 @@ export class PhysicsSimulationBox extends ViewBoxAnnotatableComponent<FieldViewP
                                         onClick={() => {
                                             let step = NumCast(this.dataDoc.tutorial_stepNumber) - 1;
                                             step = Math.max(step, 0);
-                                            step = Math.min(step, this.dataDoc.tutorial.steps.length - 1);
+                                            step = Math.min(step, this.tutorial.steps.length - 1);
                                             this.dataDoc.tutorial_stepNumber = step;
-                                            this.dataDoc.mass1_forcesStart = this.dataDoc.tutorial.steps[step].forces;
-                                            this.dataDoc.mass1_forcesUpdated = this.dataDoc.tutorial.steps[step].forces;
-                                            this.dataDoc.simulation_showForceMagnitudes = this.dataDoc.tutorial.steps[step].show_Magnitude;
+                                            this.dataDoc.mass1_forcesStart = JSON.stringify(this.tutorial.steps[step].forces);
+                                            this.dataDoc.mass1_forcesUpdated = JSON.stringify(this.tutorial.steps[step].forces);
+                                            this.dataDoc.simulation_showForceMagnitudes = this.tutorial.steps[step].showMagnitude;
                                         }}
                                         disabled={this.dataDoc.tutorial_stepNumber == 0}>
                                         <ArrowLeftIcon />
                                     </IconButton>
                                     <div>
                                         <h3>
-                                            Step {NumCast(this.dataDoc.tutorial_stepNumber) + 1}: {this.dataDoc.tutorial.steps[this.dataDoc.tutorial_stepNumber].description}
+                                            Step {NumCast(this.dataDoc.tutorial_stepNumber) + 1}: {this.tutorial.steps[NumCast(this.dataDoc.tutorial_stepNumber)].description}
                                         </h3>
-                                        <p>{this.dataDoc.tutorial.steps[NumCast(this.dataDoc.tutorial_stepNumber)].content}</p>
+                                        <p>{this.tutorial.steps[NumCast(this.dataDoc.tutorial_stepNumber)].content}</p>
                                     </div>
                                     <IconButton
                                         onClick={() => {
                                             let step = NumCast(this.dataDoc.tutorial_stepNumber) + 1;
                                             step = Math.max(step, 0);
-                                            step = Math.min(step, this.dataDoc.tutorial.steps.length - 1);
+                                            step = Math.min(step, this.tutorial.steps.length - 1);
                                             this.dataDoc.tutorial_stepNumber = step;
-                                            this.dataDoc.mass1_forcesStart = this.dataDoc.tutorial.steps[step].forces;
-                                            this.dataDoc.mass1_forcesUpdated = this.dataDoc.tutorial.steps[step].forces;
-                                            this.dataDoc.simulation_showForceMagnitudes = this.dataDoc.tutorial.steps[step].show_Magnitude;
+                                            this.dataDoc.mass1_forcesStart = JSON.stringify(this.tutorial.steps[step].forces);
+                                            this.dataDoc.mass1_forcesUpdated = JSON.stringify(this.tutorial.steps[step].forces);
+                                            this.dataDoc.simulation_showForceMagnitudes = this.tutorial.steps[step].showMagnitude;
                                         }}
-                                        disabled={this.dataDoc.tutorial_stepNumber === this.dataDoc.tutorial.steps.length - 1}>
+                                        disabled={this.dataDoc.tutorial_stepNumber === this.tutorial.steps.length - 1}>
                                         <ArrowRightIcon />
                                     </IconButton>
                                 </div>