adding the phase

now, numbers can correctly set

Author: BrandonTheBusyBeaver117

src/components/Scout.jsx

@@ -175,8 +175,8 @@ const Scout = () => {
           <>
            <Toggle prop="scoreTrap" phase label="Score Trap" trueLabel = "Scored Trap" color="green" width="fiveTwelfths" height="twoHigh"></Toggle>
            <Toggle prop="harmonize" phase label="Harmonize" trueLabel = "Harmonized" color="yellow" width={"fiveTwelfths"} height="twoHigh"></Toggle>
-              <Toggle prop="park" phase label="Park" trueLabel = "Parked" color="purple" width={"fiveTwelfths"} height="twoHigh"></Toggle>
-           <Numbers label="Climb Time of start (secs)" idealLength = {2} prop="climbTimeOfStart" width = "fiveTwelfths" twoLines={false} height = "twoHigh"></Numbers>
+           <Toggle prop="park" phase label="Park" trueLabel = "Parked" color="purple" width={"fiveTwelfths"} height="twoHigh"></Toggle>
+           <Numbers label="Climb Time of start (secs)" phase idealLength = {2} prop="climbTimeOfStart" width = "fiveTwelfths" twoLines={false} height = "twoHigh"></Numbers>
            <Undo width = "fiveTwelfths" height = "twoHigh"></Undo>
 
               <Next width ="fiveTwelfths" height = "twoHigh"></Next>

src/components/inputs/Numbers.jsx

@@ -1,53 +1,53 @@
-import React, { useContext } from "react"
-import { Context } from "../../state"
-import PropTypes from "prop-types"
-
-import "./inputs.scss"
-
-const Numbers = ({ label, prop, idealLength = 4, width, twoLines, height }) => {
-  
-  const [state, dispatch] = useContext(Context)
-  const id = `Numbers-${label}-${prop}`.replaceAll(" ", "_")
-
-  const numberInputComponent = <>
-    <label htmlFor={id} className={`${twoLines ? "default" : ""}`}>
-        {label}
-      </label>
-      <input
-        id={id}
-        type="number"
-        pattern="[0-9]*"
-        placeholder={"0".repeat(idealLength)}
-        autoComplete="off"
-        className={`${width ? width : "wide"}`}
-        onChange={(event) => {
-          dispatch({
-            type: "set",
-            prop,
-            val: !(
-              event.target.value === undefined || event.target.value === ""
-            )
-              ? parseInt(event.target.value)
-              : undefined,
-          })
-        }}
-        value={state[prop] ?? ""}
-      />
-  </>
-
-  return twoLines ? numberInputComponent : (
-    <div className={`Numbers ${ width ? width :"wide"} ${height}`}>
-     {numberInputComponent}
-    </div>
-  )
-}
-
-Numbers.propTypes = {
-  label: PropTypes.string.isRequired,
-  prop: PropTypes.string.isRequired,
-  idealLength: PropTypes.number,
-  width: PropTypes.string,
-  twoLines: PropTypes.bool,
-}
-
-export default Numbers
+import React, { useContext } from "react"
+import { Context } from "../../state"
+import PropTypes from "prop-types"
+
+import "./inputs.scss"
+
+const Numbers = ({ label, prop, phase, idealLength = 4, width, twoLines, height }) => {
+  
+  const [state, dispatch] = useContext(Context)
+  const id = `Numbers-${label}-${prop}`.replaceAll(" ", "_")
+
+  const numberInputComponent = <>
+    <label htmlFor={id} className={`${twoLines ? "default" : ""}`}>
+        {label}
+      </label>
+      <input
+        id={id}
+        type="number"
+        pattern="[0-9]*"
+        placeholder={"0".repeat(idealLength)}
+        autoComplete="off"
+        className={`${width ? width : "wide"}`}
+        onChange={(event) => {
+          dispatch({
+            type: `set${phase ? "InPhase" : ""}`,
+            prop,
+            val: !(
+              event.target.value === undefined || event.target.value === ""
+            )
+              ? parseInt(event.target.value)
+              : undefined,
+          })
+        }}
+        value={state[prop] ?? ""}
+      />
+  </>
+
+  return twoLines ? numberInputComponent : (
+    <div className={`Numbers ${ width ? width :"wide"} ${height}`}>
+     {numberInputComponent}
+    </div>
+  )
+}
+
+Numbers.propTypes = {
+  label: PropTypes.string.isRequired,
+  prop: PropTypes.string.isRequired,
+  idealLength: PropTypes.number,
+  width: PropTypes.string,
+  twoLines: PropTypes.bool,
+}
+
+export default Numbers