43 lines
1021 B
TypeScript
43 lines
1021 B
TypeScript
import React from "react";
|
|
import {GHButton} from "../components/Button";
|
|
|
|
const ROOM_URL = 'http://localhost:5062/room';
|
|
|
|
const Home = () => {
|
|
|
|
const [rooms, setRooms] = React.useState<string[]>([]);
|
|
|
|
React.useEffect(() => {
|
|
fetch(ROOM_URL)
|
|
.then(r => r.json())
|
|
.then(data => setRooms(data));
|
|
}, []);
|
|
|
|
const handleCreateRoom = () => {
|
|
fetch(ROOM_URL, {
|
|
method: 'POST',
|
|
}).then(r => r.json()).then(data => {
|
|
setRooms([...rooms, data]);
|
|
});
|
|
}
|
|
|
|
const gotoRoom = (roomId: string) => {
|
|
window.location.href = `/room/${roomId}`;
|
|
}
|
|
|
|
return (
|
|
<div>
|
|
<GHButton onClick={handleCreateRoom}>Create Room</GHButton>
|
|
<ul>
|
|
{
|
|
rooms.map((room, index) => {
|
|
return <li key={index} onClick={() => gotoRoom(room)}>{room}</li>
|
|
})
|
|
}
|
|
</ul>
|
|
</div>
|
|
);
|
|
}
|
|
|
|
export default Home;
|