2 files changed, 27 insertions, 9 deletions
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;