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();