diff options
Diffstat (limited to 'src/components/map/groups')
| -rw-r--r-- | src/components/map/groups/DatacenterGroup.js | 20 | ||||
| -rw-r--r-- | src/components/map/groups/GridGroup.js | 3 | ||||
| -rw-r--r-- | src/components/map/groups/RoomGroup.js | 3 |
3 files changed, 17 insertions, 9 deletions
diff --git a/src/components/map/groups/DatacenterGroup.js b/src/components/map/groups/DatacenterGroup.js index 3b7a086b..d7e349be 100644 --- a/src/components/map/groups/DatacenterGroup.js +++ b/src/components/map/groups/DatacenterGroup.js @@ -1,14 +1,20 @@ import React from "react"; import {Group} from "react-konva"; +import Shapes from "../../../shapes/index"; import RoomGroup from "./RoomGroup"; -const DatacenterGroup = ({datacenter}) => ( - <Group> - {datacenter.rooms.map(room => ( - <RoomGroup room={room}/> - ))} - </Group> -); +const DatacenterGroup = ({datacenter}) => { + if (!datacenter) { + return <Group/>; + } + return ( + <Group> + {datacenter.rooms.map(room => ( + <RoomGroup key={room.id} room={room}/> + ))} + </Group> + ); +}; DatacenterGroup.propTypes = { datacenter: Shapes.Datacenter, diff --git a/src/components/map/groups/GridGroup.js b/src/components/map/groups/GridGroup.js index 2651bf19..f50482ce 100644 --- a/src/components/map/groups/GridGroup.js +++ b/src/components/map/groups/GridGroup.js @@ -15,11 +15,12 @@ const VERTICAL_POINT_PAIRS = MAP_COORDINATE_ENTRIES.map(index => [ const GridGroup = () => ( <Group> - {HORIZONTAL_POINT_PAIRS.concat(VERTICAL_POINT_PAIRS).map(points => ( + {HORIZONTAL_POINT_PAIRS.concat(VERTICAL_POINT_PAIRS).map((points, index) => ( <Line points={points} stroke={GRID_COLOR} strokeWidth={GRID_LINE_WIDTH_IN_PIXELS} + key={index} /> ))} </Group> diff --git a/src/components/map/groups/RoomGroup.js b/src/components/map/groups/RoomGroup.js index 90a58767..28240d77 100644 --- a/src/components/map/groups/RoomGroup.js +++ b/src/components/map/groups/RoomGroup.js @@ -1,11 +1,12 @@ import React from "react"; import {Group} from "react-konva"; +import Shapes from "../../../shapes/index"; import TileGroup from "./TileGroup"; const RoomGroup = ({room}) => ( <Group> {room.tiles.map(tile => ( - <TileGroup tile={tile}/> + <TileGroup key={tile.id} tile={tile}/> ))} </Group> ); |
