import { FC } from "react";
|
|
import { useSelector } from "react-redux";
|
|
import { useRouteMatch } from "react-router";
|
|
import { Switch, Route } from "react-router-dom";
|
|
|
|
//import RoomChat from "../components/RoomChat";
|
|
import RoomList from "../components/RoomList";
|
|
import { selectAllRooms } from "../modules/room/slice";
|
|
|
|
const RoomsPane: FC = () => {
|
|
const { path, url } = useRouteMatch();
|
|
const rooms = useSelector(selectAllRooms);
|
|
|
|
let roomChat;
|
|
|
|
/*
|
|
if (params && params.roomNameHash) {
|
|
const roomName = rooms.getNameByHash(params.roomNameHash);
|
|
|
|
const roomData = rooms.getByName(roomName);
|
|
|
|
if (roomData) {
|
|
const room = {
|
|
name: roomName,
|
|
membership: roomData.membership,
|
|
messages: roomData.messages,
|
|
showUsers: roomData.showUsers,
|
|
};
|
|
|
|
roomChat = (
|
|
<RoomChat
|
|
loginUserName={loginUserName}
|
|
room={room}
|
|
roomActions={roomActions}
|
|
/>
|
|
);
|
|
}
|
|
}
|
|
*/
|
|
|
|
return (
|
|
<div id="rooms-pane">
|
|
<RoomList rooms={rooms} />
|
|
<Switch>
|
|
<Route exact path={path}>
|
|
<div id="room-selected-pane">Pick a room.</div>
|
|
</Route>
|
|
<Route path={`${path}/:roomId`}>
|
|
<div id="room-selected-pane">{roomChat}</div>
|
|
</Route>
|
|
</Switch>
|
|
</div>
|
|
);
|
|
};
|
|
|
|
export default RoomsPane;
|