Ensured that FinishCode properly accesses (#271)

the DropDown values without causing issues in checkmark disabling.
uclaacm · Feb 28, 2024 · 8c47de5 · 8c47de5
1 parent 26a3fa2
commit 8c47de5
Show file tree

Hide file tree

Showing 7 changed files with 44 additions and 17 deletions.
diff --git a/src/components/binary-comps/BinaryCode.tsx b/src/components/binary-comps/BinaryCode.tsx
@@ -147,6 +147,7 @@ function BinaryCode(): JSX.Element {
                       handleUpdateAnswer(0, chosenAnswer)
                     }
                     name="binary-drop001"
+                    finish={true}
                   />
                 </>
               </Tab>
@@ -168,6 +169,7 @@ function BinaryCode(): JSX.Element {
                       handleUpdateAnswer(1, chosenAnswer)
                     }
                     name="binary-drop3"
+                    finish={true}
                   />
                 </>
               </Tab>
@@ -187,6 +189,7 @@ function BinaryCode(): JSX.Element {
                       handleUpdateAnswer(2, chosenAnswer)
                     }
                     name="binary-drop4"
+                    finish={true}
                   />
                   {')'}
                 </>
@@ -207,6 +210,7 @@ function BinaryCode(): JSX.Element {
                       handleUpdateAnswer(3, chosenAnswer)
                     }
                     name="binary-drop5"
+                    finish={true}
                   />
                   {')'}
                 </>

diff --git a/src/components/binary-comps/BinarySearchExample.tsx b/src/components/binary-comps/BinarySearchExample.tsx
@@ -107,8 +107,8 @@ export default function BinarySearchExample({
       <br />
       <div>
         {' '}
-        Is the currently highlighted word alphabetically before or after{' '}
-        {answer}?{' '}
+        Does the target word {answer} appear alphabetically before or after the
+        currently highlighted word?
       </div>
       <div
         style={{

diff --git a/src/components/bunny-comps/BunnyCode.tsx b/src/components/bunny-comps/BunnyCode.tsx
@@ -159,6 +159,7 @@ function BunnyCode(): JSX.Element {
                   handleUpdateAnswer(0, chosenAnswer)
                 }
                 name="bunny-drop2"
+                finish={true}
               />
               <br />
               <Tab>
@@ -173,6 +174,7 @@ function BunnyCode(): JSX.Element {
                       handleUpdateAnswer(1, chosenAnswer)
                     }
                     name="bunny-drop3"
+                    finish={true}
                   />
                 </>
               </Tab>
@@ -186,6 +188,7 @@ function BunnyCode(): JSX.Element {
                   handleUpdateAnswer(2, chosenAnswer)
                 }
                 name="bunny-drop4"
+                finish={true}
               />
             </>
           </Tab>

diff --git a/src/components/dining-comps/DiningCode.tsx b/src/components/dining-comps/DiningCode.tsx
@@ -163,6 +163,7 @@ function DiningCode(): JSX.Element {
                       handleUpdateAnswer(0, chosenAnswer)
                     }
                     name="dining-drop1"
+                    finish={true}
                   />
                 </>
               </Tab>
@@ -176,6 +177,7 @@ function DiningCode(): JSX.Element {
                   handleUpdateAnswer(1, chosenAnswer)
                 }
                 name="dining-drop2"
+                finish={true}
               />
               )
               <br />
@@ -189,6 +191,7 @@ function DiningCode(): JSX.Element {
                   handleUpdateAnswer(2, chosenAnswer)
                 }
                 name="dining-drop3"
+                finish={true}
               />
               )
               <br />
@@ -202,6 +205,7 @@ function DiningCode(): JSX.Element {
                   handleUpdateAnswer(3, chosenAnswer)
                 }
                 name="dining-drop4"
+                finish={true}
               />
             </>
           </Tab>

diff --git a/src/components/intro_comps/intro_code.tsx b/src/components/intro_comps/intro_code.tsx
@@ -107,6 +107,7 @@ function IntroCode(): JSX.Element {
               }
               size="medium"
               name="intro-drop1"
+              finish={true}
             />
             :
             <br />
@@ -122,6 +123,7 @@ function IntroCode(): JSX.Element {
                   }
                   size="small"
                   name="intro-drop2"
+                  finish={true}
                 />
               </>
             </Tab>

diff --git a/src/components/mario-comps/MarioCode.tsx b/src/components/mario-comps/MarioCode.tsx
@@ -587,6 +587,7 @@ function MarioCode(): JSX.Element {
                 handleUpdateAnswer(0, chosenAnswer)
               }
               name="mario-drop2"
+              finish={true}
             />{' '}
             :
             <Tab>
@@ -601,6 +602,7 @@ function MarioCode(): JSX.Element {
                     handleUpdateAnswer(1, chosenAnswer)
                   }
                   name="mario-drop3"
+                  finish={true}
                 />
               </>
             </Tab>
@@ -614,6 +616,7 @@ function MarioCode(): JSX.Element {
                 handleUpdateAnswer(2, chosenAnswer)
               }
               name="mario-drop4"
+              finish={true}
             />
             + <Gold>recurSum</Gold>(
             <MarioDropdown
@@ -625,6 +628,7 @@ function MarioCode(): JSX.Element {
                 handleUpdateAnswer(3, chosenAnswer)
               }
               name="mario-drop5"
+              finish={true}
             />
             )
           </>

diff --git a/src/components/shared/Dropdown.tsx b/src/components/shared/Dropdown.tsx
@@ -13,6 +13,7 @@ interface DropdownProps {
   answer: string;
   update_answer: any;
   name: string;
+  finish?: boolean;
 }
 
 function Dropdown(props: DropdownProps): JSX.Element {
@@ -47,27 +48,36 @@ function Dropdown(props: DropdownProps): JSX.Element {
   const handleChange = (selectedOption: any) => {
     const chosenAnswer = selectedOption.value;
 
-    if (correctAnswers === undefined) {
+    if (
+      (props.finish && props.correct_answer === undefined) ||
+      (!props.finish && correctAnswers === undefined)
+    ) {
       // Code the Components Together dropdown
       props.update_answer(chosenAnswer);
     } else {
       // KhanCard dropdown
+      if (props.finish) {
+        const newArray2 = props.correct_answer.map((val, i) => {
+          if (i == props.index) return props.answer === chosenAnswer;
+          else return val;
+        });
+        props.update_answer(newArray2);
+      } else {
+        const newArray = correctAnswers.map((val, i) => {
+          if (chosenAnswer === '' || chosenAnswer === null) {
+            //return null;
+            return false;
+          }
 
-      const newArray = correctAnswers.map((val, i) => {
-        if (chosenAnswer === '' || chosenAnswer === null) {
-          return null;
-        }
-
-        if (i == props.index) {
-          return props.answer === chosenAnswer;
-        } else {
-          return val;
-        }
-      });
-
-      setCorrectAnswers(newArray);
+          if (i == props.index) {
+            return props.answer === chosenAnswer;
+          } else {
+            return val;
+          }
+        });
+        setCorrectAnswers(newArray);
+      }
     }
-
     setSelectedValue(chosenAnswer);
   };