refactor(web/ui): Fix compatibility with new API

This change updates the web interface in React to be compatible with the
new API written in Kotlin. Several changes have been made in the new API
to ensure consistency.

10 files changed, 24 insertions, 22 deletions

diff --git a/opendc-web/opendc-web-ui/src/redux/actions/topology/building.js b/opendc-web/opendc-web-ui/src/redux/actions/topology/building.js
index 939c24a4..e430da2e 100644
--- a/opendc-web/opendc-web-ui/src/redux/actions/topology/building.js
+++ b/opendc-web/opendc-web-ui/src/redux/actions/topology/building.js
@@ -14,16 +14,16 @@ export const DELETE_TILE = 'DELETE_TILE'
 export function startNewRoomConstruction() {
     return (dispatch, getState) => {
         const { topology } = getState()
-        const topologyId = topology.root._id
+        const topologyId = topology.root.id
         const room = {
-            _id: uuid(),
+            id: uuid(),
             name: 'Room',
             topologyId,
             tiles: [],
         }
 
         dispatch(addRoom(topologyId, room))
-        dispatch(startNewRoomConstructionSucceeded(room._id))
+        dispatch(startNewRoomConstructionSucceeded(room.id))
     }
 }
 
@@ -97,7 +97,7 @@ export function addTile(roomId, positionX, positionY) {
     return {
         type: ADD_TILE,
         tile: {
-            _id: uuid(),
+            id: uuid(),
             roomId,
             positionX,
             positionY,
diff --git a/opendc-web/opendc-web-ui/src/redux/actions/topology/index.js b/opendc-web/opendc-web-ui/src/redux/actions/topology/index.js
index 94a712c4..d48af37a 100644
--- a/opendc-web/opendc-web-ui/src/redux/actions/topology/index.js
+++ b/opendc-web/opendc-web-ui/src/redux/actions/topology/index.js
@@ -23,9 +23,10 @@
 export const OPEN_TOPOLOGY = 'OPEN_TOPOLOGY'
 export const STORE_TOPOLOGY = 'STORE_TOPOLOGY'
 
-export function openTopology(id) {
+export function openTopology(projectId, id) {
     return {
         type: OPEN_TOPOLOGY,
+        projectId,
         id,
     }
 }
diff --git a/opendc-web/opendc-web-ui/src/redux/actions/topology/rack.js b/opendc-web/opendc-web-ui/src/redux/actions/topology/rack.js
index c319d966..308acaa6 100644
--- a/opendc-web/opendc-web-ui/src/redux/actions/topology/rack.js
+++ b/opendc-web/opendc-web-ui/src/redux/actions/topology/rack.js
@@ -24,7 +24,7 @@ export function addMachine(rackId, position) {
     return {
         type: ADD_MACHINE,
         machine: {
-            _id: uuid(),
+            id: uuid(),
             rackId,
             position,
             cpus: [],
diff --git a/opendc-web/opendc-web-ui/src/redux/actions/topology/room.js b/opendc-web/opendc-web-ui/src/redux/actions/topology/room.js
index bd447db5..fd2d8cdc 100644
--- a/opendc-web/opendc-web-ui/src/redux/actions/topology/room.js
+++ b/opendc-web/opendc-web-ui/src/redux/actions/topology/room.js
@@ -16,7 +16,7 @@ export function addRoom(topologyId, room) {
     return {
         type: ADD_ROOM,
         room: {
-            _id: uuid(),
+            id: uuid(),
             topologyId,
             ...room,
         },
@@ -54,9 +54,9 @@ export function addRackToTile(positionX, positionY) {
             dispatch({
                 type: ADD_RACK_TO_TILE,
                 rack: {
-                    _id: uuid(),
+                    id: uuid(),
                     name: 'Rack',
-                    tileId: tile._id,
+                    tileId: tile.id,
                     capacity: DEFAULT_RACK_SLOT_CAPACITY,
                     powerCapacityW: DEFAULT_RACK_POWER_CAPACITY,
                     machines: [],
diff --git a/opendc-web/opendc-web-ui/src/redux/reducers/topology/machine.js b/opendc-web/opendc-web-ui/src/redux/reducers/topology/machine.js
index 47af53cf..1789257b 100644
--- a/opendc-web/opendc-web-ui/src/redux/reducers/topology/machine.js
+++ b/opendc-web/opendc-web-ui/src/redux/reducers/topology/machine.js
@@ -10,7 +10,7 @@ function machine(state = {}, action, { racks }) {
         case ADD_MACHINE:
             return produce(state, (draft) => {
                 const { machine } = action
-                draft[machine._id] = machine
+                draft[machine.id] = machine
             })
         case DELETE_MACHINE:
             return produce(state, (draft) => {
diff --git a/opendc-web/opendc-web-ui/src/redux/reducers/topology/rack.js b/opendc-web/opendc-web-ui/src/redux/reducers/topology/rack.js
index 155837cb..ca79348a 100644
--- a/opendc-web/opendc-web-ui/src/redux/reducers/topology/rack.js
+++ b/opendc-web/opendc-web-ui/src/redux/reducers/topology/rack.js
@@ -33,7 +33,7 @@ function rack(state = {}, action, { machines }) {
         case ADD_RACK_TO_TILE:
             return produce(state, (draft) => {
                 const { rack } = action
-                draft[rack._id] = rack
+                draft[rack.id] = rack
             })
         case EDIT_RACK_NAME:
             return produce(state, (draft) => {
@@ -48,7 +48,7 @@ function rack(state = {}, action, { machines }) {
         case ADD_MACHINE:
             return produce(state, (draft) => {
                 const { machine } = action
-                draft[machine.rackId].machines.push(machine._id)
+                draft[machine.rackId].machines.push(machine.id)
             })
         case DELETE_MACHINE:
             return produce(state, (draft) => {
diff --git a/opendc-web/opendc-web-ui/src/redux/reducers/topology/room.js b/opendc-web/opendc-web-ui/src/redux/reducers/topology/room.js
index d6cc51c1..c05c8bfa 100644
--- a/opendc-web/opendc-web-ui/src/redux/reducers/topology/room.js
+++ b/opendc-web/opendc-web-ui/src/redux/reducers/topology/room.js
@@ -32,7 +32,7 @@ function room(state = {}, action, { tiles }) {
         case ADD_ROOM:
             return produce(state, (draft) => {
                 const { room } = action
-                draft[room._id] = room
+                draft[room.id] = room
             })
         case DELETE_ROOM:
             return produce(state, (draft) => {
@@ -47,7 +47,7 @@ function room(state = {}, action, { tiles }) {
         case ADD_TILE:
             return produce(state, (draft) => {
                 const { tile } = action
-                draft[tile.roomId].tiles.push(tile._id)
+                draft[tile.roomId].tiles.push(tile.id)
             })
         case DELETE_TILE:
             return produce(state, (draft) => {
diff --git a/opendc-web/opendc-web-ui/src/redux/reducers/topology/tile.js b/opendc-web/opendc-web-ui/src/redux/reducers/topology/tile.js
index 6dbccb66..8e5ecd6e 100644
--- a/opendc-web/opendc-web-ui/src/redux/reducers/topology/tile.js
+++ b/opendc-web/opendc-web-ui/src/redux/reducers/topology/tile.js
@@ -33,7 +33,7 @@ function tile(state = {}, action, { racks }) {
         case ADD_TILE:
             return produce(state, (draft) => {
                 const { tile } = action
-                draft[tile._id] = tile
+                draft[tile.id] = tile
             })
         case DELETE_TILE:
             return produce(state, (draft) => {
@@ -43,7 +43,7 @@ function tile(state = {}, action, { racks }) {
         case ADD_RACK_TO_TILE:
             return produce(state, (draft) => {
                 const { rack } = action
-                draft[rack.tileId].rack = rack._id
+                draft[rack.tileId].rack = rack.id
             })
         case DELETE_RACK:
             return produce(state, (draft) => {
diff --git a/opendc-web/opendc-web-ui/src/redux/reducers/topology/topology.js b/opendc-web/opendc-web-ui/src/redux/reducers/topology/topology.js
index cd9b5efd..dff0a69e 100644
--- a/opendc-web/opendc-web-ui/src/redux/reducers/topology/topology.js
+++ b/opendc-web/opendc-web-ui/src/redux/reducers/topology/topology.js
@@ -21,7 +21,7 @@
  */
 
 import produce from 'immer'
-import { STORE_TOPOLOGY } from "../../actions/topology";
+import { STORE_TOPOLOGY } from '../../actions/topology'
 import { ADD_ROOM, DELETE_ROOM } from '../../actions/topology/room'
 
 function topology(state = undefined, action) {
@@ -31,7 +31,7 @@ function topology(state = undefined, action) {
         case ADD_ROOM:
             return produce(state, (draft) => {
                 const { room } = action
-                draft.rooms.push(room._id)
+                draft.rooms.push(room.id)
             })
         case DELETE_ROOM:
             return produce(state, (draft) => {
diff --git a/opendc-web/opendc-web-ui/src/redux/sagas/topology.js b/opendc-web/opendc-web-ui/src/redux/sagas/topology.js
index 4c8ff5da..15147bcf 100644
--- a/opendc-web/opendc-web-ui/src/redux/sagas/topology.js
+++ b/opendc-web/opendc-web-ui/src/redux/sagas/topology.js
@@ -32,14 +32,15 @@ export function* updateServer() {
  * Watch the topology on the server for changes.
  */
 export function* watchServer() {
-    let { id } = yield take(OPEN_TOPOLOGY)
+    let { projectId, id } = yield take(OPEN_TOPOLOGY)
     while (true) {
-        const channel = yield queryObserver(id)
+        const channel = yield queryObserver(projectId, id)
 
         while (true) {
             const [action, response] = yield race([take(OPEN_TOPOLOGY), take(channel)])
 
             if (action) {
+                projectId = action.projectId
                 id = action.id
                 break
             }
@@ -57,9 +58,9 @@ export function* watchServer() {
 /**
  * Observe changes for the topology with the specified identifier.
  */
-function* queryObserver(id) {
+function* queryObserver(projectId, id) {
     const queryClient = yield getContext('queryClient')
-    const observer = new QueryObserver(queryClient, { queryKey: ['topologies', id] })
+    const observer = new QueryObserver(queryClient, { queryKey: ['topologies', projectId, id] })
 
     return eventChannel((emitter) => {
         const unsubscribe = observer.subscribe((result) => {