From 085a8c4fc480316ad5327dcaabc60b9a73634b90 Mon Sep 17 00:00:00 2001 From: Titouan Rigoudy Date: Mon, 23 May 2016 14:56:06 +0200 Subject: [PATCH] Make rooms state immutable, fix room leaving mechanism. --- src/components/Room.js | 3 +- src/components/RoomChatHeader.js | 10 ++++--- src/components/RoomList.js | 13 +++------ src/containers/RoomsPane.js | 2 +- src/reducers/rooms.js | 49 ++++++++++++++++---------------- 5 files changed, 37 insertions(+), 40 deletions(-) diff --git a/src/components/Room.js b/src/components/Room.js index b30d3c4..0e89eb4 100644 --- a/src/components/Room.js +++ b/src/components/Room.js @@ -1,7 +1,7 @@ import React, { PropTypes } from "react"; import { Link } from "react-router"; -const Room = ({ name, onClick, room }) => { +const Room = ({ name, room }) => { const classes = ["room"]; if (room.membership == "Member") { classes.push("room-joined"); @@ -23,7 +23,6 @@ const Room = ({ name, onClick, room }) => { Room.propTypes = { name: PropTypes.string.isRequired, - onClick: PropTypes.func.isRequired, room: PropTypes.shape({ membership: PropTypes.string.isRequired, user_count: PropTypes.number.isRequired diff --git a/src/components/RoomChatHeader.js b/src/components/RoomChatHeader.js index 9f802d8..8ed927f 100644 --- a/src/components/RoomChatHeader.js +++ b/src/components/RoomChatHeader.js @@ -1,4 +1,5 @@ import React, { PropTypes } from "react"; +import { withRouter } from "react-router"; import ImmutablePropTypes from "react-immutable-proptypes"; const make_header = (title, showUsersButton, leaveButton) => ( @@ -9,7 +10,7 @@ const make_header = (title, showUsersButton, leaveButton) => ( ); -const RoomChatHeader = ({ room, roomActions }) => { +const RoomChatHeader = ({ room, roomActions, router }) => { if (!room) { return make_header("Select a room"); } @@ -18,7 +19,7 @@ const RoomChatHeader = ({ room, roomActions }) => { case "Member": { const onClickLeave = (event) => { - roomActions.select(null); + router.push("/app/rooms"); roomActions.leave(room.name); }; const leaveButton = ; @@ -59,7 +60,8 @@ RoomChatHeader.propTypes = { roomActions: PropTypes.shape({ leave: PropTypes.func.isRequired, select: PropTypes.func.isRequired - }).isRequired + }).isRequired, + router: PropTypes.object.isRequired }; -export default RoomChatHeader; +export default withRouter(RoomChatHeader); diff --git a/src/components/RoomList.js b/src/components/RoomList.js index 971ecc4..55d98ed 100644 --- a/src/components/RoomList.js +++ b/src/components/RoomList.js @@ -17,17 +17,12 @@ class RoomList extends React.Component { const children = []; - for (const [room_name, room_data] of roomMap) { - const onClick = (event) => { - roomActions.select(room_name); - }; - + for (const [roomName, roomData] of roomMap) { children.push( -
  • +
  • ); diff --git a/src/containers/RoomsPane.js b/src/containers/RoomsPane.js index 09ce6d6..9d38a2d 100644 --- a/src/containers/RoomsPane.js +++ b/src/containers/RoomsPane.js @@ -64,7 +64,7 @@ RoomsPane.propTypes = { }; const mapStateToProps = (state) => ({ - roomMap: state.rooms.roomMap, + roomMap: state.rooms.get("roomMap"), loginUserName: state.login.username }); diff --git a/src/reducers/rooms.js b/src/reducers/rooms.js index 5dbc7ad..0ecc247 100644 --- a/src/reducers/rooms.js +++ b/src/reducers/rooms.js @@ -9,13 +9,14 @@ import { SOCKET_RECEIVE_MESSAGE } from "../constants/ActionTypes"; -const initialState = { +const initialState = Immutable.Map({ roomMap: Immutable.OrderedMap(), roomNameByHash: Immutable.Map() -}; +}); const reduceRoomList = (state, roomList) => { - const { roomMap, roomNameByHash } = state; + const roomMap = state.get("roomMap"); + const roomNameByHash = state.get("roomNameByHash"); // First sort the room list by room name roomList.sort(([ roomName1 ], [ roomName2 ]) => { @@ -43,11 +44,10 @@ const reduceRoomList = (state, roomList) => { }; newRoomMap = newRoomMap.set(roomName, mergedRoomData); } - return { - ...state, - roomMap: newRoomMap, - roomNameByHash - }; + + return state + .set("roomMap", newRoomMap) + .set("roomNameByHash", roomNameByHash); }; const reduceReceiveMessageRoom = (roomData, { variant, data }) => { @@ -83,14 +83,15 @@ const reduceReceiveMessage = (state, message) => { case "RoomMessageResponse": { const { room_name } = data; - const roomData = state.roomMap.get(room_name); - const roomMap = state.roomMap.set(room_name, - reduceReceiveMessageRoom(roomData, { variant, data }) - ); - return { - ...state, - roomMap - }; + const roomMap = state.get("roomMap"); + return state.updateIn(["roomMap", data.room_name], (roomData) => { + if (roomData) { + return reduceReceiveMessageRoom(roomData, message); + } else { + console.log(`Error: unknown room ${data.room_name}`); + return roomData; + } + }); } case "RoomListResponse": @@ -141,14 +142,14 @@ export default (state = initialState, action) => { case ROOM_SHOW_USERS: case ROOM_HIDE_USERS: { - const roomData = state.roomMap.get(payload); - const roomMap = state.roomMap.set(payload, - reduceRoom(roomData, action) - ); - return { - ...state, - roomMap - }; + return state.updateIn(["roomMap", payload], (roomData) => { + if (roomData) { + return reduceRoom(roomData, action); + } else { + console.log(`Error: unknown room ${payload}`); + return roomData; + } + }); } case ROOM_MESSAGE: