From b4bdf9fde013bb7ff9579693b64ff575f7b00e44 Mon Sep 17 00:00:00 2001
From: Georgios Andreadis <info@gandreadis.com>
Date: Tue, 7 Jul 2020 09:55:10 +0200
Subject: Rename simulations to projects and remove experiment view

---
 .../app/sidebars/elements/LoadBarComponent.js      | 22 --------------
 .../simulation/ExperimentMetadataComponent.js      | 23 --------------
 .../app/sidebars/simulation/LoadMetricComponent.js | 35 ----------------------
 .../simulation/SimulationSidebarComponent.js       | 18 -----------
 .../simulation/SimulationSidebarComponent.sass     |  8 -----
 .../topology/building/BuildingSidebarComponent.js  | 11 ++-----
 .../topology/machine/MachineSidebarComponent.js    | 13 ++------
 .../app/sidebars/topology/machine/UnitComponent.js | 12 +++-----
 .../sidebars/topology/machine/UnitListComponent.js | 12 +++-----
 .../sidebars/topology/machine/UnitTabsComponent.js | 10 +++----
 .../sidebars/topology/rack/EmptySlotComponent.js   | 14 ++++-----
 .../app/sidebars/topology/rack/MachineComponent.js |  9 +-----
 .../sidebars/topology/rack/RackSidebarComponent.js | 15 ++--------
 .../sidebars/topology/room/RoomSidebarComponent.js | 19 +++---------
 14 files changed, 29 insertions(+), 192 deletions(-)
 delete mode 100644 frontend/src/components/app/sidebars/elements/LoadBarComponent.js
 delete mode 100644 frontend/src/components/app/sidebars/simulation/ExperimentMetadataComponent.js
 delete mode 100644 frontend/src/components/app/sidebars/simulation/LoadMetricComponent.js
 delete mode 100644 frontend/src/components/app/sidebars/simulation/SimulationSidebarComponent.js
 delete mode 100644 frontend/src/components/app/sidebars/simulation/SimulationSidebarComponent.sass

(limited to 'frontend/src/components/app/sidebars')

diff --git a/frontend/src/components/app/sidebars/elements/LoadBarComponent.js b/frontend/src/components/app/sidebars/elements/LoadBarComponent.js
deleted file mode 100644
index 01005085..00000000
--- a/frontend/src/components/app/sidebars/elements/LoadBarComponent.js
+++ /dev/null
@@ -1,22 +0,0 @@
-import classNames from 'classnames'
-import React from 'react'
-
-const LoadBarComponent = ({ percent, disabled }) => (
-    <div className="mt-1">
-        <strong>Current load</strong>
-        <div className={classNames('progress', { disabled })}>
-            <div
-                className="progress-bar"
-                role="progressbar"
-                aria-valuenow={percent}
-                aria-valuemin="0"
-                aria-valuemax="100"
-                style={{ width: percent + '%' }}
-            >
-                {percent}%
-            </div>
-        </div>
-    </div>
-)
-
-export default LoadBarComponent
diff --git a/frontend/src/components/app/sidebars/simulation/ExperimentMetadataComponent.js b/frontend/src/components/app/sidebars/simulation/ExperimentMetadataComponent.js
deleted file mode 100644
index 30990a13..00000000
--- a/frontend/src/components/app/sidebars/simulation/ExperimentMetadataComponent.js
+++ /dev/null
@@ -1,23 +0,0 @@
-import React from 'react'
-
-const ExperimentMetadataComponent = ({
-                                         experimentName,
-                                         topologyName,
-                                         traceName,
-                                         schedulerName,
-                                     }) => (
-    <div>
-        <h2>{experimentName}</h2>
-        <p>
-            Topology: <strong>{topologyName}</strong>
-        </p>
-        <p>
-            Trace: <strong>{traceName}</strong>
-        </p>
-        <p>
-            Scheduler: <strong>{schedulerName}</strong>
-        </p>
-    </div>
-)
-
-export default ExperimentMetadataComponent
diff --git a/frontend/src/components/app/sidebars/simulation/LoadMetricComponent.js b/frontend/src/components/app/sidebars/simulation/LoadMetricComponent.js
deleted file mode 100644
index 6ee6a3b9..00000000
--- a/frontend/src/components/app/sidebars/simulation/LoadMetricComponent.js
+++ /dev/null
@@ -1,35 +0,0 @@
-import React from 'react'
-import { SIM_HIGH_COLOR, SIM_LOW_COLOR, SIM_MID_HIGH_COLOR, SIM_MID_LOW_COLOR } from '../../../../util/colors'
-import { LOAD_NAME_MAP } from '../../../../util/simulation-load'
-
-const LoadMetricComponent = ({ loadMetric }) => (
-    <div>
-        <div>
-            Colors represent <strong>{LOAD_NAME_MAP[loadMetric]}</strong>
-        </div>
-        <div className="btn-group mb-2" style={{ display: 'flex' }}>
-      <span
-          className="btn btn-secondary"
-          style={{ backgroundColor: SIM_LOW_COLOR, flex: 1 }}
-          title="0-25%"
-      />
-            <span
-                className="btn btn-secondary"
-                style={{ backgroundColor: SIM_MID_LOW_COLOR, flex: 1 }}
-                title="25-50%"
-            />
-            <span
-                className="btn btn-secondary"
-                style={{ backgroundColor: SIM_MID_HIGH_COLOR, flex: 1 }}
-                title="50-75%"
-            />
-            <span
-                className="btn btn-secondary"
-                style={{ backgroundColor: SIM_HIGH_COLOR, flex: 1 }}
-                title="75-100%"
-            />
-        </div>
-    </div>
-)
-
-export default LoadMetricComponent
diff --git a/frontend/src/components/app/sidebars/simulation/SimulationSidebarComponent.js b/frontend/src/components/app/sidebars/simulation/SimulationSidebarComponent.js
deleted file mode 100644
index dba75eb2..00000000
--- a/frontend/src/components/app/sidebars/simulation/SimulationSidebarComponent.js
+++ /dev/null
@@ -1,18 +0,0 @@
-import React from 'react'
-import ExperimentMetadataContainer from '../../../../containers/app/sidebars/simulation/ExperimentMetadataContainer'
-import LoadMetricContainer from '../../../../containers/app/sidebars/simulation/LoadMetricContainer'
-import Sidebar from '../Sidebar'
-import './SimulationSidebarComponent.css'
-
-const SimulationSidebarComponent = () => {
-    return (
-        <Sidebar isRight={false}>
-            <div className="simulation-sidebar-container flex-column">
-                <ExperimentMetadataContainer/>
-                <LoadMetricContainer/>
-            </div>
-        </Sidebar>
-    )
-}
-
-export default SimulationSidebarComponent
diff --git a/frontend/src/components/app/sidebars/simulation/SimulationSidebarComponent.sass b/frontend/src/components/app/sidebars/simulation/SimulationSidebarComponent.sass
deleted file mode 100644
index 6490cf8d..00000000
--- a/frontend/src/components/app/sidebars/simulation/SimulationSidebarComponent.sass
+++ /dev/null
@@ -1,8 +0,0 @@
-.simulation-sidebar-container
-    display: flex
-    height: 100%
-    max-height: 100%
-
-.trace-container
-    flex: 1
-    overflow-y: scroll
diff --git a/frontend/src/components/app/sidebars/topology/building/BuildingSidebarComponent.js b/frontend/src/components/app/sidebars/topology/building/BuildingSidebarComponent.js
index 00965c18..4cc87798 100644
--- a/frontend/src/components/app/sidebars/topology/building/BuildingSidebarComponent.js
+++ b/frontend/src/components/app/sidebars/topology/building/BuildingSidebarComponent.js
@@ -2,18 +2,11 @@ import React from 'react'
 import NewRoomConstructionContainer
     from '../../../../../containers/app/sidebars/topology/building/NewRoomConstructionContainer'
 
-const BuildingSidebarComponent = ({ inSimulation }) => {
+const BuildingSidebarComponent = () => {
     return (
         <div>
             <h2>Building</h2>
-            {inSimulation ? (
-                <div className="alert alert-info">
-                    <span className="fa fa-info-circle mr-2"/>
-                    <strong>Click on individual rooms</strong> to see their stats!
-                </div>
-            ) : (
-                <NewRoomConstructionContainer/>
-            )}
+            <NewRoomConstructionContainer/>
         </div>
     )
 }
diff --git a/frontend/src/components/app/sidebars/topology/machine/MachineSidebarComponent.js b/frontend/src/components/app/sidebars/topology/machine/MachineSidebarComponent.js
index 66c8c84f..d78c20eb 100644
--- a/frontend/src/components/app/sidebars/topology/machine/MachineSidebarComponent.js
+++ b/frontend/src/components/app/sidebars/topology/machine/MachineSidebarComponent.js
@@ -1,24 +1,15 @@
 import React from 'react'
-import LoadBarContainer from '../../../../../containers/app/sidebars/elements/LoadBarContainer'
-import LoadChartContainer from '../../../../../containers/app/sidebars/elements/LoadChartContainer'
 import BackToRackContainer from '../../../../../containers/app/sidebars/topology/machine/BackToRackContainer'
 import DeleteMachineContainer from '../../../../../containers/app/sidebars/topology/machine/DeleteMachineContainer'
 import MachineNameContainer from '../../../../../containers/app/sidebars/topology/machine/MachineNameContainer'
 import UnitTabsContainer from '../../../../../containers/app/sidebars/topology/machine/UnitTabsContainer'
 
-const MachineSidebarComponent = ({ inSimulation, machineId }) => {
+const MachineSidebarComponent = ({ machineId }) => {
     return (
         <div>
             <MachineNameContainer/>
             <BackToRackContainer/>
-            {inSimulation ? (
-                <div>
-                    <LoadBarContainer objectType="machine" objectId={machineId}/>
-                    <LoadChartContainer objectType="machine" objectId={machineId}/>
-                </div>
-            ) : (
-                <DeleteMachineContainer/>
-            )}
+            <DeleteMachineContainer/>
             <UnitTabsContainer/>
         </div>
     )
diff --git a/frontend/src/components/app/sidebars/topology/machine/UnitComponent.js b/frontend/src/components/app/sidebars/topology/machine/UnitComponent.js
index bde6d444..3953347a 100644
--- a/frontend/src/components/app/sidebars/topology/machine/UnitComponent.js
+++ b/frontend/src/components/app/sidebars/topology/machine/UnitComponent.js
@@ -53,14 +53,10 @@ class UnitComponent extends React.Component {
                         data-content={unitInfo}
                         data-html="true"
                     />
-                    {this.props.inSimulation ? (
-                        undefined
-                    ) : (
-                        <span
-                            className="btn btn-outline-danger fa fa-trash"
-                            onClick={this.props.onDelete}
-                        />
-                    )}
+                    <span
+                        className="btn btn-outline-danger fa fa-trash"
+                        onClick={this.props.onDelete}
+                    />
                 </span>
             </li>
         )
diff --git a/frontend/src/components/app/sidebars/topology/machine/UnitListComponent.js b/frontend/src/components/app/sidebars/topology/machine/UnitListComponent.js
index da65da23..fcd3e03b 100644
--- a/frontend/src/components/app/sidebars/topology/machine/UnitListComponent.js
+++ b/frontend/src/components/app/sidebars/topology/machine/UnitListComponent.js
@@ -1,7 +1,7 @@
 import React from 'react'
 import UnitContainer from '../../../../../containers/app/sidebars/topology/machine/UnitContainer'
 
-const UnitListComponent = ({ unitType, unitIds, inSimulation }) => (
+const UnitListComponent = ({ unitType, unitIds }) => (
     <ul className="list-group mt-1">
         {unitIds.length !== 0 ? (
             unitIds.map((unitId, index) => (
@@ -14,13 +14,9 @@ const UnitListComponent = ({ unitType, unitIds, inSimulation }) => (
             ))
         ) : (
             <div className="alert alert-info">
-                {inSimulation ? (
-                    <strong>No units of this type in this machine</strong>
-                ) : (
-                    <span>
-                        <strong>No units...</strong> Add some with the menu above!
-                    </span>
-                )}
+                <span>
+                    <strong>No units...</strong> Add some with the menu above!
+                </span>
             </div>
         )}
     </ul>
diff --git a/frontend/src/components/app/sidebars/topology/machine/UnitTabsComponent.js b/frontend/src/components/app/sidebars/topology/machine/UnitTabsComponent.js
index df7eeb77..c774036f 100644
--- a/frontend/src/components/app/sidebars/topology/machine/UnitTabsComponent.js
+++ b/frontend/src/components/app/sidebars/topology/machine/UnitTabsComponent.js
@@ -2,7 +2,7 @@ import React from 'react'
 import UnitAddContainer from '../../../../../containers/app/sidebars/topology/machine/UnitAddContainer'
 import UnitListContainer from '../../../../../containers/app/sidebars/topology/machine/UnitListContainer'
 
-const UnitTabsComponent = ({ inSimulation }) => (
+const UnitTabsComponent = () => (
     <div>
         <ul className="nav nav-tabs mt-2 mb-1" role="tablist">
             <li className="nav-item">
@@ -43,19 +43,19 @@ const UnitTabsComponent = ({ inSimulation }) => (
         </ul>
         <div className="tab-content">
             <div className="tab-pane active" id="cpu-units" role="tabpanel">
-                {inSimulation ? undefined : <UnitAddContainer unitType="cpu"/>}
+                <UnitAddContainer unitType="cpu"/>
                 <UnitListContainer unitType="cpu"/>
             </div>
             <div className="tab-pane" id="gpu-units" role="tabpanel">
-                {inSimulation ? undefined : <UnitAddContainer unitType="gpu"/>}
+                <UnitAddContainer unitType="gpu"/>
                 <UnitListContainer unitType="gpu"/>
             </div>
             <div className="tab-pane" id="memory-units" role="tabpanel">
-                {inSimulation ? undefined : <UnitAddContainer unitType="memory"/>}
+                <UnitAddContainer unitType="memory"/>
                 <UnitListContainer unitType="memory"/>
             </div>
             <div className="tab-pane" id="storage-units" role="tabpanel">
-                {inSimulation ? undefined : <UnitAddContainer unitType="storage"/>}
+                <UnitAddContainer unitType="storage"/>
                 <UnitListContainer unitType="storage"/>
             </div>
         </div>
diff --git a/frontend/src/components/app/sidebars/topology/rack/EmptySlotComponent.js b/frontend/src/components/app/sidebars/topology/rack/EmptySlotComponent.js
index f182a78c..03b44aa6 100644
--- a/frontend/src/components/app/sidebars/topology/rack/EmptySlotComponent.js
+++ b/frontend/src/components/app/sidebars/topology/rack/EmptySlotComponent.js
@@ -1,18 +1,14 @@
 import React from 'react'
 
-const EmptySlotComponent = ({ position, onAdd, inSimulation }) => (
+const EmptySlotComponent = ({ position, onAdd }) => (
     <li className="list-group-item d-flex justify-content-between align-items-center">
     <span className="badge badge-default badge-info mr-1 disabled">
       {position}
     </span>
-        {inSimulation ? (
-            <span className="badge badge-default badge-success">Empty Slot</span>
-        ) : (
-            <button className="btn btn-outline-primary" onClick={onAdd}>
-                <span className="fa fa-plus mr-2"/>
-                Add machine
-            </button>
-        )}
+        <button className="btn btn-outline-primary" onClick={onAdd}>
+            <span className="fa fa-plus mr-2"/>
+            Add machine
+        </button>
     </li>
 )
 
diff --git a/frontend/src/components/app/sidebars/topology/rack/MachineComponent.js b/frontend/src/components/app/sidebars/topology/rack/MachineComponent.js
index b4204136..cec3c912 100644
--- a/frontend/src/components/app/sidebars/topology/rack/MachineComponent.js
+++ b/frontend/src/components/app/sidebars/topology/rack/MachineComponent.js
@@ -1,6 +1,5 @@
 import React from 'react'
 import Shapes from '../../../../../shapes'
-import { convertLoadToSimulationColor } from '../../../../../util/simulation-load'
 
 const UnitIcon = ({ id, type }) => (
     <div>
@@ -16,14 +15,8 @@ const UnitIcon = ({ id, type }) => (
 const MachineComponent = ({
                               position,
                               machine,
-                              inSimulation,
-                              machineLoad,
                               onClick,
                           }) => {
-    let color = 'white'
-    if (inSimulation && machineLoad >= 0) {
-        color = convertLoadToSimulationColor(machineLoad)
-    }
     const hasNoUnits =
         machine.cpuIds.length +
         machine.gpuIds.length +
@@ -35,7 +28,7 @@ const MachineComponent = ({
         <li
             className="d-flex list-group-item list-group-item-action justify-content-between align-items-center"
             onClick={onClick}
-            style={{ backgroundColor: color }}
+            style={{ backgroundColor: 'white' }}
         >
             <span className="badge badge-default badge-info mr-1">{position}</span>
             <div className="d-inline-flex">
diff --git a/frontend/src/components/app/sidebars/topology/rack/RackSidebarComponent.js b/frontend/src/components/app/sidebars/topology/rack/RackSidebarComponent.js
index 47d99254..23e8e743 100644
--- a/frontend/src/components/app/sidebars/topology/rack/RackSidebarComponent.js
+++ b/frontend/src/components/app/sidebars/topology/rack/RackSidebarComponent.js
@@ -1,28 +1,17 @@
 import React from 'react'
-import LoadBarContainer from '../../../../../containers/app/sidebars/elements/LoadBarContainer'
-import LoadChartContainer from '../../../../../containers/app/sidebars/elements/LoadChartContainer'
 import BackToRoomContainer from '../../../../../containers/app/sidebars/topology/rack/BackToRoomContainer'
 import DeleteRackContainer from '../../../../../containers/app/sidebars/topology/rack/DeleteRackContainer'
 import MachineListContainer from '../../../../../containers/app/sidebars/topology/rack/MachineListContainer'
 import RackNameContainer from '../../../../../containers/app/sidebars/topology/rack/RackNameContainer'
 import './RackSidebarComponent.css'
 
-const RackSidebarComponent = ({ inSimulation, rackId }) => {
+const RackSidebarComponent = () => {
     return (
         <div className="rack-sidebar-container flex-column">
             <div className="rack-sidebar-header-container">
                 <RackNameContainer/>
                 <BackToRoomContainer/>
-                {inSimulation ? (
-                    <div>
-                        <LoadBarContainer objectType="rack" objectId={rackId}/>
-                        <LoadChartContainer objectType="rack" objectId={rackId}/>
-                    </div>
-                ) : (
-                    <div>
-                        <DeleteRackContainer/>
-                    </div>
-                )}
+                <DeleteRackContainer/>
             </div>
             <div className="machine-list-container mt-2">
                 <MachineListContainer/>
diff --git a/frontend/src/components/app/sidebars/topology/room/RoomSidebarComponent.js b/frontend/src/components/app/sidebars/topology/room/RoomSidebarComponent.js
index d8a805cb..a23ac381 100644
--- a/frontend/src/components/app/sidebars/topology/room/RoomSidebarComponent.js
+++ b/frontend/src/components/app/sidebars/topology/room/RoomSidebarComponent.js
@@ -1,29 +1,18 @@
 import React from 'react'
-import LoadBarContainer from '../../../../../containers/app/sidebars/elements/LoadBarContainer'
-import LoadChartContainer from '../../../../../containers/app/sidebars/elements/LoadChartContainer'
 import BackToBuildingContainer from '../../../../../containers/app/sidebars/topology/room/BackToBuildingContainer'
 import DeleteRoomContainer from '../../../../../containers/app/sidebars/topology/room/DeleteRoomContainer'
 import EditRoomContainer from '../../../../../containers/app/sidebars/topology/room/EditRoomContainer'
 import RackConstructionContainer from '../../../../../containers/app/sidebars/topology/room/RackConstructionContainer'
 import RoomNameContainer from '../../../../../containers/app/sidebars/topology/room/RoomNameContainer'
 
-const RoomSidebarComponent = ({ roomId, inSimulation }) => {
+const RoomSidebarComponent = () => {
     return (
         <div>
             <RoomNameContainer/>
             <BackToBuildingContainer/>
-            {inSimulation ? (
-                <div>
-                    <LoadBarContainer objectType="room" objectId={roomId}/>
-                    <LoadChartContainer objectType="room" objectId={roomId}/>
-                </div>
-            ) : (
-                <div>
-                    <RackConstructionContainer/>
-                    <EditRoomContainer/>
-                    <DeleteRoomContainer/>
-                </div>
-            )}
+            <RackConstructionContainer/>
+            <EditRoomContainer/>
+            <DeleteRoomContainer/>
         </div>
     )
 }
-- 
cgit v1.2.3


From 890cd3f7028bfccd77b0d04670f7bc07293ed383 Mon Sep 17 00:00:00 2001
From: Georgios Andreadis <info@gandreadis.com>
Date: Tue, 7 Jul 2020 11:20:43 +0200
Subject: Add new left sidebar, move topology controls

---
 .../sidebars/project/ProjectSidebarComponent.js    | 12 +++++
 .../app/sidebars/project/TopologyListComponent.js  | 63 ++++++++++++++++++++++
 2 files changed, 75 insertions(+)
 create mode 100644 frontend/src/components/app/sidebars/project/ProjectSidebarComponent.js
 create mode 100644 frontend/src/components/app/sidebars/project/TopologyListComponent.js

(limited to 'frontend/src/components/app/sidebars')

diff --git a/frontend/src/components/app/sidebars/project/ProjectSidebarComponent.js b/frontend/src/components/app/sidebars/project/ProjectSidebarComponent.js
new file mode 100644
index 00000000..d6e39ff6
--- /dev/null
+++ b/frontend/src/components/app/sidebars/project/ProjectSidebarComponent.js
@@ -0,0 +1,12 @@
+import React from 'react'
+import Sidebar from '../Sidebar'
+import TopologyListContainer from '../../../../containers/app/sidebars/project/TopologyListContainer'
+
+const ProjectSidebarComponent = () => (
+        <Sidebar isRight={false}>
+            <TopologyListContainer/>
+            <h2>Portfolios</h2>
+        </Sidebar>
+    )
+
+export default ProjectSidebarComponent
diff --git a/frontend/src/components/app/sidebars/project/TopologyListComponent.js b/frontend/src/components/app/sidebars/project/TopologyListComponent.js
new file mode 100644
index 00000000..98615711
--- /dev/null
+++ b/frontend/src/components/app/sidebars/project/TopologyListComponent.js
@@ -0,0 +1,63 @@
+import PropTypes from 'prop-types'
+import React from 'react'
+import Shapes from '../../../../shapes'
+import FontAwesome from 'react-fontawesome'
+
+class TopologyListComponent extends React.Component {
+    static propTypes = {
+        show: PropTypes.bool.isRequired,
+        topologies: PropTypes.arrayOf(Shapes.Topology),
+        currentTopologyId: PropTypes.string,
+        onChooseTopology: PropTypes.func.isRequired,
+        onNewTopology: PropTypes.func.isRequired,
+        onDeleteTopology: PropTypes.func.isRequired,
+    }
+
+    onChoose(id) {
+        this.props.onChooseTopology(id)
+    }
+
+    onDuplicate() {
+        this.props.onNewTopology(
+            this.textInput.value,
+            this.originTopology.value,
+        )
+    }
+
+    onDelete(id) {
+        this.props.onDeleteTopology(id)
+    }
+
+    render() {
+        return (
+            <div className="pb-3">
+                <h2>
+                    Topologies
+                    <button className="btn btn-outline-primary float-right" onClick={this.props.onNewTopology}>
+                        <FontAwesome name="plus"/>
+                    </button>
+                </h2>
+
+                {this.props.topologies.map((topology, idx) => (
+                    <div key={topology._id} className="row mb-1">
+                        <div className={'col-8 align-self-center ' + (topology._id === this.props.currentTopologyId ? 'font-weight-bold' : '')}>
+                            {topology.name}
+                        </div>
+                        <div className="col-4 text-right">
+                            <span
+                                className="btn btn-outline-primary mr-1 fa fa-play"
+                                onClick={() => this.onChoose(topology._id)}
+                            />
+                            <span
+                                className={'btn btn-outline-danger fa fa-trash ' + (idx === 0 ? 'disabled' : '')}
+                                onClick={() => idx !== 0 ? this.onDelete(topology._id) : undefined}
+                            />
+                        </div>
+                    </div>
+                ))}
+            </div>
+        )
+    }
+}
+
+export default TopologyListComponent
-- 
cgit v1.2.3