diff --git a/public/index.html b/public/index.html index 50d5c01..7dbd459 100644 --- a/public/index.html +++ b/public/index.html @@ -5,10 +5,10 @@ - + - Mau Mau + Mau-Mau diff --git a/src/layout/pages/MainLobby.tsx b/src/layout/pages/MainLobby.tsx index 75f023a..46c2cee 100644 --- a/src/layout/pages/MainLobby.tsx +++ b/src/layout/pages/MainLobby.tsx @@ -1,34 +1,33 @@ import React from "react"; import useTitle from "../../utils/hooks/TitleHook"; import Card from "../components/Card"; +import {useNavigate} from "react-router"; const ROOM_URL = `http://${process.env.REACT_APP_API_URL}/room`; const MainLobby = () => { - useTitle('MauLobby'); + useTitle('Mau-Mau Lobby'); + + const navigateTo = useNavigate(); const handleCreateRoom = () => { fetch(ROOM_URL, { method: 'POST', }).then(r => r.json()).then(data => { - window.location.href = `/room/${data}`; + navigateTo(`/room/${data}`) }); } - const gotoRooms = () => { - window.location.href = '/rooms'; - } - return (
-

MauMau

+

Mau-Mau

Host Game

-
+
navigateTo('/rooms')}>

Join Game

diff --git a/src/layout/pages/Room.tsx b/src/layout/pages/Room.tsx index d0cc86f..fa1e076 100644 --- a/src/layout/pages/Room.tsx +++ b/src/layout/pages/Room.tsx @@ -1,6 +1,6 @@ import useWebSocket from "react-use-websocket"; import React from "react"; -import {useParams} from "react-router"; +import {useNavigate, useParams} from "react-router"; import {GHButton} from "../components/Button"; import useTitle from "../../utils/hooks/TitleHook"; import Hand from "../components/Hand"; @@ -18,6 +18,8 @@ const Room = () => { useTitle('Mau!'); + const navigateTo = useNavigate(); + const {roomId} = useParams(); const WS_URL = `ws://${process.env.REACT_APP_API_URL}/room/${roomId}`; @@ -43,7 +45,7 @@ const Room = () => { const handleLeaveRoom = () => { const socket = websocket.getWebSocket(); if (socket) socket.close(); - window.location.href = '/'; + navigateTo('/'); } const handleCardSend = (card: string) => { diff --git a/src/layout/pages/Rooms.tsx b/src/layout/pages/Rooms.tsx index 57412e1..0779948 100644 --- a/src/layout/pages/Rooms.tsx +++ b/src/layout/pages/Rooms.tsx @@ -1,12 +1,13 @@ import useTitle from "../../utils/hooks/TitleHook"; import React from "react"; -import {Link} from "react-router-dom"; +import {useNavigate} from "react-router"; const ROOM_URL = `http://${process.env.REACT_APP_API_URL}/room`; const Rooms = () => { - useTitle('Rooms'); + useTitle('Mau-Mau Rooms'); + const navigateTo = useNavigate(); const [rooms, setRooms] = React.useState([]); @@ -22,7 +23,8 @@ const Rooms = () => {
    { rooms.map((room, index) => { - return
  • {room}
    • + return
  • navigateTo(`/room/${room}`)}>{room}
    • }) }