From f119fc78dda4d1e828dde04f378a63a93e3a0a7e Mon Sep 17 00:00:00 2001
From: Georgios Andreadis <info@gandreadis.com>
Date: Thu, 2 Jul 2020 18:39:28 +0200
Subject: Add current progress on frontend port

---
 .../components/app/map/groups/DatacenterGroup.js   | 40 ----------------------
 .../src/components/app/map/groups/RackGroup.js     |  4 +--
 .../src/components/app/map/groups/RoomGroup.js     |  6 ++--
 .../src/components/app/map/groups/TileGroup.js     | 10 +++---
 .../src/components/app/map/groups/TopologyGroup.js | 40 ++++++++++++++++++++++
 5 files changed, 49 insertions(+), 51 deletions(-)
 delete mode 100644 frontend/src/components/app/map/groups/DatacenterGroup.js
 create mode 100644 frontend/src/components/app/map/groups/TopologyGroup.js

(limited to 'frontend/src/components/app/map/groups')

diff --git a/frontend/src/components/app/map/groups/DatacenterGroup.js b/frontend/src/components/app/map/groups/DatacenterGroup.js
deleted file mode 100644
index 3d3b9702..00000000
--- a/frontend/src/components/app/map/groups/DatacenterGroup.js
+++ /dev/null
@@ -1,40 +0,0 @@
-import React from 'react'
-import { Group } from 'react-konva'
-import GrayContainer from '../../../../containers/app/map/GrayContainer'
-import RoomContainer from '../../../../containers/app/map/RoomContainer'
-import Shapes from '../../../../shapes/index'
-
-const DatacenterGroup = ({ datacenter, interactionLevel }) => {
-    if (!datacenter) {
-        return <Group/>
-    }
-
-    if (interactionLevel.mode === 'BUILDING') {
-        return (
-            <Group>
-                {datacenter.roomIds.map(roomId => (
-                    <RoomContainer key={roomId} roomId={roomId}/>
-                ))}
-            </Group>
-        )
-    }
-
-    return (
-        <Group>
-            {datacenter.roomIds
-                .filter(roomId => roomId !== interactionLevel.roomId)
-                .map(roomId => <RoomContainer key={roomId} roomId={roomId}/>)}
-            {interactionLevel.mode === 'ROOM' ? <GrayContainer/> : null}
-            {datacenter.roomIds
-                .filter(roomId => roomId === interactionLevel.roomId)
-                .map(roomId => <RoomContainer key={roomId} roomId={roomId}/>)}
-        </Group>
-    )
-}
-
-DatacenterGroup.propTypes = {
-    datacenter: Shapes.Datacenter,
-    interactionLevel: Shapes.InteractionLevel,
-}
-
-export default DatacenterGroup
diff --git a/frontend/src/components/app/map/groups/RackGroup.js b/frontend/src/components/app/map/groups/RackGroup.js
index 708dcf69..6de939a9 100644
--- a/frontend/src/components/app/map/groups/RackGroup.js
+++ b/frontend/src/components/app/map/groups/RackGroup.js
@@ -22,12 +22,12 @@ const RackGroup = ({ tile, inSimulation, rackLoad }) => {
             />
             <Group opacity={inSimulation ? 0.3 : 1}>
                 <RackSpaceFillContainer
-                    tileId={tile.id}
+                    tileId={tile._id}
                     positionX={tile.positionX}
                     positionY={tile.positionY}
                 />
                 <RackEnergyFillContainer
-                    tileId={tile.id}
+                    tileId={tile._id}
                     positionX={tile.positionX}
                     positionY={tile.positionY}
                 />
diff --git a/frontend/src/components/app/map/groups/RoomGroup.js b/frontend/src/components/app/map/groups/RoomGroup.js
index 230e3c9b..4e3c7410 100644
--- a/frontend/src/components/app/map/groups/RoomGroup.js
+++ b/frontend/src/components/app/map/groups/RoomGroup.js
@@ -11,7 +11,7 @@ const RoomGroup = ({
                        currentRoomInConstruction,
                        onClick,
                    }) => {
-    if (currentRoomInConstruction === room.id) {
+    if (currentRoomInConstruction === room._id) {
         return (
             <Group onClick={onClick}>
                 {room.tileIds.map(tileId => (
@@ -27,7 +27,7 @@ const RoomGroup = ({
                 if (
                     (interactionLevel.mode === 'RACK' ||
                         interactionLevel.mode === 'MACHINE') &&
-                    interactionLevel.roomId === room.id
+                    interactionLevel.roomId === room._id
                 ) {
                     return [
                         room.tileIds
@@ -44,7 +44,7 @@ const RoomGroup = ({
                     ))
                 }
             })()}
-            <WallContainer roomId={room.id}/>
+            <WallContainer roomId={room._id}/>
         </Group>
     )
 }
diff --git a/frontend/src/components/app/map/groups/TileGroup.js b/frontend/src/components/app/map/groups/TileGroup.js
index 49e2e52b..54f4ae17 100644
--- a/frontend/src/components/app/map/groups/TileGroup.js
+++ b/frontend/src/components/app/map/groups/TileGroup.js
@@ -9,12 +9,10 @@ import RoomTile from '../elements/RoomTile'
 
 const TileGroup = ({ tile, newTile, inSimulation, roomLoad, onClick }) => {
     let tileObject
-    switch (tile.objectType) {
-        case 'RACK':
-            tileObject = <RackContainer tile={tile}/>
-            break
-        default:
-            tileObject = null
+    if (tile.rackId) {
+        tileObject = <RackContainer tile={tile}/>
+    } else {
+        tileObject = null
     }
 
     let color = ROOM_DEFAULT_COLOR
diff --git a/frontend/src/components/app/map/groups/TopologyGroup.js b/frontend/src/components/app/map/groups/TopologyGroup.js
new file mode 100644
index 00000000..a40a1d41
--- /dev/null
+++ b/frontend/src/components/app/map/groups/TopologyGroup.js
@@ -0,0 +1,40 @@
+import React from 'react'
+import { Group } from 'react-konva'
+import GrayContainer from '../../../../containers/app/map/GrayContainer'
+import RoomContainer from '../../../../containers/app/map/RoomContainer'
+import Shapes from '../../../../shapes/index'
+
+const TopologyGroup = ({ topology, interactionLevel }) => {
+    if (!topology) {
+        return <Group/>
+    }
+
+    if (interactionLevel.mode === 'BUILDING') {
+        return (
+            <Group>
+                {topology.roomIds.map(roomId => (
+                    <RoomContainer key={roomId} roomId={roomId}/>
+                ))}
+            </Group>
+        )
+    }
+
+    return (
+        <Group>
+            {topology.roomIds
+                .filter(roomId => roomId !== interactionLevel.roomId)
+                .map(roomId => <RoomContainer key={roomId} roomId={roomId}/>)}
+            {interactionLevel.mode === 'ROOM' ? <GrayContainer/> : null}
+            {topology.roomIds
+                .filter(roomId => roomId === interactionLevel.roomId)
+                .map(roomId => <RoomContainer key={roomId} roomId={roomId}/>)}
+        </Group>
+    )
+}
+
+TopologyGroup.propTypes = {
+    topology: Shapes.Topology,
+    interactionLevel: Shapes.InteractionLevel,
+}
+
+export default TopologyGroup
-- 
cgit v1.2.3