ui: Move modal state outside of Redux

This change updates the frontend so that the modal state is not stored
inside Redux but instead is stored using the useState hook. This
simplifies the design of the modal components.

1 files changed, 20 insertions, 1 deletions

diff --git a/opendc-web/opendc-web-ui/src/store/hooks/topology.js b/opendc-web/opendc-web-ui/src/store/hooks/topology.js
index e5e14804..d3ffb3e1 100644
--- a/opendc-web/opendc-web-ui/src/store/hooks/topology.js
+++ b/opendc-web/opendc-web-ui/src/store/hooks/topology.js
@@ -25,6 +25,25 @@ import { useSelector } from 'react-redux'
 /**
  * Return the current active topology.
  */
-export function useTopology() {
+export function useActiveTopology() {
     return useSelector((state) => state.currentTopologyId !== '-1' && state.objects.topology[state.currentTopologyId])
 }
+
+/**
+ * Return the topologies for the active project.
+ */
+export function useProjectTopologies() {
+    return useSelector(({ currentProjectId, objects }) => {
+        if (currentProjectId === '-1' || !objects.project[currentProjectId]) {
+            return []
+        }
+
+        const topologies = objects.project[currentProjectId].topologyIds.map((t) => objects.topology[t])
+
+        if (topologies.filter((t) => !t).length > 0) {
+            return []
+        }
+
+        return topologies
+    })
+}