feat(ui): Migrate to PatternFly 4 design framework

This change is a rewrite of the existing OpenDC frontend in order to
migrate to the PatternFly 4 design framework.

PatternFly is used by Red Hat for various computing related services such
as OpenShift, Red Hat Virtualization and Cockpit. Since their design
requirements are very similar to those of OpenDC (modeling computing
services), migrating to PatternFly 4 allows us to re-use design choices
from these services.

See https://www.patternfly.org/v4/ for more information about
PatternFly.

6 files changed, 0 insertions, 146 deletions

diff --git a/opendc-web/opendc-web-ui/src/containers/app/sidebars/topology/room/BackToBuildingContainer.js b/opendc-web/opendc-web-ui/src/containers/app/sidebars/topology/room/BackToBuildingContainer.js
deleted file mode 100644
index 9fa1e95f..00000000
--- a/opendc-web/opendc-web-ui/src/containers/app/sidebars/topology/room/BackToBuildingContainer.js
+++ /dev/null
@@ -1,12 +0,0 @@
-import React from 'react'
-import { useDispatch } from 'react-redux'
-import { goDownOneInteractionLevel } from '../../../../../redux/actions/interaction-level'
-import BackToBuildingComponent from '../../../../../components/app/sidebars/topology/room/BackToBuildingComponent'
-
-const BackToBuildingContainer = () => {
-    const dispatch = useDispatch()
-    const onClick = () => dispatch(goDownOneInteractionLevel())
-    return <BackToBuildingComponent onClick={onClick} />
-}
-
-export default BackToBuildingContainer
diff --git a/opendc-web/opendc-web-ui/src/containers/app/sidebars/topology/room/DeleteRoomContainer.js b/opendc-web/opendc-web-ui/src/containers/app/sidebars/topology/room/DeleteRoomContainer.js
deleted file mode 100644
index 0fbbb036..00000000
--- a/opendc-web/opendc-web-ui/src/containers/app/sidebars/topology/room/DeleteRoomContainer.js
+++ /dev/null
@@ -1,34 +0,0 @@
-import React, { useState } from 'react'
-import { useDispatch } from 'react-redux'
-import { Button } from 'reactstrap'
-import ConfirmationModal from '../../../../../components/modals/ConfirmationModal'
-import { deleteRoom } from '../../../../../redux/actions/topology/room'
-import { FontAwesomeIcon } from '@fortawesome/react-fontawesome'
-import { faTrash } from '@fortawesome/free-solid-svg-icons'
-
-const DeleteRoomContainer = () => {
-    const dispatch = useDispatch()
-    const [isVisible, setVisible] = useState(false)
-    const callback = (isConfirmed) => {
-        if (isConfirmed) {
-            dispatch(deleteRoom())
-        }
-        setVisible(false)
-    }
-    return (
-        <>
-            <Button color="danger" outline block onClick={() => setVisible(true)}>
-                <FontAwesomeIcon icon={faTrash} className="mr-2" />
-                Delete this room
-            </Button>
-            <ConfirmationModal
-                title="Delete this room"
-                message="Are you sure you want to delete this room?"
-                show={isVisible}
-                callback={callback}
-            />
-        </>
-    )
-}
-
-export default DeleteRoomContainer
diff --git a/opendc-web/opendc-web-ui/src/containers/app/sidebars/topology/room/EditRoomContainer.js b/opendc-web/opendc-web-ui/src/containers/app/sidebars/topology/room/EditRoomContainer.js
deleted file mode 100644
index ec4f586b..00000000
--- a/opendc-web/opendc-web-ui/src/containers/app/sidebars/topology/room/EditRoomContainer.js
+++ /dev/null
@@ -1,35 +0,0 @@
-import React from 'react'
-import { useDispatch, useSelector } from 'react-redux'
-import { finishRoomEdit, startRoomEdit } from '../../../../../redux/actions/topology/building'
-import { Button } from 'reactstrap'
-import { FontAwesomeIcon } from '@fortawesome/react-fontawesome'
-import { faCheck, faPencilAlt } from '@fortawesome/free-solid-svg-icons'
-
-const EditRoomContainer = () => {
-    const isEditing = useSelector((state) => state.construction.currentRoomInConstruction !== '-1')
-    const isInRackConstructionMode = useSelector((state) => state.construction.inRackConstructionMode)
-
-    const dispatch = useDispatch()
-    const onEdit = () => dispatch(startRoomEdit())
-    const onFinish = () => dispatch(finishRoomEdit())
-
-    return isEditing ? (
-        <Button color="info" outline block onClick={onFinish}>
-            <FontAwesomeIcon icon={faCheck} className="mr-2" />
-            Finish editing room
-        </Button>
-    ) : (
-        <Button
-            color="info"
-            outline
-            block
-            disabled={isInRackConstructionMode}
-            onClick={() => (isInRackConstructionMode ? undefined : onEdit())}
-        >
-            <FontAwesomeIcon icon={faPencilAlt} className="mr-2" />
-            Edit the tiles of this room
-        </Button>
-    )
-}
-
-export default EditRoomContainer
diff --git a/opendc-web/opendc-web-ui/src/containers/app/sidebars/topology/room/RackConstructionContainer.js b/opendc-web/opendc-web-ui/src/containers/app/sidebars/topology/room/RackConstructionContainer.js
deleted file mode 100644
index 79584e98..00000000
--- a/opendc-web/opendc-web-ui/src/containers/app/sidebars/topology/room/RackConstructionContainer.js
+++ /dev/null
@@ -1,24 +0,0 @@
-import React from 'react'
-import { useDispatch, useSelector } from 'react-redux'
-import { startRackConstruction, stopRackConstruction } from '../../../../../redux/actions/topology/room'
-import RackConstructionComponent from '../../../../../components/app/sidebars/topology/room/RackConstructionComponent'
-
-const RackConstructionContainer = (props) => {
-    const isRackConstructionMode = useSelector((state) => state.construction.inRackConstructionMode)
-    const isEditingRoom = useSelector((state) => state.construction.currentRoomInConstruction !== '-1')
-
-    const dispatch = useDispatch()
-    const onStart = () => dispatch(startRackConstruction())
-    const onStop = () => dispatch(stopRackConstruction())
-    return (
-        <RackConstructionComponent
-            {...props}
-            inRackConstructionMode={isRackConstructionMode}
-            isEditingRoom={isEditingRoom}
-            onStart={onStart}
-            onStop={onStop}
-        />
-    )
-}
-
-export default RackConstructionContainer
diff --git a/opendc-web/opendc-web-ui/src/containers/app/sidebars/topology/room/RoomNameContainer.js b/opendc-web/opendc-web-ui/src/containers/app/sidebars/topology/room/RoomNameContainer.js
deleted file mode 100644
index 3b35a849..00000000
--- a/opendc-web/opendc-web-ui/src/containers/app/sidebars/topology/room/RoomNameContainer.js
+++ /dev/null
@@ -1,31 +0,0 @@
-import React, { useState } from 'react'
-import { useDispatch, useSelector } from 'react-redux'
-import NameComponent from '../../../../../components/app/sidebars/topology/NameComponent'
-import TextInputModal from '../../../../../components/modals/TextInputModal'
-import { editRoomName } from '../../../../../redux/actions/topology/room'
-
-const RoomNameContainer = () => {
-    const [isVisible, setVisible] = useState(false)
-    const roomName = useSelector((state) => state.objects.room[state.interactionLevel.roomId].name)
-    const dispatch = useDispatch()
-    const callback = (name) => {
-        if (name) {
-            dispatch(editRoomName(name))
-        }
-        setVisible(false)
-    }
-    return (
-        <>
-            <NameComponent name={roomName} onEdit={() => setVisible(true)} />
-            <TextInputModal
-                title="Edit room name"
-                label="Room name"
-                show={isVisible}
-                initialValue={roomName}
-                callback={callback}
-            />
-        </>
-    )
-}
-
-export default RoomNameContainer
diff --git a/opendc-web/opendc-web-ui/src/containers/app/sidebars/topology/room/RoomSidebarContainer.js b/opendc-web/opendc-web-ui/src/containers/app/sidebars/topology/room/RoomSidebarContainer.js
deleted file mode 100644
index 252881a0..00000000
--- a/opendc-web/opendc-web-ui/src/containers/app/sidebars/topology/room/RoomSidebarContainer.js
+++ /dev/null
@@ -1,10 +0,0 @@
-import React from 'react'
-import { useSelector } from 'react-redux'
-import RoomSidebarComponent from '../../../../../components/app/sidebars/topology/room/RoomSidebarComponent'
-
-const RoomSidebarContainer = (props) => {
-    const roomId = useSelector((state) => state.interactionLevel.roomId)
-    return <RoomSidebarComponent {...props} roomId={roomId} />
-}
-
-export default RoomSidebarContainer