diff --git a/src/App.tsx b/src/App.tsx
index bb57c2a..4d52b26 100644
--- a/src/App.tsx
+++ b/src/App.tsx
@@ -45,7 +45,12 @@ function App() {
return (
-
+
setIsWinModalOpen(false)}
diff --git a/src/components/keyboard/Key.tsx b/src/components/keyboard/Key.tsx
index 535d5e6..d40f4a2 100644
--- a/src/components/keyboard/Key.tsx
+++ b/src/components/keyboard/Key.tsx
@@ -1,13 +1,14 @@
import { ReactNode } from "react";
import classnames from "classnames";
-import { CharStatus, CharValue } from "../../lib/keyboard";
+import { KeyValue } from "../../lib/keyboard";
+import { CharStatus } from "../../lib/statuses";
type Props = {
- children: ReactNode;
- value: CharValue;
+ children?: ReactNode;
+ value: KeyValue;
width?: number;
status?: CharStatus;
- onClick: (value: CharValue) => void;
+ onClick: (value: KeyValue) => void;
};
export const Key = ({
@@ -35,7 +36,7 @@ export const Key = ({
className={classes}
onClick={() => onClick(value)}
>
- {children}
+ {children || value}
);
};
diff --git a/src/components/keyboard/Keyboard.tsx b/src/components/keyboard/Keyboard.tsx
index b2954a4..5270e87 100644
--- a/src/components/keyboard/Keyboard.tsx
+++ b/src/components/keyboard/Keyboard.tsx
@@ -1,113 +1,66 @@
-import { CharValue } from "../../lib/keyboard";
+import { KeyValue } from "../../lib/keyboard";
+import { getStatuses } from "../../lib/statuses";
import { Key } from "./Key";
type Props = {
onChar: (value: string) => void;
onDelete: () => void;
onEnter: () => void;
+ guesses: string[];
};
-export const Keyboard = (props: Props) => {
- const onClick = (value: CharValue) => {
+export const Keyboard = ({ onChar, onDelete, onEnter, guesses }: Props) => {
+ const charStatuses = getStatuses(guesses);
+ console.log(charStatuses);
+
+ const onClick = (value: KeyValue) => {
if (value === "ENTER") {
- return props.onEnter();
+ return onEnter();
}
if (value === "DELETE") {
- return props.onDelete();
+ return onDelete();
}
- return props.onChar(value);
+ return onChar(value);
};
return (
-
- Q
-
-
- W
-
-
- E
-
-
- R
-
-
- T
-
-
- Y
-
-
- U
-
-
- I
-
-
- O
-
-
- P
-
+
+
+
+
+
+
+
+
+
+
-
- A
-
-
- S
-
-
- D
-
-
- F
-
-
- G
-
-
- H
-
-
- J
-
-
- K
-
-
- L
-
+
+
+
+
+
+
+
+
+
- ENTER
-
-
- Z
-
-
- X
-
-
- C
-
-
- V
-
-
- B
-
-
- N
-
-
- M
+ Enter
+
+
+
+
+
+
+
- DELETE
+ Delete
diff --git a/src/lib/keyboard.ts b/src/lib/keyboard.ts
index 719f950..b3653fb 100644
--- a/src/lib/keyboard.ts
+++ b/src/lib/keyboard.ts
@@ -1,31 +1,3 @@
-export type CharStatus = "absent" | "present" | "correct";
+import { CharValue } from "./statuses";
-export type CharValue =
- | "Q"
- | "W"
- | "E"
- | "R"
- | "T"
- | "Y"
- | "U"
- | "I"
- | "O"
- | "P"
- | "A"
- | "S"
- | "D"
- | "F"
- | "G"
- | "H"
- | "J"
- | "K"
- | "L"
- | "ENTER"
- | "Z"
- | "X"
- | "C"
- | "V"
- | "B"
- | "N"
- | "M"
- | "DELETE";
+export type KeyValue = CharValue | "ENTER" | "DELETE";
diff --git a/src/lib/statuses.ts b/src/lib/statuses.ts
new file mode 100644
index 0000000..2571dcc
--- /dev/null
+++ b/src/lib/statuses.ts
@@ -0,0 +1,58 @@
+import { solution } from "./words";
+
+export type CharStatus = "absent" | "present" | "correct";
+
+export type CharValue =
+ | "Q"
+ | "W"
+ | "E"
+ | "R"
+ | "T"
+ | "Y"
+ | "U"
+ | "I"
+ | "O"
+ | "P"
+ | "A"
+ | "S"
+ | "D"
+ | "F"
+ | "G"
+ | "H"
+ | "J"
+ | "K"
+ | "L"
+ | "Z"
+ | "X"
+ | "C"
+ | "V"
+ | "B"
+ | "N"
+ | "M";
+
+export const getStatuses = (
+ guesses: string[]
+): { [key: string]: CharStatus } => {
+ const charObj: { [key: string]: CharStatus } = {};
+
+ guesses.forEach((word) => {
+ word.split("").forEach((letter, i) => {
+ if (!solution.includes(letter)) {
+ // make status absent
+ return (charObj[letter] = "absent");
+ }
+
+ if (letter === solution[i]) {
+ //make status correct
+ return (charObj[letter] = "correct");
+ }
+
+ if (charObj[letter] !== "correct") {
+ //make status present
+ return (charObj[letter] = "present");
+ }
+ });
+ });
+
+ return charObj;
+};
diff --git a/src/lib/words.ts b/src/lib/words.ts
index 478ceda..d3f24dc 100644
--- a/src/lib/words.ts
+++ b/src/lib/words.ts
@@ -5,7 +5,7 @@ export const isWordInWordList = (word: string) => {
};
export const isWinningWord = (word: string) => {
- return solution === word.toLowerCase();
+ return solution === word;
};
export const getWordOfDay = () => {
@@ -15,7 +15,7 @@ export const getWordOfDay = () => {
const msInDay = 86400000;
const index = Math.floor((now - epochMs) / msInDay);
- return WORDS[index];
+ return WORDS[index].toUpperCase();
};
export const solution = getWordOfDay();