Modal GameCompleteModal.jsx

100% Statements 5/5

100% Branches 0/0

75% Functions 3/4

100% Lines 4/4

Press n or j to go to the next uncovered block, b, p or k for the previous block.


1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21  
 
 
 
 
 
2x
2x
 
 
2x
 
 
 
1x
 
 
 
 
 
  import "./Modal.css"
import React, { useEffect } from "react"
import ReactDom from "react-dom"
import { playPopSound } from "../SoundEffects/playPopSound";
 
export default function GameCompleteModal({ score }) {
    useEffect(() => {
        new Audio("/audio/game_end.mp3").play().catch(() => {})
    }, [])
 
    return ReactDom.createPortal(<div className="modal-overlay">
        <div className="modal-content">
            <div className="text">🎉Great Job!🎉</div>
            <div className="score-earned">{score}</div>
            <button onClick={() => { playPopSound(); window.location.href = "/" }} className="home-button">
                🏠 Back to home
            </button>
        </div>
    </div>, document.getElementById("portal-game"));
}