Merge pull request #13 from Suke-H/check-word-validity

単語の妥当性確認
Suke-H · Feb 18, 2024 · 248eb0a · 248eb0a
2 parents ed5ce3c + da84f30
commit 248eb0a
Show file tree

Hide file tree

Showing 3 changed files with 84 additions and 26 deletions.
diff --git a/src/App.tsx b/src/App.tsx
@@ -53,7 +53,7 @@ export const App = (): JSX.Element => {
         gameStatus={gameStatus}
         setGameStatus={setGameStatus}
       />
-      <Keyboard setAnswerList={setAnswerList} setJudge={setJudge} />
+      <Keyboard answerList={answerList} setAnswerList={setAnswerList} setJudge={setJudge} />
       <Notes />
     </div>
   );

diff --git a/src/components/answer.tsx b/src/components/answer.tsx
@@ -1,4 +1,5 @@
 import React, { useState, useEffect } from "react";
+import axios from "axios";
 
 type Props = {
   answerList: string[][];
@@ -83,6 +84,18 @@ export const Answer = (props: Props) => {
   const [matchStyleList, setMatchStyleList] =
     useState<React.CSSProperties[][]>(initMatchStyleList);
 
+  // 単語の妥当性判定
+  const wordValidityJudgement = async () => {
+    const { data } = await axios.post('https://yan5p8s0dg.execute-api.ap-southeast-2.amazonaws.com/WORDLE', 
+      {"word": props.answerList[round - 1].join("")},);
+    console.log(data);
+    if (data.isValid === undefined) {
+      return false;
+    }
+
+    return data.isValid;
+  }
+
   // 単語一致判定
   const wordMatchJudgement = () => {
     // 一度ディープコピーする
@@ -139,34 +152,48 @@ export const Answer = (props: Props) => {
 
   // Appコンポーネントのjudgeが変化した時に呼ばれる
   useEffect(() => {
-    // Enterを押したら
-    if (props.judge === true) {
-      // 一度フラグをおろす
-      props.setJudge(false);
-    }
 
-    // フラグをおろしてからここへ
-    else {
-      // コンポーネント初期化時にここを通る
-      if (round == 0) {
-        setRound(round + 1); // ラウンドを1に
-        return;
-      }
+    const checkProcess = async () => {
+
+      // Enterを押したら
+      if (props.judge === true) {
 
-      // ゲーム継続中なら
-      if (props.gameStatus == "playing") {
-        // 単語一致判定
-        const tmpMatchStyleList = wordMatchJudgement();
+        // 単語の妥当性判定
+        const isValid = await wordValidityJudgement();
+        if (!isValid)
+        {
+          alert("データセットに存在しない単語です");
+          return;
+        }
+
+        // 一度フラグをおろす
+        props.setJudge(false);
+      }
 
-        // クリア判定
-        clearJudgement();
+      // フラグをおろしてからここへ
+      else {
+        // コンポーネント初期化時にここを通る
+        if (round == 0) {
+          setRound(round + 1); // ラウンドを1に
+          return;
+        }
 
-        // スタイル更新
-        setMatchStyleList(tmpMatchStyleList);
-        // ラウンド更新
-        setRound(round + 1);
+        // ゲーム継続中なら
+        if (props.gameStatus == "playing") {
+          // 単語一致判定
+          const tmpMatchStyleList = wordMatchJudgement();
+          // クリア判定
+          clearJudgement();
+          // スタイル更新
+          setMatchStyleList(tmpMatchStyleList);
+          // ラウンド更新
+          setRound(round + 1);
+        }
       }
     }
+
+    checkProcess();
+
   }, [props.judge]);
 
   return (

diff --git a/src/components/keyboard.tsx b/src/components/keyboard.tsx
@@ -1,6 +1,8 @@
 import React, { useState, useEffect } from "react";
+import axios from "axios";
 
 type appProps = {
+  answerList: string[][];
   setAnswerList: React.Dispatch<React.SetStateAction<string[][]>>;
   setJudge: React.Dispatch<React.SetStateAction<boolean>>;
 };
@@ -10,6 +12,7 @@ type Props = {
   setColumncnt: React.Dispatch<React.SetStateAction<number>>;
   columncnt: number;
   setRowcnt: React.Dispatch<React.SetStateAction<number>>;
+  answerList: string[][],
   setAnswerList: React.Dispatch<React.SetStateAction<string[][]>>;
   keyLayout: string[];
   setJudge: React.Dispatch<React.SetStateAction<boolean>>;
@@ -37,7 +40,19 @@ const KeyboardRow = (props: Props) => {
     return tmpList;
   };
 
-  const handleClick = (
+  // 単語の妥当性判定
+  const wordValidityJudgement = async () => {
+    const { data } = await axios.post('https://yan5p8s0dg.execute-api.ap-southeast-2.amazonaws.com/WORDLE', 
+      {"word": props.answerList[props.rowcnt].join("")});
+    console.log(data);
+    if (data.isValid === undefined) {
+      return false;
+    }
+
+    return data.isValid;
+  }
+
+  const handleClick = async (
     event: React.MouseEvent<HTMLButtonElement, MouseEvent>
   ) => {
     const letter = event.currentTarget.value;
@@ -49,14 +64,27 @@ const KeyboardRow = (props: Props) => {
         alert("文字数が足りません");
       }
 
+      // 単語の妥当性判定
+      const isValid = await wordValidityJudgement();
+      if (!isValid)
+      {
+        alert("データセットに存在しない単語です");
+        props.setAnswerList(prevState =>
+          prevState.map((row, index) =>
+            index === props.rowcnt ? Array(5).fill("") : row
+          )
+        );
+
+        props.setColumncnt(0);
+
+      }
+
       // 5文字入力した状態
       else {
         // フラグ送信（正解判定の依頼）
         props.setJudge(true);
-
         // 列数リセット
         props.setColumncnt(0);
-
         // 次の行へ移行
         props.setRowcnt((prev) => prev + 1);
       }
@@ -174,6 +202,7 @@ export const Keyboard = (props: appProps) => {
         setRowcnt={setRowcnt}
         columncnt={columncnt}
         setColumncnt={setColumncnt}
+        answerList={props.answerList}
         setAnswerList={props.setAnswerList}
         keyLayout={upKeyLayout}
         setJudge={props.setJudge}
@@ -183,6 +212,7 @@ export const Keyboard = (props: appProps) => {
         setRowcnt={setRowcnt}
         columncnt={columncnt}
         setColumncnt={setColumncnt}
+        answerList={props.answerList}
         setAnswerList={props.setAnswerList}
         keyLayout={middleKeyLayout}
         setJudge={props.setJudge}
@@ -192,6 +222,7 @@ export const Keyboard = (props: appProps) => {
         setRowcnt={setRowcnt}
         columncnt={columncnt}
         setColumncnt={setColumncnt}
+        answerList={props.answerList}
         setAnswerList={props.setAnswerList}
         keyLayout={downKeyLayout}
         setJudge={props.setJudge}