From ac0c0f1558937117378cff1c7daaed0c7c6cc9bc Mon Sep 17 00:00:00 2001
From: Daniel Kao <dack8@outlook.com>
Date: Mon, 26 Feb 2024 17:57:41 -0800
Subject: [PATCH 1/3] make select the default, make people select an answer

---
 src/components/RunCode.tsx    |  7 ++++---
 src/components/SelectCode.tsx |  7 ++++++-
 src/pages/Exercise2.tsx       | 27 +++++++++++++++++++++++++++
 src/styles/SelectCode.scss    |  2 +-
 4 files changed, 38 insertions(+), 5 deletions(-)

diff --git a/src/components/RunCode.tsx b/src/components/RunCode.tsx
index af976bf1..c7a7fb25 100644
--- a/src/components/RunCode.tsx
+++ b/src/components/RunCode.tsx
@@ -28,6 +28,7 @@ const RunCode: React.FC<RunCodeProps> = ({
   const [selections, setSelections] = useState<string[]>([]);
   const [answers, setAnswers] = useState<Array<boolean | null>>([]);
   const [alert, setAlert] = useState(false);
+  const unanswered = 'Please select an answer';
 
   const alertFunction = () => {
     setAlert(true);
@@ -40,8 +41,8 @@ const RunCode: React.FC<RunCodeProps> = ({
     if (selections.length == 0) {
       const tempArr: string[] = [];
       const ansArr: Array<boolean | null> = [];
-      questions.forEach((question) => {
-        tempArr.push(question.options[0]);
+      questions.forEach(() => {
+        tempArr.push('');
         ansArr.push(null);
       });
       setSelections(tempArr);
@@ -123,7 +124,7 @@ const RunCode: React.FC<RunCodeProps> = ({
                 />
               </svg>
               <p style={{ color: answers[index] ? '#31A74B' : '#a80000' }}>
-                {question.answerText.get(selections[index])}
+                {selections[index] == '' ? unanswered : question.answerText.get(selections[index])}
               </p>
               <div style={{ display: answers[index] ? 'flex' : 'none' }}>
                 <CopyToClipboard
diff --git a/src/components/SelectCode.tsx b/src/components/SelectCode.tsx
index 6e74a5a9..bb307b53 100644
--- a/src/components/SelectCode.tsx
+++ b/src/components/SelectCode.tsx
@@ -12,7 +12,7 @@ interface SelectCodeProps {
 }
 
 const SelectCode: React.FC<SelectCodeProps> = ({ choices, handleClick }) => {
-  const [display, setDisplay] = useState(choices[0] || '');
+  const [display, setDisplay] = useState('');
 
   const handleChange = (e: SelectChangeEvent) => {
     setDisplay(e.target.value);
@@ -29,6 +29,11 @@ const SelectCode: React.FC<SelectCodeProps> = ({ choices, handleClick }) => {
           inputProps={{ 'aria-label': 'Without label' }}
           className="select-input"
         >
+          <MenuItem value=''>
+            <pre>
+              <code>Select</code>
+            </pre>
+          </MenuItem>
           {choices.map((choice, index) => (
             <MenuItem
               value={choice}
diff --git a/src/pages/Exercise2.tsx b/src/pages/Exercise2.tsx
index 24ac729c..7cffc032 100644
--- a/src/pages/Exercise2.tsx
+++ b/src/pages/Exercise2.tsx
@@ -65,6 +65,33 @@ const questions2 = [
       ],
     ]),
   },
+  {
+    options: [
+      'char &ptr = *x;',
+      'string *ptr = &x;',
+      'string *ptr = *x;',
+      'char *ptr = &x;',
+    ],
+    answers: ['string *ptr = &x;', 'char *ptr = &x;'],
+    answerText: new Map([
+      [
+        'char &ptr = *x;',
+        'Not quite. Remember that the & operator is used to declare a reference before the equal sign and that the * operator after the equal sign dereferences a variable, meaning that you would try to find the value at memory address 3!',
+      ],
+      [
+        'string *ptr = &x;',
+        'Correct! You can actually declare it as either a char or string pointer.',
+      ],
+      [
+        'string *ptr = *x;',
+        'Not quite. Remember that the * operator after the equal sign dereferences a variable, meaning that you would try to find the value at memory address 3!',
+      ],
+      [
+        'char *ptr = &x;',
+        'Correct! You can actually declare it as either a char or string pointer.',
+      ],
+    ]),
+  }
 ];
 
 const questions3 = [
diff --git a/src/styles/SelectCode.scss b/src/styles/SelectCode.scss
index a67ef484..def9adf5 100644
--- a/src/styles/SelectCode.scss
+++ b/src/styles/SelectCode.scss
@@ -6,7 +6,7 @@
   font-family: $niramit;
   font-size: 1.6vw;
   height: fit-content;
-  width: fit-content;
+  width: 70%;
 
   @media (max-width: 600px) {
     font-size: 4vw;

From dad0bb11760e88b508668f8571e3f1ed08e20914 Mon Sep 17 00:00:00 2001
From: Daniel Kao <dack8@outlook.com>
Date: Mon, 26 Feb 2024 17:59:20 -0800
Subject: [PATCH 2/3] fix lint

---
 src/components/RunCode.tsx    | 4 +++-
 src/components/SelectCode.tsx | 2 +-
 src/pages/Exercise2.tsx       | 2 +-
 3 files changed, 5 insertions(+), 3 deletions(-)

diff --git a/src/components/RunCode.tsx b/src/components/RunCode.tsx
index c7a7fb25..d2630787 100644
--- a/src/components/RunCode.tsx
+++ b/src/components/RunCode.tsx
@@ -124,7 +124,9 @@ const RunCode: React.FC<RunCodeProps> = ({
                 />
               </svg>
               <p style={{ color: answers[index] ? '#31A74B' : '#a80000' }}>
-                {selections[index] == '' ? unanswered : question.answerText.get(selections[index])}
+                {selections[index] == ''
+                  ? unanswered
+                  : question.answerText.get(selections[index])}
               </p>
               <div style={{ display: answers[index] ? 'flex' : 'none' }}>
                 <CopyToClipboard
diff --git a/src/components/SelectCode.tsx b/src/components/SelectCode.tsx
index bb307b53..56d9aa4f 100644
--- a/src/components/SelectCode.tsx
+++ b/src/components/SelectCode.tsx
@@ -29,7 +29,7 @@ const SelectCode: React.FC<SelectCodeProps> = ({ choices, handleClick }) => {
           inputProps={{ 'aria-label': 'Without label' }}
           className="select-input"
         >
-          <MenuItem value=''>
+          <MenuItem value="">
             <pre>
               <code>Select</code>
             </pre>
diff --git a/src/pages/Exercise2.tsx b/src/pages/Exercise2.tsx
index 7cffc032..b89823d1 100644
--- a/src/pages/Exercise2.tsx
+++ b/src/pages/Exercise2.tsx
@@ -91,7 +91,7 @@ const questions2 = [
         'Correct! You can actually declare it as either a char or string pointer.',
       ],
     ]),
-  }
+  },
 ];
 
 const questions3 = [

From 241c296377b72b9c581b2ea6af3bf599cc9dd01d Mon Sep 17 00:00:00 2001
From: Daniel Kao <dack8@outlook.com>
Date: Mon, 26 Feb 2024 18:03:28 -0800
Subject: [PATCH 3/3] add hint

---
 src/pages/Exercise2.tsx | 5 ++++-
 1 file changed, 4 insertions(+), 1 deletion(-)

diff --git a/src/pages/Exercise2.tsx b/src/pages/Exercise2.tsx
index b89823d1..d1137e12 100644
--- a/src/pages/Exercise2.tsx
+++ b/src/pages/Exercise2.tsx
@@ -157,7 +157,10 @@ const Exercise2: FC = () => {
           <div className="exercise-2-diagram">
             <img src={Exercise2Diagram2} alt="Exercise 2 Diagram" />
           </div>
-          <h2>How do we create a pointer to the basketball string?</h2>
+          <h2>
+            How do we create a pointer to the basketball string? (Hint: there
+            are 2 answers here!)
+          </h2>
           <div className="exercise2-div">
             <RunCode
               questions={questions2}