Merge branch 'feat/2023offseason' into main

package.json

@@ -1,7 +1,7 @@
 {
   "name": "scout",
   "version": "2.0.0",
-  "csvApi": 3,
+  "csvApi": 4,
   "homepage": "/",
   "private": false,
   "dependencies": {

src/components/Panels.scss

@@ -13,7 +13,7 @@
   & .Tabs > .Tab {
     min-height: 0px;
     margin: 0px;
-    font-size: 1rem;
+    font-size: 1.6rem;
   }
   & .version {
     display: flex;

src/components/Scout.jsx

@@ -8,6 +8,7 @@ import Undo from "./inputs/Undo"
 import Info from "./inputs/Info"
 import Bool from "./inputs/Bool"
 import Numbers from "./inputs/Numbers"
+import Dropdown from "./inputs/Dropdown"
 
 import Count from "./inputs/Count"
 
@@ -80,8 +81,22 @@ const Scout = () => {
       </div>
       {phaseTabContent}
 
-      <Undo wide = {!showNext}></Undo>
+      <Undo wide = {false}></Undo>
+      {!showNext && (
+              <Dropdown
+              phase = {true}
+              wide = {false}
+              center = {true}
+              prop="chargeStation"
+              options={[
+                {label: "None", value: "None"}, 
+                {label: "Docked", value: "Docked"}, 
+                {label: "Engaged", value: "Engaged"}
+              ]}
+            ></Dropdown>
+      )}
       {showNext && <Next width ="halfWide"></Next>}
+
     </>
   )
 }

src/components/inputs/Dropdown.jsx

@@ -1,8 +1,10 @@
 import React, { useContext, useMemo } from "react"
 import { Context } from "../../state"
 import PropTypes from "prop-types"
+import "./inputs.scss"
 
-const Dropdown = ({prop, phase, wide, options}) => {
+
+const Dropdown = ({prop, phase, wide, center, options}) => {
   const [state, dispatch] = useContext(Context)
   const optionsElems = useMemo(
     () =>
@@ -15,8 +17,11 @@ const Dropdown = ({prop, phase, wide, options}) => {
     )
   return (
     <select
-      className={wide ? "wide" : ""}
+      className={(wide ? " wide " : " halfWide ") + (center ? " center " : "")}
       onChange={(event) => {
+
+        console.log("phase:" + phase + " prop:" + prop + " val:" + event.target.value)
+
         dispatch({
           type: `set${phase ? "InPhase" : ""}`,
           prop,
@@ -39,6 +44,7 @@ Dropdown.propTypes = {
   prop: PropTypes.string.isRequired,
   phase: PropTypes.bool,
   wide: PropTypes.bool,
+  center: PropTypes.bool
 }
 
 export default Dropdown

src/components/inputs/Grid.jsx

@@ -16,7 +16,7 @@ const Grid = ({width}) => (
 )
 
 Grid.propTypes = {
-  width: PropTypes.oneOf(["default", "halfWide", "wide"])
+  width: PropTypes.oneOf(["default", "halfWide", "twoThirds", "wide"])
 }
 
 export default Grid

src/components/inputs/Next.jsx

@@ -15,7 +15,7 @@ const Next = ({ width, tall, qualitative, isDisabled = false, disabledText = ""
         dispatch({ type: qualitative ? "next_qualitative_mode" : "next_mode" })        
       }}
     >
-    <p>{isDisabled ? disabledText : ""}</p>
+    {isDisabled && <p>{disabledText}</p>}
       NEXT
     </button>
   )

src/components/inputs/inputs.scss

@@ -121,6 +121,7 @@ input[type="number"],
 input[type="text"],
 textarea {
   padding: 2px 2vw;
+  font-size: max(16px, 1.6rem);
 }
 
 p,
@@ -215,4 +216,8 @@ div.TripleTeamSelector {
     // scss thinks we want pre-compile min so we need to bypass it
     flex-basis: unquote("min(25vw, 100px)");
   }
+}
+
+.center {
+  text-align: center;
 }

src/reducer.js

@@ -36,9 +36,7 @@ export const initialState = {
   matchNum: undefined,
   phase: "auto", //auto, teleop, endgame
   auto: {
-    mobility: false,
-    docked: false,
-    engaged: false,
+    chargeStation: "None",
     ...grid,
   },
   teleop: {