48 lines
1.1 KiB
TypeScript
48 lines
1.1 KiB
TypeScript
import React from "react";
|
|
|
|
const ROOM_URL = 'http://localhost:5062/room';
|
|
|
|
const Home = () => {
|
|
|
|
const [rooms, setRooms] = React.useState<string[]>([]);
|
|
|
|
React.useEffect(() => {
|
|
fetch(ROOM_URL)
|
|
.then((r) => {
|
|
console.log(r);
|
|
return r.json();
|
|
})
|
|
.then((data) => {
|
|
console.log(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>
|
|
<button onClick={handleCreateRoom}>Create Room</button>
|
|
<ul>
|
|
{
|
|
rooms.map((room, index) => {
|
|
return <li key={index} onClick={() => gotoRoom(room)}>{room}</li>
|
|
})
|
|
}
|
|
</ul>
|
|
</div>
|
|
);
|
|
}
|
|
|
|
export default Home;
|