ISSUE andrewagain#55 bug-fix

src/component/App.js

@@ -2,6 +2,7 @@ import React from "react";
 import Display from "./Display";
 import ButtonPanel from "./ButtonPanel";
 import calculate from "../logic/calculate";
+import { validKeys } from "./ValidKeys";
 import "./App.css";
 
 export default class App extends React.Component {
@@ -19,9 +20,21 @@ export default class App extends React.Component {
     this.setState(calculate(this.state, buttonName));
   };
 
+  // ISSUE #55 doesn't support key presses
+  handleKeyPress = keyEvent => {
+    const key = validKeys.find(k => k.charCode === keyEvent.charCode);
+    if (key) {
+      this.setState(calculate(this.state, key.name));
+    }
+  };
+
   render() {
     return (
-      <div className="component-app">
+      <div
+        tabIndex="0"
+        onKeyPress={this.handleKeyPress}
+        className="component-app"
+      >
         <Display value={this.state.next || this.state.total || "0"} />
         <ButtonPanel clickHandler={this.handleClick} />
       </div>

src/component/ValidKeys.js

@@ -0,0 +1,19 @@
+export const validKeys = [
+  { name: "0", charCode: 48 },
+  { name: "1", charCode: 49 },
+  { name: "2", charCode: 50 },
+  { name: "3", charCode: 51 },
+  { name: "4", charCode: 52 },
+  { name: "5", charCode: 53 },
+  { name: "6", charCode: 54 },
+  { name: "7", charCode: 55 },
+  { name: "8", charCode: 56 },
+  { name: "9", charCode: 57 },
+  { name: ".", charCode: 46 },
+  { name: "=", charCode: 13 },
+  { name: "+", charCode: 43 },
+  { name: "-", charCode: 45 },
+  { name: "x", charCode: 42 },
+  { name: "÷", charCode: 47 },
+  { name: "%", charCode: 53 },
+];

src/logic/calculate.js

@@ -11,6 +11,9 @@ import isNumber from "./isNumber";
  *   total:String      the running total
  *   next:String       the next number to be operated on with the total
  *   operation:String  +, -, etc.
+ *  *   higherOder:Object
+ *      next:String    the next number to be operated on with the total
+ *      operation:String x, ÷, etc.
  */
 export default function calculate(obj, buttonName) {
   if (buttonName === "AC") {