few more event key. constant refactors

src/Infiltration/ui/BackwardGame.tsx

@@ -7,6 +7,7 @@ import { random } from "../utils";
 import { interpolate } from "./Difficulty";
 import { BlinkingCursor } from "./BlinkingCursor";
 import Typography from "@mui/material/Typography";
+import { KEY } from "../../utils/helpers/keyCodes";
 
 interface Difficulty {
   [key: string]: number;
@@ -36,7 +37,7 @@ export function BackwardGame(props: IMinigameProps): React.ReactElement {
 
   function press(this: Document, event: KeyboardEvent): void {
     event.preventDefault();
-    if (event.key === "Backspace") return;
+    if (event.key === KEY.BACKSPACE) return;
     const nextGuess = guess + event.key.toUpperCase();
     if (!answer.startsWith(nextGuess)) props.onFailure();
     else if (answer === nextGuess) props.onSuccess();

src/Infiltration/ui/BracketGame.tsx

@@ -7,6 +7,7 @@ import { random } from "../utils";
 import { interpolate } from "./Difficulty";
 import { BlinkingCursor } from "./BlinkingCursor";
 import Typography from "@mui/material/Typography";
+import { KEY } from "../../utils/helpers/keyCodes";
 
 interface Difficulty {
   [key: string]: number;
@@ -29,28 +30,29 @@ const difficulties: {
 
 function generateLeftSide(difficulty: Difficulty): string {
   let str = "";
+  const options = [KEY.OPEN_BRACKET, KEY.LESS_THAN, KEY.OPEN_PARENTHESIS, KEY.OPEN_BRACE];
   const length = random(difficulty.min, difficulty.max);
   for (let i = 0; i < length; i++) {
-    str += ["[", "<", "(", "{"][Math.floor(Math.random() * 4)];
+    str += options[Math.floor(Math.random() * 4)];
   }
 
   return str;
 }
 
 function getChar(event: KeyboardEvent): string {
-  if (event.key === ")") return ")";
-  if (event.key === "]") return "]";
-  if (event.key === "}") return "}";
-  if (event.key === ">") return ">";
+  if (event.key === KEY.CLOSE_PARENTHESIS) return KEY.CLOSE_PARENTHESIS;
+  if (event.key === KEY.CLOSE_BRACKET) return KEY.CLOSE_BRACKET;
+  if (event.key === KEY.CLOSE_BRACE) return KEY.CLOSE_BRACE;
+  if (event.key === KEY.GREATER_THAN) return KEY.GREATER_THAN;
   return "";
 }
 
 function match(left: string, right: string): boolean {
   return (
-    (left === "[" && right === "]") ||
-    (left === "<" && right === ">") ||
-    (left === "(" && right === ")") ||
-    (left === "{" && right === "}")
+    (left === KEY.OPEN_BRACKET && right === KEY.CLOSE_BRACKET) ||
+    (left === KEY.LESS_THAN && right === KEY.GREATER_THAN) ||
+    (left === KEY.OPEN_PARENTHESIS && right === KEY.CLOSE_PARENTHESIS) ||
+    (left === KEY.OPEN_BRACE && right === KEY.CLOSE_BRACE)
   );
 }
 

src/Infiltration/ui/BribeGame.tsx

@@ -5,6 +5,8 @@ import { KeyHandler } from "./KeyHandler";
 import { GameTimer } from "./GameTimer";
 import { interpolate } from "./Difficulty";
 import Typography from "@mui/material/Typography";
+import { KEY } from "../../utils/helpers/keyCodes";
+import { downArrowSymbol, upArrowSymbol } from "../utils";
 
 interface Difficulty {
   [key: string]: number;
@@ -34,15 +36,15 @@ export function BribeGame(props: IMinigameProps): React.ReactElement {
   function press(this: Document, event: KeyboardEvent): void {
     event.preventDefault();
     const k = event.key;
-    if (k === " ") {
+    if (k === KEY.SPACE) {
       if (positive.includes(choices[index])) props.onSuccess();
       else props.onFailure();
       return;
     }
 
     let newIndex = index;
-    if (["ArrowUp", "w", "ArrowRight", "d"].includes(k)) newIndex++;
-    if (["ArrowDown", "s", "ArrowLeft", "a"].includes(k)) newIndex--;
+    if ([KEY.UP_ARROW, KEY.W, KEY.RIGHT_ARROW, KEY.D].map((key) => key as string).includes(k)) newIndex++;
+    if ([KEY.DOWN_ARROW, KEY.S, KEY.LEFT_ARROW, KEY.A].map((key) => key as string).includes(k)) newIndex--;
     while (newIndex < 0) newIndex += choices.length;
     while (newIndex > choices.length - 1) newIndex -= choices.length;
     setIndex(newIndex);
@@ -57,13 +59,13 @@ export function BribeGame(props: IMinigameProps): React.ReactElement {
       </Grid>
       <Grid item xs={6}>
         <Typography variant="h5" color="primary">
-          ↑
+          {upArrowSymbol}
         </Typography>
         <Typography variant="h5" color="primary">
           {choices[index]}
         </Typography>
         <Typography variant="h5" color="primary">
-          ↓
+          {downArrowSymbol}
         </Typography>
       </Grid>
     </Grid>

src/Infiltration/ui/CheatCodeGame.tsx

@@ -3,7 +3,7 @@ import Grid from "@mui/material/Grid";
 import { IMinigameProps } from "./IMinigameProps";
 import { KeyHandler } from "./KeyHandler";
 import { GameTimer } from "./GameTimer";
-import { random, getArrow } from "../utils";
+import { random, getArrow, rightArrowSymbol, leftArrowSymbol, upArrowSymbol, downArrowSymbol } from "../utils";
 import { interpolate } from "./Difficulty";
 import Typography from "@mui/material/Typography";
 
@@ -56,7 +56,7 @@ export function CheatCodeGame(props: IMinigameProps): React.ReactElement {
 }
 
 function generateCode(difficulty: Difficulty): string {
-  const arrows = ["←", "→", "↑", "↓"];
+  const arrows = [leftArrowSymbol, rightArrowSymbol, upArrowSymbol, downArrowSymbol];
   let code = "";
   for (let i = 0; i < random(difficulty.min, difficulty.max); i++) {
     let arrow = arrows[Math.floor(4 * Math.random())];

src/Infiltration/ui/Cyberpunk2077Game.tsx

@@ -4,8 +4,9 @@ import { IMinigameProps } from "./IMinigameProps";
 import { KeyHandler } from "./KeyHandler";
 import { GameTimer } from "./GameTimer";
 import { interpolate } from "./Difficulty";
-import { getArrow } from "../utils";
+import { downArrowSymbol, getArrow, leftArrowSymbol, rightArrowSymbol, upArrowSymbol } from "../utils";
 import Typography from "@mui/material/Typography";
+import { KEY } from "../../utils/helpers/keyCodes";
 
 interface Difficulty {
   [key: string]: number;
@@ -41,16 +42,16 @@ export function Cyberpunk2077Game(props: IMinigameProps): React.ReactElement {
     const move = [0, 0];
     const arrow = getArrow(event);
     switch (arrow) {
-      case "↑":
+      case upArrowSymbol:
         move[1]--;
         break;
-      case "←":
+      case leftArrowSymbol:
         move[0]--;
         break;
-      case "↓":
+      case downArrowSymbol:
         move[1]++;
         break;
-      case "→":
+      case rightArrowSymbol:
         move[0]++;
         break;
     }
@@ -59,7 +60,7 @@ export function Cyberpunk2077Game(props: IMinigameProps): React.ReactElement {
     next[1] = (next[1] + grid.length) % grid.length;
     setPos(next);
 
-    if (event.key === " ") {
+    if (event.key === KEY.SPACE) {
       const selected = grid[pos[1]][pos[0]];
       const expected = answer[index];
       if (selected !== expected) {

src/Infiltration/ui/MinesweeperGame.tsx

@@ -4,8 +4,9 @@ import { IMinigameProps } from "./IMinigameProps";
 import { KeyHandler } from "./KeyHandler";
 import { GameTimer } from "./GameTimer";
 import { interpolate } from "./Difficulty";
-import { getArrow } from "../utils";
+import { downArrowSymbol, getArrow, leftArrowSymbol, rightArrowSymbol, upArrowSymbol } from "../utils";
 import Typography from "@mui/material/Typography";
+import { KEY } from "../../utils/helpers/keyCodes";
 
 interface Difficulty {
   [key: string]: number;
@@ -42,16 +43,16 @@ export function MinesweeperGame(props: IMinigameProps): React.ReactElement {
     const move = [0, 0];
     const arrow = getArrow(event);
     switch (arrow) {
-      case "↑":
+      case upArrowSymbol:
         move[1]--;
         break;
-      case "←":
+      case leftArrowSymbol:
         move[0]--;
         break;
-      case "↓":
+      case downArrowSymbol:
         move[1]++;
         break;
-      case "→":
+      case rightArrowSymbol:
         move[0]++;
         break;
     }
@@ -60,7 +61,7 @@ export function MinesweeperGame(props: IMinigameProps): React.ReactElement {
     next[1] = (next[1] + minefield.length) % minefield.length;
     setPos(next);
 
-    if (event.key == " ") {
+    if (event.key == KEY.SPACE) {
       if (!minefield[pos[1]][pos[0]]) {
         props.onFailure();
         return;

src/Infiltration/ui/SlashGame.tsx

@@ -5,6 +5,7 @@ import { KeyHandler } from "./KeyHandler";
 import { GameTimer } from "./GameTimer";
 import { interpolate } from "./Difficulty";
 import Typography from "@mui/material/Typography";
+import { KEY } from "../../utils/helpers/keyCodes";
 
 interface Difficulty {
   [key: string]: number;
@@ -30,7 +31,7 @@ export function SlashGame(props: IMinigameProps): React.ReactElement {
 
   function press(this: Document, event: KeyboardEvent): void {
     event.preventDefault();
-    if (event.key !== " ") return;
+    if (event.key !== KEY.SPACE) return;
     if (phase !== 2) {
       props.onFailure();
     } else {

src/Infiltration/ui/WireCuttingGame.tsx

@@ -6,6 +6,7 @@ import { KeyHandler } from "./KeyHandler";
 import { GameTimer } from "./GameTimer";
 import { random } from "../utils";
 import { interpolate } from "./Difficulty";
+import { KEY } from "../../utils/helpers/keyCodes";
 
 interface Difficulty {
   [key: string]: number;
@@ -27,7 +28,7 @@ const difficulties: {
   Impossible: { timer: 4000, wiresmin: 9, wiresmax: 9, rules: 4 },
 };
 
-const types = ["|", ".", "/", "-", "█", "#"];
+const types = [KEY.PIPE, KEY.DOT, KEY.FORWARD_SLASH, KEY.HYPHEN, "█", KEY.HASH];
 
 const colors = ["red", "#FFC107", "blue", "white"];
 
@@ -61,6 +62,10 @@ export function WireCuttingGame(props: IMinigameProps): React.ReactElement {
   const [cutWires, setCutWires] = useState(new Array(wires.length).fill(false));
   const [questions] = useState(generateQuestion(wires, difficulty));
 
+  function checkWire(wireNum: number): boolean {
+    return questions.some((q) => q.shouldCut(wires[wireNum - 1], wireNum - 1));
+  }
+
   function press(this: Document, event: KeyboardEvent): void {
     event.preventDefault();
     const wireNum = parseInt(event.key);
@@ -69,7 +74,7 @@ export function WireCuttingGame(props: IMinigameProps): React.ReactElement {
     setCutWires((old) => {
       const next = [...old];
       next[wireNum - 1] = true;
-      if (!questions.some((q) => q.shouldCut(wires[wireNum - 1], wireNum - 1))) {
+      if (checkWire(wireNum)) {
         props.onFailure();
       }