diff options
Diffstat (limited to 'opendc-web/opendc-web-ui/src/components')
22 files changed, 138 insertions, 61 deletions
diff --git a/opendc-web/opendc-web-ui/src/components/topologies/RoomTable.js b/opendc-web/opendc-web-ui/src/components/topologies/RoomTable.js new file mode 100644 index 00000000..9bf369e9 --- /dev/null +++ b/opendc-web/opendc-web-ui/src/components/topologies/RoomTable.js @@ -0,0 +1,69 @@ +import { Button } from '@patternfly/react-core' +import PropTypes from 'prop-types' +import React from 'react' +import { useDispatch } from 'react-redux' +import { useTopology } from '../../data/topology' +import { Table, TableBody, TableHeader } from '@patternfly/react-table' +import { deleteRoom } from '../../redux/actions/topology/room' +import TableEmptyState from '../util/TableEmptyState' + +function RoomTable({ topologyId, onSelect }) { + const dispatch = useDispatch() + const { status, data: topology } = useTopology(topologyId) + + const onDelete = (room) => dispatch(deleteRoom(room._id)) + + const columns = ['Name', 'Tiles', 'Racks'] + const rows = + topology?.rooms.length > 0 + ? topology.rooms.map((room) => { + const tileCount = room.tiles.length + const rackCount = room.tiles.filter((tile) => tile.rack).length + return [ + { + title: ( + <Button variant="link" isInline onClick={() => onSelect(room)}> + {room.name} + </Button> + ), + }, + tileCount === 1 ? '1 tile' : `${tileCount} tiles`, + rackCount === 1 ? '1 rack' : `${rackCount} racks`, + ] + }) + : [ + { + heightAuto: true, + cells: [ + { + props: { colSpan: 3 }, + title: <TableEmptyState status={status} loadingTitle="Loading Rooms" />, + }, + ], + }, + ] + + const actions = + topology?.rooms.length > 0 + ? [ + { + title: 'Delete room', + onClick: (_, rowId) => onDelete(topology.rooms[rowId]), + }, + ] + : [] + + return ( + <Table aria-label="Room list" variant="compact" cells={columns} rows={rows} actions={actions}> + <TableHeader /> + <TableBody /> + </Table> + ) +} + +RoomTable.propTypes = { + topologyId: PropTypes.string, + onSelect: PropTypes.func, +} + +export default RoomTable diff --git a/opendc-web/opendc-web-ui/src/components/topologies/TopologyMap.js b/opendc-web/opendc-web-ui/src/components/topologies/TopologyMap.js index c16f554c..2f27749f 100644 --- a/opendc-web/opendc-web-ui/src/components/topologies/TopologyMap.js +++ b/opendc-web/opendc-web-ui/src/components/topologies/TopologyMap.js @@ -39,7 +39,7 @@ import { useSelector } from 'react-redux' import TopologySidebar from './sidebar/TopologySidebar' function TopologyMap() { - const topologyIsLoading = useSelector((state) => state.currentTopologyId === '-1') + const topologyIsLoading = useSelector((state) => !state.topology.root) const interactionLevel = useSelector((state) => state.interactionLevel) const [isExpanded, setExpanded] = useState(true) diff --git a/opendc-web/opendc-web-ui/src/components/topologies/TopologyOverview.js b/opendc-web/opendc-web-ui/src/components/topologies/TopologyOverview.js index f773dcd1..213a4868 100644 --- a/opendc-web/opendc-web-ui/src/components/topologies/TopologyOverview.js +++ b/opendc-web/opendc-web-ui/src/components/topologies/TopologyOverview.js @@ -33,12 +33,13 @@ import { GridItem, Skeleton, } from '@patternfly/react-core' +import React from 'react' import { useTopology } from '../../data/topology' import { parseAndFormatDateTime } from '../../util/date-time' +import RoomTable from './RoomTable' -function TopologyOverview({ topologyId }) { +function TopologyOverview({ topologyId, onSelect }) { const { data: topology } = useTopology(topologyId) - return ( <Grid hasGutter> <GridItem md={2}> @@ -66,12 +67,21 @@ function TopologyOverview({ topologyId }) { </CardBody> </Card> </GridItem> + <GridItem md={5}> + <Card> + <CardTitle>Rooms</CardTitle> + <CardBody> + <RoomTable topologyId={topologyId} onSelect={(room) => onSelect('room', room)} /> + </CardBody> + </Card> + </GridItem> </Grid> ) } TopologyOverview.propTypes = { topologyId: PropTypes.string, + onSelect: PropTypes.func, } export default TopologyOverview diff --git a/opendc-web/opendc-web-ui/src/components/topologies/map/MapStage.js b/opendc-web/opendc-web-ui/src/components/topologies/map/MapStage.js index 5d19b3ad..d8735cf1 100644 --- a/opendc-web/opendc-web-ui/src/components/topologies/map/MapStage.js +++ b/opendc-web/opendc-web-ui/src/components/topologies/map/MapStage.js @@ -1,8 +1,8 @@ -import React, { useRef, useState } from 'react' +import React, { useRef, useState, useContext } from 'react' import { HotKeys } from 'react-hotkeys' import { Stage } from 'react-konva' import { MAP_MAX_SCALE, MAP_MIN_SCALE, MAP_MOVE_PIXELS_PER_EVENT, MAP_SCALE_PER_EVENT } from './MapConstants' -import { Provider, useStore } from 'react-redux' +import { ReactReduxContext } from 'react-redux' import useResizeObserver from 'use-resize-observer' import { mapContainer } from './MapStage.module.scss' import MapLayer from './layers/MapLayer' @@ -12,7 +12,7 @@ import ScaleIndicator from './controls/ScaleIndicator' import Toolbar from './controls/Toolbar' function MapStage() { - const store = useStore() + const reduxContext = useContext(ReactReduxContext) const { ref, width = 100, height = 100 } = useResizeObserver() const stageRef = useRef(null) const [[x, y], setPos] = useState([0, 0]) @@ -68,11 +68,11 @@ function MapStage() { x={x} y={y} > - <Provider store={store}> + <ReactReduxContext.Provider value={reduxContext}> <MapLayer /> <RoomHoverLayer /> <ObjectHoverLayer /> - </Provider> + </ReactReduxContext.Provider> </Stage> <ScaleIndicator scale={scale} /> <Toolbar onZoom={onZoomButton} onExport={onExport} /> diff --git a/opendc-web/opendc-web-ui/src/components/topologies/map/RackEnergyFillContainer.js b/opendc-web/opendc-web-ui/src/components/topologies/map/RackEnergyFillContainer.js index c35cbde7..be1f3e45 100644 --- a/opendc-web/opendc-web-ui/src/components/topologies/map/RackEnergyFillContainer.js +++ b/opendc-web/opendc-web-ui/src/components/topologies/map/RackEnergyFillContainer.js @@ -6,18 +6,18 @@ import RackFillBar from './elements/RackFillBar' function RackSpaceFillContainer({ tileId, ...props }) { const fillFraction = useSelector((state) => { let energyConsumptionTotal = 0 - const rack = state.objects.rack[state.objects.tile[tileId].rack] + const rack = state.topology.racks[state.topology.tiles[tileId].rack] const machineIds = rack.machines machineIds.forEach((machineId) => { if (machineId !== null) { - const machine = state.objects.machine[machineId] - machine.cpus.forEach((id) => (energyConsumptionTotal += state.objects.cpu[id].energyConsumptionW)) - machine.gpus.forEach((id) => (energyConsumptionTotal += state.objects.gpu[id].energyConsumptionW)) + const machine = state.topology.machines[machineId] + machine.cpus.forEach((id) => (energyConsumptionTotal += state.topology.cpus[id].energyConsumptionW)) + machine.gpus.forEach((id) => (energyConsumptionTotal += state.topology.gpus[id].energyConsumptionW)) machine.memories.forEach( - (id) => (energyConsumptionTotal += state.objects.memory[id].energyConsumptionW) + (id) => (energyConsumptionTotal += state.topology.memories[id].energyConsumptionW) ) machine.storages.forEach( - (id) => (energyConsumptionTotal += state.objects.storage[id].energyConsumptionW) + (id) => (energyConsumptionTotal += state.topology.storages[id].energyConsumptionW) ) } }) diff --git a/opendc-web/opendc-web-ui/src/components/topologies/map/RackSpaceFillContainer.js b/opendc-web/opendc-web-ui/src/components/topologies/map/RackSpaceFillContainer.js index a6766f33..0c15d54b 100644 --- a/opendc-web/opendc-web-ui/src/components/topologies/map/RackSpaceFillContainer.js +++ b/opendc-web/opendc-web-ui/src/components/topologies/map/RackSpaceFillContainer.js @@ -26,7 +26,7 @@ import { useSelector } from 'react-redux' import RackFillBar from './elements/RackFillBar' function RackSpaceFillContainer({ tileId, ...props }) { - const rack = useSelector((state) => state.objects.rack[state.objects.tile[tileId].rack]) + const rack = useSelector((state) => state.topology.racks[state.topology.tiles[tileId].rack]) return <RackFillBar {...props} type="space" fillFraction={rack.machines.length / rack.capacity} /> } diff --git a/opendc-web/opendc-web-ui/src/components/topologies/map/RoomContainer.js b/opendc-web/opendc-web-ui/src/components/topologies/map/RoomContainer.js index 93ba9c93..65189891 100644 --- a/opendc-web/opendc-web-ui/src/components/topologies/map/RoomContainer.js +++ b/opendc-web/opendc-web-ui/src/components/topologies/map/RoomContainer.js @@ -31,7 +31,7 @@ function RoomContainer({ roomId, ...props }) { return { interactionLevel: state.interactionLevel, currentRoomInConstruction: state.construction.currentRoomInConstruction, - room: state.objects.room[roomId], + room: state.topology.rooms[roomId], } }) const dispatch = useDispatch() diff --git a/opendc-web/opendc-web-ui/src/components/topologies/map/TileContainer.js b/opendc-web/opendc-web-ui/src/components/topologies/map/TileContainer.js index 149e26a1..411a5ca7 100644 --- a/opendc-web/opendc-web-ui/src/components/topologies/map/TileContainer.js +++ b/opendc-web/opendc-web-ui/src/components/topologies/map/TileContainer.js @@ -28,7 +28,7 @@ import TileGroup from './groups/TileGroup' function TileContainer({ tileId, ...props }) { const interactionLevel = useSelector((state) => state.interactionLevel) - const tile = useSelector((state) => state.objects.tile[tileId]) + const tile = useSelector((state) => state.topology.tiles[tileId]) const dispatch = useDispatch() const onClick = (tile) => { diff --git a/opendc-web/opendc-web-ui/src/components/topologies/map/TopologyContainer.js b/opendc-web/opendc-web-ui/src/components/topologies/map/TopologyContainer.js index eaebabd5..cc0d46b3 100644 --- a/opendc-web/opendc-web-ui/src/components/topologies/map/TopologyContainer.js +++ b/opendc-web/opendc-web-ui/src/components/topologies/map/TopologyContainer.js @@ -22,11 +22,10 @@ import React from 'react' import { useSelector } from 'react-redux' -import { useActiveTopology } from '../../../data/topology' import TopologyGroup from './groups/TopologyGroup' function TopologyContainer() { - const topology = useActiveTopology() + const topology = useSelector((state) => state.topology.root) const interactionLevel = useSelector((state) => state.interactionLevel) return <TopologyGroup topology={topology} interactionLevel={interactionLevel} /> diff --git a/opendc-web/opendc-web-ui/src/components/topologies/map/WallContainer.js b/opendc-web/opendc-web-ui/src/components/topologies/map/WallContainer.js index 77f553dd..143f70c2 100644 --- a/opendc-web/opendc-web-ui/src/components/topologies/map/WallContainer.js +++ b/opendc-web/opendc-web-ui/src/components/topologies/map/WallContainer.js @@ -26,7 +26,9 @@ import { useSelector } from 'react-redux' import WallGroup from './groups/WallGroup' function WallContainer({ roomId, ...props }) { - const tiles = useSelector((state) => state.objects.room[roomId].tiles.map((tileId) => state.objects.tile[tileId])) + const tiles = useSelector((state) => { + return state.topology.rooms[roomId].tiles.map((tileId) => state.topology.tiles[tileId]) + }) return <WallGroup {...props} tiles={tiles} /> } diff --git a/opendc-web/opendc-web-ui/src/components/topologies/map/layers/ObjectHoverLayer.js b/opendc-web/opendc-web-ui/src/components/topologies/map/layers/ObjectHoverLayer.js index 47d9c992..1f00de36 100644 --- a/opendc-web/opendc-web-ui/src/components/topologies/map/layers/ObjectHoverLayer.js +++ b/opendc-web/opendc-web-ui/src/components/topologies/map/layers/ObjectHoverLayer.js @@ -34,8 +34,8 @@ function ObjectHoverLayer() { return false } - const currentRoom = state.objects.room[state.interactionLevel.roomId] - const tiles = currentRoom.tiles.map((tileId) => state.objects.tile[tileId]) + const currentRoom = state.topology.rooms[state.interactionLevel.roomId] + const tiles = currentRoom.tiles.map((tileId) => state.topology.tiles[tileId]) const tile = findTileWithPosition(tiles, x, y) return !(tile === null || tile.rack) diff --git a/opendc-web/opendc-web-ui/src/components/topologies/map/layers/RoomHoverLayer.js b/opendc-web/opendc-web-ui/src/components/topologies/map/layers/RoomHoverLayer.js index 59f83b2b..5e351691 100644 --- a/opendc-web/opendc-web-ui/src/components/topologies/map/layers/RoomHoverLayer.js +++ b/opendc-web/opendc-web-ui/src/components/topologies/map/layers/RoomHoverLayer.js @@ -35,17 +35,17 @@ function RoomHoverLayer() { 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] })) + const newRoom = { ...state.topology.rooms[state.construction.currentRoomInConstruction] } + const oldRooms = Object.keys(state.topology.rooms) + .map((id) => ({ ...state.topology.rooms[id] })) .filter( (room) => - state.objects.topology[state.currentTopologyId].rooms.indexOf(room._id) !== -1 && + state.topology.root.rooms.indexOf(room._id) !== -1 && room._id !== state.construction.currentRoomInConstruction ) ;[...oldRooms, newRoom].forEach((room) => { - room.tiles = room.tiles.map((tileId) => state.objects.tile[tileId]) + room.tiles = room.tiles.map((tileId) => state.topology.tiles[tileId]) }) if (newRoom.tiles.length === 0) { return findPositionInRooms(oldRooms, x, y) === -1 diff --git a/opendc-web/opendc-web-ui/src/components/topologies/sidebar/machine/DeleteMachine.js b/opendc-web/opendc-web-ui/src/components/topologies/sidebar/machine/DeleteMachine.js index 00ce4603..a4b9457b 100644 --- a/opendc-web/opendc-web-ui/src/components/topologies/sidebar/machine/DeleteMachine.js +++ b/opendc-web/opendc-web-ui/src/components/topologies/sidebar/machine/DeleteMachine.js @@ -20,21 +20,20 @@ * SOFTWARE. */ +import PropTypes from 'prop-types' import React, { useState } from 'react' -import { useDispatch, useSelector } from 'react-redux' +import { useDispatch } from 'react-redux' import { Button } from '@patternfly/react-core' import { TrashIcon } from '@patternfly/react-icons' import ConfirmationModal from '../../../util/modals/ConfirmationModal' import { deleteMachine } from '../../../../redux/actions/topology/machine' -function DeleteMachine() { +function DeleteMachine({ machineId }) { const dispatch = useDispatch() const [isVisible, setVisible] = useState(false) - const rackId = useSelector((state) => state.objects.tile[state.interactionLevel.tileId].rack) - const position = useSelector((state) => state.interactionLevel.position) const callback = (isConfirmed) => { if (isConfirmed) { - dispatch(deleteMachine(rackId, position)) + dispatch(deleteMachine(machineId)) } setVisible(false) } @@ -53,4 +52,8 @@ function DeleteMachine() { ) } +DeleteMachine.propTypes = { + machineId: PropTypes.string.isRequired, +} + export default DeleteMachine diff --git a/opendc-web/opendc-web-ui/src/components/topologies/sidebar/machine/MachineSidebar.js b/opendc-web/opendc-web-ui/src/components/topologies/sidebar/machine/MachineSidebar.js index 0c3dea98..9268f615 100644 --- a/opendc-web/opendc-web-ui/src/components/topologies/sidebar/machine/MachineSidebar.js +++ b/opendc-web/opendc-web-ui/src/components/topologies/sidebar/machine/MachineSidebar.js @@ -13,9 +13,9 @@ import { import { useSelector } from 'react-redux' function MachineSidebar({ tileId, position }) { - const machine = useSelector(({ objects }) => { - const rack = objects.rack[objects.tile[tileId].rack] - return objects.machine[rack.machines[position - 1]] + const machine = useSelector(({ topology }) => { + const rack = topology.racks[topology.tiles[tileId].rack] + return topology.machines[rack.machines[position - 1]] }) const machineId = machine._id return ( @@ -30,7 +30,7 @@ function MachineSidebar({ tileId, position }) { </TextList> <Title headingLevel="h2">Actions</Title> - <DeleteMachine /> + <DeleteMachine machineId={machineId} /> <Title headingLevel="h2">Units</Title> </TextContent> diff --git a/opendc-web/opendc-web-ui/src/components/topologies/sidebar/machine/UnitAddContainer.js b/opendc-web/opendc-web-ui/src/components/topologies/sidebar/machine/UnitAddContainer.js index fc805b95..6b136120 100644 --- a/opendc-web/opendc-web-ui/src/components/topologies/sidebar/machine/UnitAddContainer.js +++ b/opendc-web/opendc-web-ui/src/components/topologies/sidebar/machine/UnitAddContainer.js @@ -27,7 +27,7 @@ import UnitAddComponent from './UnitAddComponent' import { addUnit } from '../../../../redux/actions/topology/machine' function UnitAddContainer({ machineId, unitType }) { - const units = useSelector((state) => Object.values(state.objects[unitType])) + const units = useSelector((state) => Object.values(state.topology[unitType])) const dispatch = useDispatch() const onAdd = (id) => dispatch(addUnit(machineId, unitType, id)) diff --git a/opendc-web/opendc-web-ui/src/components/topologies/sidebar/machine/UnitListContainer.js b/opendc-web/opendc-web-ui/src/components/topologies/sidebar/machine/UnitListContainer.js index 901fa45b..6dcc414f 100644 --- a/opendc-web/opendc-web-ui/src/components/topologies/sidebar/machine/UnitListContainer.js +++ b/opendc-web/opendc-web-ui/src/components/topologies/sidebar/machine/UnitListContainer.js @@ -26,18 +26,11 @@ import { useDispatch, useSelector } from 'react-redux' import UnitListComponent from './UnitListComponent' import { deleteUnit } from '../../../../redux/actions/topology/machine' -const unitMapping = { - cpu: 'cpus', - gpu: 'gpus', - memory: 'memories', - storage: 'storages', -} - function UnitListContainer({ machineId, unitType }) { const dispatch = useDispatch() const units = useSelector((state) => { - const machine = state.objects.machine[machineId] - return machine[unitMapping[unitType]].map((id) => state.objects[unitType][id]) + const machine = state.topology.machines[machineId] + return machine[unitType].map((id) => state.topology[unitType][id]) }) const onDelete = (unit) => dispatch(deleteUnit(machineId, unitType, unit._id)) diff --git a/opendc-web/opendc-web-ui/src/components/topologies/sidebar/machine/UnitTabsComponent.js b/opendc-web/opendc-web-ui/src/components/topologies/sidebar/machine/UnitTabsComponent.js index 6d10d2df..b800e9d4 100644 --- a/opendc-web/opendc-web-ui/src/components/topologies/sidebar/machine/UnitTabsComponent.js +++ b/opendc-web/opendc-web-ui/src/components/topologies/sidebar/machine/UnitTabsComponent.js @@ -10,20 +10,20 @@ function UnitTabsComponent({ machineId }) { return ( <Tabs activeKey={activeTab} onSelect={(_, tab) => setActiveTab(tab)}> <Tab eventKey="cpu-units" title={<TabTitleText>CPU</TabTitleText>}> - <UnitAddContainer machineId={machineId} unitType="cpu" /> - <UnitListContainer machineId={machineId} unitType="cpu" /> + <UnitAddContainer machineId={machineId} unitType="cpus" /> + <UnitListContainer machineId={machineId} unitType="cpus" /> </Tab> <Tab eventKey="gpu-units" title={<TabTitleText>GPU</TabTitleText>}> - <UnitAddContainer machineId={machineId} unitType="gpu" /> - <UnitListContainer machineId={machineId} unitType="gpu" /> + <UnitAddContainer machineId={machineId} unitType="gpus" /> + <UnitListContainer machineId={machineId} unitType="gpus" /> </Tab> <Tab eventKey="memory-units" title={<TabTitleText>Memory</TabTitleText>}> - <UnitAddContainer machineId={machineId} unitType="memory" /> - <UnitListContainer machineId={machineId} unitType="memory" /> + <UnitAddContainer machineId={machineId} unitType="memories" /> + <UnitListContainer machineId={machineId} unitType="memories" /> </Tab> <Tab eventKey="storage-units" title={<TabTitleText>Storage</TabTitleText>}> - <UnitAddContainer machineId={machineId} unitType="storage" /> - <UnitListContainer machineId={machineId} unitType="storage" /> + <UnitAddContainer machineId={machineId} unitType="storages" /> + <UnitListContainer machineId={machineId} unitType="storages" /> </Tab> </Tabs> ) diff --git a/opendc-web/opendc-web-ui/src/components/topologies/sidebar/rack/DeleteRackContainer.js b/opendc-web/opendc-web-ui/src/components/topologies/sidebar/rack/DeleteRackContainer.js index 80c6349a..0583a7a4 100644 --- a/opendc-web/opendc-web-ui/src/components/topologies/sidebar/rack/DeleteRackContainer.js +++ b/opendc-web/opendc-web-ui/src/components/topologies/sidebar/rack/DeleteRackContainer.js @@ -22,7 +22,7 @@ import PropTypes from 'prop-types' import React, { useState } from 'react' -import { useDispatch } from 'react-redux' +import { useDispatch, useSelector } from 'react-redux' import TrashIcon from '@patternfly/react-icons/dist/js/icons/trash-icon' import { Button } from '@patternfly/react-core' import ConfirmationModal from '../../../util/modals/ConfirmationModal' @@ -31,9 +31,10 @@ import { deleteRack } from '../../../../redux/actions/topology/rack' function DeleteRackContainer({ tileId }) { const dispatch = useDispatch() const [isVisible, setVisible] = useState(false) + const rackId = useSelector((state) => state.topology.tiles[tileId].rack) const callback = (isConfirmed) => { if (isConfirmed) { - dispatch(deleteRack(tileId)) + dispatch(deleteRack(tileId, rackId)) } setVisible(false) } diff --git a/opendc-web/opendc-web-ui/src/components/topologies/sidebar/rack/MachineListContainer.js b/opendc-web/opendc-web-ui/src/components/topologies/sidebar/rack/MachineListContainer.js index 6fbff949..619bb4e2 100644 --- a/opendc-web/opendc-web-ui/src/components/topologies/sidebar/rack/MachineListContainer.js +++ b/opendc-web/opendc-web-ui/src/components/topologies/sidebar/rack/MachineListContainer.js @@ -28,8 +28,8 @@ import { goFromRackToMachine } from '../../../../redux/actions/interaction-level import { addMachine } from '../../../../redux/actions/topology/rack' function MachineListContainer({ tileId, ...props }) { - const rack = useSelector((state) => state.objects.rack[state.objects.tile[tileId].rack]) - const machines = useSelector((state) => rack.machines.map((id) => state.objects.machine[id])) + const rack = useSelector((state) => state.topology.racks[state.topology.tiles[tileId].rack]) + const machines = useSelector((state) => rack.machines.map((id) => state.topology.machines[id])) const machinesNull = useMemo(() => { const res = Array(rack.capacity).fill(null) for (const machine of machines) { diff --git a/opendc-web/opendc-web-ui/src/components/topologies/sidebar/rack/RackNameContainer.js b/opendc-web/opendc-web-ui/src/components/topologies/sidebar/rack/RackNameContainer.js index 09d73af7..30f38cce 100644 --- a/opendc-web/opendc-web-ui/src/components/topologies/sidebar/rack/RackNameContainer.js +++ b/opendc-web/opendc-web-ui/src/components/topologies/sidebar/rack/RackNameContainer.js @@ -5,7 +5,7 @@ import NameComponent from '../NameComponent' import { editRackName } from '../../../../redux/actions/topology/rack' const RackNameContainer = ({ tileId }) => { - const { name: rackName, _id } = useSelector((state) => state.objects.rack[state.objects.tile[tileId].rack]) + const { name: rackName, _id } = useSelector((state) => state.topology.racks[state.topology.tiles[tileId].rack]) const dispatch = useDispatch() const callback = (name) => { if (name) { diff --git a/opendc-web/opendc-web-ui/src/components/topologies/sidebar/rack/RackSidebar.js b/opendc-web/opendc-web-ui/src/components/topologies/sidebar/rack/RackSidebar.js index 3c9f152a..8f6ff135 100644 --- a/opendc-web/opendc-web-ui/src/components/topologies/sidebar/rack/RackSidebar.js +++ b/opendc-web/opendc-web-ui/src/components/topologies/sidebar/rack/RackSidebar.js @@ -17,7 +17,7 @@ import { import { useSelector } from 'react-redux' function RackSidebar({ tileId }) { - const rack = useSelector((state) => state.objects.rack[state.objects.tile[tileId].rack]) + const rack = useSelector((state) => state.topology.racks[state.topology.tiles[tileId].rack]) return ( <div className={sidebarContainer}> diff --git a/opendc-web/opendc-web-ui/src/components/topologies/sidebar/room/RoomName.js b/opendc-web/opendc-web-ui/src/components/topologies/sidebar/room/RoomName.js index e8d8b33c..fb52d826 100644 --- a/opendc-web/opendc-web-ui/src/components/topologies/sidebar/room/RoomName.js +++ b/opendc-web/opendc-web-ui/src/components/topologies/sidebar/room/RoomName.js @@ -27,7 +27,7 @@ import NameComponent from '../NameComponent' import { editRoomName } from '../../../../redux/actions/topology/room' function RoomName({ roomId }) { - const { name: roomName, _id } = useSelector((state) => state.objects.room[roomId]) + const { name: roomName, _id } = useSelector((state) => state.topology.rooms[roomId]) const dispatch = useDispatch() const callback = (name) => { if (name) { |