1 files changed, 22 insertions, 28 deletions

diff --git a/opendc-web/opendc-web-ui/src/components/app/map/layers/RoomHoverLayer.js b/opendc-web/opendc-web-ui/src/components/app/map/layers/RoomHoverLayer.js
index 87240813..59f83b2b 100644
--- a/opendc-web/opendc-web-ui/src/components/app/map/layers/RoomHoverLayer.js
+++ b/opendc-web/opendc-web-ui/src/components/app/map/layers/RoomHoverLayer.js
@@ -23,45 +23,39 @@
 import React from 'react'
 import { useDispatch, useSelector } from 'react-redux'
 import { toggleTileAtLocation } from '../../../../redux/actions/topology/building'
-import RoomHoverLayerComponent from '../../../../components/app/map/layers/RoomHoverLayerComponent'
 import {
     deriveValidNextTilePositions,
     findPositionInPositions,
     findPositionInRooms,
 } from '../../../../util/tile-calculations'
+import HoverLayerComponent from './HoverLayerComponent'
 
-const RoomHoverLayer = (props) => {
+function RoomHoverLayer() {
     const dispatch = useDispatch()
     const onClick = (x, y) => dispatch(toggleTileAtLocation(x, y))
+    const isEnabled = useSelector((state) => state.construction.currentRoomInConstruction !== '-1')
+    const isValid = useSelector((state) => (x, y) => {
+        const newRoom = { ...state.objects.room[state.construction.currentRoomInConstruction] }
+        const oldRooms = Object.keys(state.objects.room)
+            .map((id) => ({ ...state.objects.room[id] }))
+            .filter(
+                (room) =>
+                    state.objects.topology[state.currentTopologyId].rooms.indexOf(room._id) !== -1 &&
+                    room._id !== state.construction.currentRoomInConstruction
+            )
 
-    const state = useSelector((state) => {
-        return {
-            mapPosition: state.map.position,
-            mapScale: state.map.scale,
-            isEnabled: () => state.construction.currentRoomInConstruction !== '-1',
-            isValid: (x, y) => {
-                const newRoom = Object.assign({}, state.objects.room[state.construction.currentRoomInConstruction])
-                const oldRooms = Object.keys(state.objects.room)
-                    .map((id) => Object.assign({}, state.objects.room[id]))
-                    .filter(
-                        (room) =>
-                            state.objects.topology[state.currentTopologyId].rooms.indexOf(room._id) !== -1 &&
-                            room._id !== state.construction.currentRoomInConstruction
-                    )
-
-                ;[...oldRooms, newRoom].forEach((room) => {
-                    room.tiles = room.tiles.map((tileId) => state.objects.tile[tileId])
-                })
-                if (newRoom.tiles.length === 0) {
-                    return findPositionInRooms(oldRooms, x, y) === -1
-                }
-
-                const validNextPositions = deriveValidNextTilePositions(oldRooms, newRoom.tiles)
-                return findPositionInPositions(validNextPositions, x, y) !== -1
-            },
+        ;[...oldRooms, newRoom].forEach((room) => {
+            room.tiles = room.tiles.map((tileId) => state.objects.tile[tileId])
+        })
+        if (newRoom.tiles.length === 0) {
+            return findPositionInRooms(oldRooms, x, y) === -1
         }
+
+        const validNextPositions = deriveValidNextTilePositions(oldRooms, newRoom.tiles)
+        return findPositionInPositions(validNextPositions, x, y) !== -1
     })
-    return <RoomHoverLayerComponent onClick={onClick} {...props} {...state} />
+
+    return <HoverLayerComponent onClick={onClick} isEnabled={isEnabled} isValid={isValid} />
 }
 
 export default RoomHoverLayer