Add a button to delete the currently viewed room

11 files changed, 137 insertions, 39 deletions

diff --git a/src/actions/modals/topology.js b/src/actions/modals/topology.js
index 5e3fc803..ded8771a 100644
--- a/src/actions/modals/topology.js
+++ b/src/actions/modals/topology.js
@@ -1,5 +1,7 @@
 export const OPEN_EDIT_ROOM_NAME_MODAL = "OPEN_EDIT_ROOM_NAME_MODAL";
 export const CLOSE_EDIT_ROOM_NAME_MODAL = "CLOSE_EDIT_ROOM_NAME_MODAL";
+export const OPEN_DELETE_ROOM_MODAL = "OPEN_DELETE_ROOM_MODAL";
+export const CLOSE_DELETE_ROOM_MODAL = "CLOSE_DELETE_ROOM_MODAL";
 
 export function openEditRoomNameModal() {
     return {
@@ -12,3 +14,15 @@ export function closeEditRoomNameModal() {
         type: CLOSE_EDIT_ROOM_NAME_MODAL
     };
 }
+
+export function openDeleteRoomModal() {
+    return {
+        type: OPEN_DELETE_ROOM_MODAL
+    };
+}
+
+export function closeDeleteRoomModal() {
+    return {
+        type: CLOSE_DELETE_ROOM_MODAL
+    };
+}
diff --git a/src/actions/topology.js b/src/actions/topology.js
index 1f111f06..ec614c1c 100644
--- a/src/actions/topology.js
+++ b/src/actions/topology.js
@@ -1,4 +1,5 @@
 import {findTileWithPosition} from "../util/tile-calculations";
+import {goDownOneInteractionLevel} from "./interaction-level";
 import {addIdToStoreObjectListProp, addPropToStoreObject, removeIdFromStoreObjectListProp} from "./objects";
 
 export const FETCH_TOPOLOGY_OF_DATACENTER = "FETCH_TOPOLOGY_OF_DATACENTER";
@@ -14,6 +15,7 @@ export const CANCEL_NEW_ROOM_CONSTRUCTION_SUCCEEDED = "CANCEL_NEW_ROOM_CONSTRUCT
 export const ADD_TILE = "ADD_TILE";
 export const DELETE_TILE = "DELETE_TILE";
 export const EDIT_ROOM_NAME = "EDIT_ROOM_NAME";
+export const DELETE_ROOM = "DELETE_ROOM";
 export const START_OBJECT_CONSTRUCTION = "START_OBJECT_CONSTRUCTION";
 export const STOP_OBJECT_CONSTRUCTION = "STOP_OBJECT_CONSTRUCTION";
 export const ADD_RACK_TO_TILE = "ADD_RACK_TO_TILE";
@@ -183,3 +185,18 @@ export function addRackToTileSucceeded(tileId, rackId) {
         dispatch(addPropToStoreObject("tile", tileId, {objectId: rackId}));
     };
 }
+
+export function deleteRoom() {
+    return {
+        type: DELETE_ROOM
+    };
+}
+
+export function deleteRoomSucceeded() {
+    return (dispatch, getState) => {
+        const {currentDatacenterId, interactionLevel} = getState();
+        const currentRoomId = interactionLevel.roomId;
+        dispatch(goDownOneInteractionLevel());
+        dispatch(removeIdFromStoreObjectListProp("datacenter", currentDatacenterId, "roomIds", currentRoomId));
+    };
+}
diff --git a/src/components/sidebars/topology/room/DeleteRoomComponent.js b/src/components/sidebars/topology/room/DeleteRoomComponent.js
new file mode 100644
index 00000000..61e10523
--- /dev/null
+++ b/src/components/sidebars/topology/room/DeleteRoomComponent.js
@@ -0,0 +1,11 @@
+import React from "react";
+
+const DeleteRoomComponent = ({onClick}) => {
+    return (
+        <div className="btn btn-danger btn-block" onClick={onClick}>
+            Delete this room
+        </div>
+    );
+};
+
+export default DeleteRoomComponent;
diff --git a/src/components/sidebars/topology/room/RoomSidebarComponent.js b/src/components/sidebars/topology/room/RoomSidebarComponent.js
index 4c1200c1..a15351f9 100644
--- a/src/components/sidebars/topology/room/RoomSidebarComponent.js
+++ b/src/components/sidebars/topology/room/RoomSidebarComponent.js
@@ -1,4 +1,5 @@
 import React from "react";
+import DeleteRoomContainer from "../../../../containers/sidebars/topology/room/DeleteRoomContainer";
 import RackConstructionContainer from "../../../../containers/sidebars/topology/room/RackConstructionContainer";
 import RoomNameContainer from "../../../../containers/sidebars/topology/room/RoomNameContainer";
 import RoomTypeContainer from "../../../../containers/sidebars/topology/room/RoomTypeContainer";
@@ -14,6 +15,7 @@ const RoomSidebarComponent = ({roomType}) => {
             <RoomNameContainer/>
             <RoomTypeContainer/>
             {allowedObjects}
+            <DeleteRoomContainer/>
         </div>
     );
 };
diff --git a/src/containers/modals/DeleteProfileModal.js b/src/containers/modals/DeleteProfileModal.js
index 0108a1eb..709b4a92 100644
--- a/src/containers/modals/DeleteProfileModal.js
+++ b/src/containers/modals/DeleteProfileModal.js
@@ -4,9 +4,9 @@ import {closeDeleteProfileModal} from "../../actions/modals/profile";
 import {deleteCurrentUser} from "../../actions/users";
 import ConfirmationModal from "../../components/modals/ConfirmationModal";
 
-const NewSimulationModalComponent = ({visible, callback}) => (
+const DeleteProfileModalComponent = ({visible, callback}) => (
     <ConfirmationModal title="Delete my account"
-                       message="Are you sure you want do delete your OpenDC account?"
+                       message="Are you sure you want to delete your OpenDC account?"
                        show={visible}
                        callback={callback}/>
 );
@@ -28,9 +28,9 @@ const mapDispatchToProps = dispatch => {
     };
 };
 
-const NewSimulationModal = connect(
+const DeleteProfileModal = connect(
     mapStateToProps,
     mapDispatchToProps
-)(NewSimulationModalComponent);
+)(DeleteProfileModalComponent);
 
-export default NewSimulationModal;
+export default DeleteProfileModal;
diff --git a/src/containers/modals/DeleteRoomModal.js b/src/containers/modals/DeleteRoomModal.js
new file mode 100644
index 00000000..92684385
--- /dev/null
+++ b/src/containers/modals/DeleteRoomModal.js
@@ -0,0 +1,36 @@
+import React from "react";
+import {connect} from "react-redux";
+import {closeDeleteRoomModal} from "../../actions/modals/topology";
+import {deleteRoom} from "../../actions/topology";
+import ConfirmationModal from "../../components/modals/ConfirmationModal";
+
+const DeleteRoomModalComponent = ({visible, callback}) => (
+    <ConfirmationModal title="Delete this room"
+                       message="Are you sure you want to delete this room?"
+                       show={visible}
+                       callback={callback}/>
+);
+
+const mapStateToProps = state => {
+    return {
+        visible: state.modals.deleteRoomModalVisible
+    };
+};
+
+const mapDispatchToProps = dispatch => {
+    return {
+        callback: (isConfirmed) => {
+            if (isConfirmed) {
+                dispatch(deleteRoom());
+            }
+            dispatch(closeDeleteRoomModal());
+        }
+    };
+};
+
+const DeleteRoomModal = connect(
+    mapStateToProps,
+    mapDispatchToProps
+)(DeleteRoomModalComponent);
+
+export default DeleteRoomModal;
diff --git a/src/containers/sidebars/topology/room/DeleteRoomContainer.js b/src/containers/sidebars/topology/room/DeleteRoomContainer.js
new file mode 100644
index 00000000..23a8fa0a
--- /dev/null
+++ b/src/containers/sidebars/topology/room/DeleteRoomContainer.js
@@ -0,0 +1,16 @@
+import {connect} from "react-redux";
+import {openDeleteRoomModal} from "../../../../actions/modals/topology";
+import DeleteRoomComponent from "../../../../components/sidebars/topology/room/DeleteRoomComponent";
+
+const mapDispatchToProps = dispatch => {
+    return {
+        onClick: () => dispatch(openDeleteRoomModal()),
+    };
+};
+
+const DeleteRoomContainer = connect(
+    undefined,
+    mapDispatchToProps
+)(DeleteRoomComponent);
+
+export default DeleteRoomContainer;
diff --git a/src/pages/App.js b/src/pages/App.js
index f74c3fc8..001644a2 100644
--- a/src/pages/App.js
+++ b/src/pages/App.js
@@ -6,6 +6,7 @@ import {openSimulationSucceeded} from "../actions/simulations";
 import {fetchLatestDatacenter, resetCurrentDatacenter} from "../actions/topology";
 import MapStage from "../components/map/MapStage";
 import AppNavbar from "../components/navigation/AppNavbar";
+import DeleteRoomModal from "../containers/modals/DeleteRoomModal";
 import EditRoomNameModal from "../containers/modals/EditRoomNameModal";
 import TopologySidebar from "../containers/sidebars/topology/TopologySidebar";
 import KeymapConfiguration from "../shortcuts/keymap";
@@ -41,6 +42,7 @@ class AppContainer extends React.Component {
                     <TopologySidebar/>
                 </div>
                 <EditRoomNameModal/>
+                <DeleteRoomModal/>
             </div>
         );
     }
diff --git a/src/reducers/modals.js b/src/reducers/modals.js
index 1786bb87..f6d1efea 100644
--- a/src/reducers/modals.js
+++ b/src/reducers/modals.js
@@ -1,43 +1,29 @@
 import {combineReducers} from "redux";
 import {CLOSE_DELETE_PROFILE_MODAL, OPEN_DELETE_PROFILE_MODAL} from "../actions/modals/profile";
 import {CLOSE_NEW_SIMULATION_MODAL, OPEN_NEW_SIMULATION_MODAL} from "../actions/modals/simulations";
-import {CLOSE_EDIT_ROOM_NAME_MODAL, OPEN_EDIT_ROOM_NAME_MODAL} from "../actions/modals/topology";
+import {
+    CLOSE_DELETE_ROOM_MODAL,
+    CLOSE_EDIT_ROOM_NAME_MODAL,
+    OPEN_DELETE_ROOM_MODAL,
+    OPEN_EDIT_ROOM_NAME_MODAL
+} from "../actions/modals/topology";
 
-function newSimulationModalVisible(state = false, action) {
-    switch (action.type) {
-        case OPEN_NEW_SIMULATION_MODAL:
-            return true;
-        case CLOSE_NEW_SIMULATION_MODAL:
-            return false;
-        default:
-            return state;
-    }
-}
-
-function deleteProfileModalVisible(state = false, action) {
-    switch (action.type) {
-        case OPEN_DELETE_PROFILE_MODAL:
-            return true;
-        case CLOSE_DELETE_PROFILE_MODAL:
-            return false;
-        default:
-            return state;
-    }
-}
-
-function editRoomNameModalVisible(state = false, action) {
-    switch (action.type) {
-        case OPEN_EDIT_ROOM_NAME_MODAL:
-            return true;
-        case CLOSE_EDIT_ROOM_NAME_MODAL:
-            return false;
-        default:
-            return state;
+function modal(openAction, closeAction) {
+    return function (state = false, action) {
+        switch (action.type) {
+            case openAction:
+                return true;
+            case closeAction:
+                return false;
+            default:
+                return state;
+        }
     }
 }
 
 export const modals = combineReducers({
-    newSimulationModalVisible,
-    deleteProfileModalVisible,
-    editRoomNameModalVisible,
+    newSimulationModalVisible: modal(OPEN_NEW_SIMULATION_MODAL, CLOSE_NEW_SIMULATION_MODAL),
+    deleteProfileModalVisible: modal(OPEN_DELETE_PROFILE_MODAL, CLOSE_DELETE_PROFILE_MODAL),
+    editRoomNameModalVisible: modal(OPEN_EDIT_ROOM_NAME_MODAL, CLOSE_EDIT_ROOM_NAME_MODAL),
+    deleteRoomModalVisible: modal(OPEN_DELETE_ROOM_MODAL, CLOSE_DELETE_ROOM_MODAL),
 });
diff --git a/src/sagas/index.js b/src/sagas/index.js
index e58c966f..024e40aa 100644
--- a/src/sagas/index.js
+++ b/src/sagas/index.js
@@ -5,6 +5,7 @@ import {
     ADD_RACK_TO_TILE,
     ADD_TILE,
     CANCEL_NEW_ROOM_CONSTRUCTION,
+    DELETE_ROOM,
     DELETE_TILE,
     EDIT_ROOM_NAME,
     FETCH_LATEST_DATACENTER,
@@ -17,6 +18,7 @@ import {
     onAddRackToTile,
     onAddTile,
     onCancelNewRoomConstruction,
+    onDeleteRoom,
     onDeleteTile,
     onEditRoomName,
     onFetchLatestDatacenter,
@@ -36,5 +38,6 @@ export default function* rootSaga() {
     yield takeEvery(ADD_TILE, onAddTile);
     yield takeEvery(DELETE_TILE, onDeleteTile);
     yield takeEvery(EDIT_ROOM_NAME, onEditRoomName);
+    yield takeEvery(DELETE_ROOM, onDeleteRoom);
     yield takeEvery(ADD_RACK_TO_TILE, onAddRackToTile);
 }
diff --git a/src/sagas/topology.js b/src/sagas/topology.js
index 22f70f25..ab544bbe 100644
--- a/src/sagas/topology.js
+++ b/src/sagas/topology.js
@@ -4,6 +4,7 @@ import {
     addRackToTileSucceeded,
     addTileSucceeded,
     cancelNewRoomConstructionSucceeded,
+    deleteRoomSucceeded,
     deleteTileSucceeded,
     editRoomNameSucceeded,
     fetchLatestDatacenterSucceeded,
@@ -144,6 +145,16 @@ export function* onEditRoomName(action) {
     }
 }
 
+export function* onDeleteRoom() {
+    try {
+        const roomId = yield select(state => state.interactionLevel.roomId);
+        yield call(deleteRoom, roomId);
+        yield put(deleteRoomSucceeded());
+    } catch (error) {
+        console.log(error);
+    }
+}
+
 export function* onAddRackToTile(action) {
     try {
         const rack = yield call(addRackToTile, action.tileId, {