bk commit

src/App.js

@@ -3,6 +3,8 @@ import CurrentScore from "./components/CurrentScore";
 import Hangman from "./components/Hangman/Hangman";
 import Header from "./components/Header";
 import PuzzleWord from "./components/Hangman/PuzzleWord/PuzzleWord";
+import Victory from "./components/Hangman/PuzzleWord/Victory";
+import Defeat from "./components/Hangman/PuzzleWord/Defeat";
 
 function App() {
 
@@ -11,6 +13,24 @@ function App() {
 
   const [hangmanFrame, setHangmanFrame] = useState(0)
 
+  const [isVictory, setIsVictory] = useState(false)
+  const [isDefeat, setIsDefeat] = useState(false)
+
+  const [keyPuzzleWord, setKeyPuzzleWord] = useState(1)
+
+  if (isVictory || isDefeat) {
+    
+    
+    setTimeout(() => {
+        setHangmanFrame(0)
+
+        setIsVictory(false)
+        setIsDefeat(false)
+
+        setKeyPuzzleWord(keyPuzzleWord + 1)
+        }, 3000)
+  }
+
   return (
    <>
     <Header language={language}/>
@@ -25,14 +45,31 @@ function App() {
       
       <div className='column-2'>
         <CurrentScore currentScore={currentScore} />
-        <PuzzleWord
+
+        { isVictory || isDefeat ? null :
+
+          <PuzzleWord
+
+          key={keyPuzzleWord}
 
           hangmanFrame={hangmanFrame}
           setHangmanFrame={setHangmanFrame}
 
           currentScore={currentScore}
           setCurrentScore={setCurrentScore}
-        />
+
+          isVictory={isVictory}
+          setIsVictory={setIsVictory}
+
+          isDefeat={isDefeat}
+          setIsDefeat={setIsDefeat}
+          />
+
+        }
+        
+
+        {isVictory ? <Victory currentScore={currentScore} setCurrentScore={setCurrentScore} /> : null}
+        {isDefeat ? <Defeat /> : null}
 
       </div>