3 files changed, 29 insertions, 11 deletions
diff --git a/src/components/map/MapStage.js b/src/components/map/MapStage.js
index 38047064..0950d5bd 100644
--- a/src/components/map/MapStage.js
+++ b/src/components/map/MapStage.js
@@ -2,8 +2,8 @@ import React from "react";
 import {Group, Layer, Stage} from "react-konva";
 import jQuery from "../../util/jquery";
 import Backdrop from "./elements/Backdrop";
+import DatacenterGroup from "./groups/DatacenterGroup";
 import GridGroup from "./groups/GridGroup";
-import RoomGroup from "./groups/RoomGroup";
 import {MAP_SIZE_IN_PIXELS} from "./MapConstants";
 
 class MapStage extends React.Component {
@@ -43,7 +43,7 @@ class MapStage extends React.Component {
                 <Layer>
                     <Group draggable={true} dragBoundFunc={this.dragBoundHandler.bind(this)}>
                         <Backdrop/>
-                        <RoomGroup/>
+                        <DatacenterGroup/>
                         <GridGroup/>
                     </Group>
                 </Layer>
diff --git a/src/components/map/groups/DatacenterGroup.js b/src/components/map/groups/DatacenterGroup.js
new file mode 100644
index 00000000..3b7a086b
--- /dev/null
+++ b/src/components/map/groups/DatacenterGroup.js
@@ -0,0 +1,17 @@
+import React from "react";
+import {Group} from "react-konva";
+import RoomGroup from "./RoomGroup";
+
+const DatacenterGroup = ({datacenter}) => (
+    <Group>
+        {datacenter.rooms.map(room => (
+            <RoomGroup room={room}/>
+        ))}
+    </Group>
+);
+
+DatacenterGroup.propTypes = {
+    datacenter: Shapes.Datacenter,
+};
+
+export default DatacenterGroup;
diff --git a/src/components/map/groups/RoomGroup.js b/src/components/map/groups/RoomGroup.js
index 1a8b18d5..90a58767 100644
--- a/src/components/map/groups/RoomGroup.js
+++ b/src/components/map/groups/RoomGroup.js
@@ -1,16 +1,17 @@
 import React from "react";
-import {Group, Rect} from "react-konva";
+import {Group} from "react-konva";
+import TileGroup from "./TileGroup";
 
-const RoomGroup = () => (
+const RoomGroup = ({room}) => (
     <Group>
-        <Rect
-            x={10}
-            y={10}
-            width={50}
-            height={50}
-            fill="green"
-        />
+        {room.tiles.map(tile => (
+            <TileGroup tile={tile}/>
+        ))}
     </Group>
 );
 
+RoomGroup.propTypes = {
+    room: Shapes.Room,
+};
+
 export default RoomGroup;