Add first plotting attempts for portfolios

6 files changed, 32 insertions, 50 deletions

diff --git a/frontend/src/components/app/map/groups/GridGroup.js b/frontend/src/components/app/map/groups/GridGroup.js
index 10554834..ebc00244 100644
--- a/frontend/src/components/app/map/groups/GridGroup.js
+++ b/frontend/src/components/app/map/groups/GridGroup.js
@@ -4,13 +4,13 @@ import { GRID_COLOR } from '../../../../util/colors'
 import { GRID_LINE_WIDTH_IN_PIXELS, MAP_SIZE, MAP_SIZE_IN_PIXELS, TILE_SIZE_IN_PIXELS } from '../MapConstants'
 
 const MAP_COORDINATE_ENTRIES = Array.from(new Array(MAP_SIZE), (x, i) => i)
-const HORIZONTAL_POINT_PAIRS = MAP_COORDINATE_ENTRIES.map(index => [
+const HORIZONTAL_POINT_PAIRS = MAP_COORDINATE_ENTRIES.map((index) => [
     0,
     index * TILE_SIZE_IN_PIXELS,
     MAP_SIZE_IN_PIXELS,
     index * TILE_SIZE_IN_PIXELS,
 ])
-const VERTICAL_POINT_PAIRS = MAP_COORDINATE_ENTRIES.map(index => [
+const VERTICAL_POINT_PAIRS = MAP_COORDINATE_ENTRIES.map((index) => [
     index * TILE_SIZE_IN_PIXELS,
     0,
     index * TILE_SIZE_IN_PIXELS,
@@ -19,9 +19,7 @@ const VERTICAL_POINT_PAIRS = MAP_COORDINATE_ENTRIES.map(index => [
 
 const GridGroup = () => (
     <Group>
-        {HORIZONTAL_POINT_PAIRS.concat(
-            VERTICAL_POINT_PAIRS,
-        ).map((points, index) => (
+        {HORIZONTAL_POINT_PAIRS.concat(VERTICAL_POINT_PAIRS).map((points, index) => (
             <Line
                 key={index}
                 points={points}
diff --git a/frontend/src/components/app/map/groups/RackGroup.js b/frontend/src/components/app/map/groups/RackGroup.js
index 5d4ee5e2..eb6dc24a 100644
--- a/frontend/src/components/app/map/groups/RackGroup.js
+++ b/frontend/src/components/app/map/groups/RackGroup.js
@@ -9,22 +9,10 @@ import TileObject from '../elements/TileObject'
 const RackGroup = ({ tile }) => {
     return (
         <Group>
-            <TileObject
-                positionX={tile.positionX}
-                positionY={tile.positionY}
-                color={RACK_BACKGROUND_COLOR}
-            />
+            <TileObject positionX={tile.positionX} positionY={tile.positionY} color={RACK_BACKGROUND_COLOR} />
             <Group>
-                <RackSpaceFillContainer
-                    tileId={tile._id}
-                    positionX={tile.positionX}
-                    positionY={tile.positionY}
-                />
-                <RackEnergyFillContainer
-                    tileId={tile._id}
-                    positionX={tile.positionX}
-                    positionY={tile.positionY}
-                />
+                <RackSpaceFillContainer tileId={tile._id} positionX={tile.positionX} positionY={tile.positionY} />
+                <RackEnergyFillContainer tileId={tile._id} positionX={tile.positionX} positionY={tile.positionY} />
             </Group>
         </Group>
     )
diff --git a/frontend/src/components/app/map/groups/RoomGroup.js b/frontend/src/components/app/map/groups/RoomGroup.js
index 4e3c7410..1fd54687 100644
--- a/frontend/src/components/app/map/groups/RoomGroup.js
+++ b/frontend/src/components/app/map/groups/RoomGroup.js
@@ -5,17 +5,12 @@ import TileContainer from '../../../../containers/app/map/TileContainer'
 import WallContainer from '../../../../containers/app/map/WallContainer'
 import Shapes from '../../../../shapes/index'
 
-const RoomGroup = ({
-                       room,
-                       interactionLevel,
-                       currentRoomInConstruction,
-                       onClick,
-                   }) => {
+const RoomGroup = ({ room, interactionLevel, currentRoomInConstruction, onClick }) => {
     if (currentRoomInConstruction === room._id) {
         return (
             <Group onClick={onClick}>
-                {room.tileIds.map(tileId => (
-                    <TileContainer key={tileId} tileId={tileId} newTile={true}/>
+                {room.tileIds.map((tileId) => (
+                    <TileContainer key={tileId} tileId={tileId} newTile={true} />
                 ))}
             </Group>
         )
@@ -25,26 +20,23 @@ const RoomGroup = ({
         <Group onClick={onClick}>
             {(() => {
                 if (
-                    (interactionLevel.mode === 'RACK' ||
-                        interactionLevel.mode === 'MACHINE') &&
+                    (interactionLevel.mode === 'RACK' || interactionLevel.mode === 'MACHINE') &&
                     interactionLevel.roomId === room._id
                 ) {
                     return [
                         room.tileIds
-                            .filter(tileId => tileId !== interactionLevel.tileId)
-                            .map(tileId => <TileContainer key={tileId} tileId={tileId}/>),
-                        <GrayContainer key={-1}/>,
+                            .filter((tileId) => tileId !== interactionLevel.tileId)
+                            .map((tileId) => <TileContainer key={tileId} tileId={tileId} />),
+                        <GrayContainer key={-1} />,
                         room.tileIds
-                            .filter(tileId => tileId === interactionLevel.tileId)
-                            .map(tileId => <TileContainer key={tileId} tileId={tileId}/>),
+                            .filter((tileId) => tileId === interactionLevel.tileId)
+                            .map((tileId) => <TileContainer key={tileId} tileId={tileId} />),
                     ]
                 } else {
-                    return room.tileIds.map(tileId => (
-                        <TileContainer key={tileId} tileId={tileId}/>
-                    ))
+                    return room.tileIds.map((tileId) => <TileContainer key={tileId} tileId={tileId} />)
                 }
             })()}
-            <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 e984f05b..1e106823 100644
--- a/frontend/src/components/app/map/groups/TileGroup.js
+++ b/frontend/src/components/app/map/groups/TileGroup.js
@@ -9,7 +9,7 @@ import RoomTile from '../elements/RoomTile'
 const TileGroup = ({ tile, newTile, roomLoad, onClick }) => {
     let tileObject
     if (tile.rackId) {
-        tileObject = <RackContainer tile={tile}/>
+        tileObject = <RackContainer tile={tile} />
     } else {
         tileObject = null
     }
@@ -21,7 +21,7 @@ const TileGroup = ({ tile, newTile, roomLoad, onClick }) => {
 
     return (
         <Group onClick={() => onClick(tile)}>
-            <RoomTile tile={tile} color={color}/>
+            <RoomTile tile={tile} color={color} />
             {tileObject}
         </Group>
     )
diff --git a/frontend/src/components/app/map/groups/TopologyGroup.js b/frontend/src/components/app/map/groups/TopologyGroup.js
index a40a1d41..6096fc8b 100644
--- a/frontend/src/components/app/map/groups/TopologyGroup.js
+++ b/frontend/src/components/app/map/groups/TopologyGroup.js
@@ -6,14 +6,14 @@ import Shapes from '../../../../shapes/index'
 
 const TopologyGroup = ({ topology, interactionLevel }) => {
     if (!topology) {
-        return <Group/>
+        return <Group />
     }
 
     if (interactionLevel.mode === 'BUILDING') {
         return (
             <Group>
-                {topology.roomIds.map(roomId => (
-                    <RoomContainer key={roomId} roomId={roomId}/>
+                {topology.roomIds.map((roomId) => (
+                    <RoomContainer key={roomId} roomId={roomId} />
                 ))}
             </Group>
         )
@@ -22,12 +22,16 @@ const TopologyGroup = ({ topology, interactionLevel }) => {
     return (
         <Group>
             {topology.roomIds
-                .filter(roomId => roomId !== interactionLevel.roomId)
-                .map(roomId => <RoomContainer key={roomId} roomId={roomId}/>)}
-            {interactionLevel.mode === 'ROOM' ? <GrayContainer/> : null}
+                .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}/>)}
+                .filter((roomId) => roomId === interactionLevel.roomId)
+                .map((roomId) => (
+                    <RoomContainer key={roomId} roomId={roomId} />
+                ))}
         </Group>
     )
 }
diff --git a/frontend/src/components/app/map/groups/WallGroup.js b/frontend/src/components/app/map/groups/WallGroup.js
index 81c72d94..7b0f5ca0 100644
--- a/frontend/src/components/app/map/groups/WallGroup.js
+++ b/frontend/src/components/app/map/groups/WallGroup.js
@@ -9,7 +9,7 @@ const WallGroup = ({ tiles }) => {
     return (
         <Group>
             {deriveWallLocations(tiles).map((wallSegment, index) => (
-                <WallSegment key={index} wallSegment={wallSegment}/>
+                <WallSegment key={index} wallSegment={wallSegment} />
             ))}
         </Group>
     )