From e621515360811222f67318dd8cc38ac4b07b7e8b Mon Sep 17 00:00:00 2001
From: Philippe Sabourin <philippe.sabourin@gmail.com>
Date: Fri, 14 Jan 2022 16:44:25 -0500
Subject: [PATCH 1/2] Adding keyboard input for the game

---
 src/components/keyboard/Keyboard.tsx | 31 ++++++++++++++++++++++------
 1 file changed, 25 insertions(+), 6 deletions(-)

diff --git a/src/components/keyboard/Keyboard.tsx b/src/components/keyboard/Keyboard.tsx
index 5270e87..5a89f3b 100644
--- a/src/components/keyboard/Keyboard.tsx
+++ b/src/components/keyboard/Keyboard.tsx
@@ -1,6 +1,7 @@
 import { KeyValue } from "../../lib/keyboard";
 import { getStatuses } from "../../lib/statuses";
 import { Key } from "./Key";
+import {useEffect} from "react";
 
 type Props = {
   onChar: (value: string) => void;
@@ -11,18 +12,36 @@ type Props = {
 
 export const Keyboard = ({ onChar, onDelete, onEnter, guesses }: Props) => {
   const charStatuses = getStatuses(guesses);
-  console.log(charStatuses);
 
   const onClick = (value: KeyValue) => {
     if (value === "ENTER") {
-      return onEnter();
+      onEnter();
+    } else if (value === "DELETE") {
+      onDelete();
+    } else {
+      onChar(value);
     }
-    if (value === "DELETE") {
-      return onDelete();
-    }
-    return onChar(value);
   };
 
+  useEffect(() => {
+    const listener = (e:KeyboardEvent) => {
+      if(e.code === "Enter") {
+        onEnter();
+      } else if(e.code === "Backspace") {
+        onDelete();
+      } else {
+        const key = e.key.toUpperCase();
+        if(key.length === 1 && key >= "A" && key <= "Z") {
+          onChar(key);
+        }
+      }
+    };
+    window.addEventListener("keyup", listener);
+    return () => {
+      window.removeEventListener("keyup", listener);
+    };
+  }, [onEnter, onDelete, onChar]);
+
   return (
     <div>
       <div className="flex justify-center mb-1">

From af23046f6b6e312b74ef5495a4003a9e0743d57e Mon Sep 17 00:00:00 2001
From: Hannah Park <70654324+hannahcode@users.noreply.github.com>
Date: Fri, 14 Jan 2022 21:29:48 -0500
Subject: [PATCH 2/2] Update README.md

---
 README.md | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/README.md b/README.md
index bc44d42..1225d9b 100644
--- a/README.md
+++ b/README.md
@@ -2,7 +2,7 @@
 
 - Go play the real Wordle [here](https://www.powerlanguage.co.uk/wordle/)
 - Read the story behind it [here](https://www.nytimes.com/2022/01/03/technology/wordle-word-game-creator.html)
-- Try a demo of this clone project [here](https://61dc4dbf9f2b9d0007925c02--thirsty-hoover-08af60.netlify.app/)
+- Try a demo of this clone project [here](https://wordle.hannahmariepark.com)
 
 _Inspiration:_
 This game is an open source clone of the immensely popular online word guessing game Wordle. Like many others all over the world, I saw the signature pattern of green, yellow, and white squares popping up all over social media and the web and had to check it out. After a few days of play, I decided it would be great for my learning to try to rebuild Wordle in React!