diff options
Diffstat (limited to 'opendc-web/opendc-web-ui/src/components/app/sidebars')
6 files changed, 37 insertions, 58 deletions
diff --git a/opendc-web/opendc-web-ui/src/components/app/sidebars/project/PortfolioListComponent.js b/opendc-web/opendc-web-ui/src/components/app/sidebars/project/PortfolioListComponent.js index ce271819..d61ff24e 100644 --- a/opendc-web/opendc-web-ui/src/components/app/sidebars/project/PortfolioListComponent.js +++ b/opendc-web/opendc-web-ui/src/components/app/sidebars/project/PortfolioListComponent.js @@ -25,7 +25,7 @@ function PortfolioListComponent({ </Button> </h2> - {portfolios.map((portfolio, idx) => ( + {portfolios.map((portfolio) => ( <div key={portfolio._id}> <Row className="row mb-1"> <Col @@ -61,7 +61,7 @@ function PortfolioListComponent({ PortfolioListComponent.propTypes = { portfolios: PropTypes.arrayOf(Portfolio), - currentProjectId: PropTypes.string.isRequired, + currentProjectId: PropTypes.string, currentPortfolioId: PropTypes.string, onNewPortfolio: PropTypes.func.isRequired, onChoosePortfolio: PropTypes.func.isRequired, diff --git a/opendc-web/opendc-web-ui/src/components/app/sidebars/project/ScenarioListComponent.js b/opendc-web/opendc-web-ui/src/components/app/sidebars/project/ScenarioListComponent.js index f990dfcb..e81d2b78 100644 --- a/opendc-web/opendc-web-ui/src/components/app/sidebars/project/ScenarioListComponent.js +++ b/opendc-web/opendc-web-ui/src/components/app/sidebars/project/ScenarioListComponent.js @@ -1,48 +1,19 @@ import PropTypes from 'prop-types' import React from 'react' import { Scenario } from '../../../../shapes' -import Link from 'next/link' import { Button, Col, Row } from 'reactstrap' -import classNames from 'classnames' import { FontAwesomeIcon } from '@fortawesome/react-fontawesome' -import { faPlus, faPlay, faTrash } from '@fortawesome/free-solid-svg-icons' +import { faPlus, faTrash } from '@fortawesome/free-solid-svg-icons' -function ScenarioListComponent({ - scenarios, - portfolioId, - currentProjectId, - currentScenarioId, - onNewScenario, - onChooseScenario, - onDeleteScenario, -}) { +function ScenarioListComponent({ scenarios, portfolioId, onNewScenario, onDeleteScenario }) { return ( <> {scenarios.map((scenario, idx) => ( <Row key={scenario._id} className="mb-1"> - <Col - xs="7" - className={classNames('pl-5 align-self-center', { - 'font-weight-bold': scenario._id === currentScenarioId, - })} - > + <Col xs="7" className="pl-5 align-self-center"> {scenario.name} </Col> <Col xs="5" className="text-right"> - <Link - passHref - href={`/projects/${currentProjectId}/portfolios/${scenario.portfolioId}/scenarios/${scenario._id}`} - > - <Button - color="primary" - outline - disabled - className="mr-1" - onClick={() => onChooseScenario(scenario.portfolioId, scenario._id)} - > - <FontAwesomeIcon icon={faPlay} /> - </Button> - </Link> <Button color="danger" outline @@ -67,10 +38,7 @@ function ScenarioListComponent({ ScenarioListComponent.propTypes = { scenarios: PropTypes.arrayOf(Scenario), portfolioId: PropTypes.string, - currentProjectId: PropTypes.string.isRequired, - currentScenarioId: PropTypes.string, onNewScenario: PropTypes.func.isRequired, - onChooseScenario: PropTypes.func.isRequired, onDeleteScenario: PropTypes.func.isRequired, } diff --git a/opendc-web/opendc-web-ui/src/components/app/sidebars/topology/machine/UnitComponent.js b/opendc-web/opendc-web-ui/src/components/app/sidebars/topology/machine/UnitComponent.js index 03b92459..46c639bd 100644 --- a/opendc-web/opendc-web-ui/src/components/app/sidebars/topology/machine/UnitComponent.js +++ b/opendc-web/opendc-web-ui/src/components/app/sidebars/topology/machine/UnitComponent.js @@ -60,7 +60,7 @@ function UnitComponent({ index, unitType, unit, onDelete }) { UnitComponent.propTypes = { index: PropTypes.number, unitType: PropTypes.string, - unit: PropTypes.oneOf([ProcessingUnit, StorageUnit]), + unit: PropTypes.oneOfType([ProcessingUnit, StorageUnit]), onDelete: PropTypes.func, } diff --git a/opendc-web/opendc-web-ui/src/components/app/sidebars/topology/machine/UnitListComponent.js b/opendc-web/opendc-web-ui/src/components/app/sidebars/topology/machine/UnitListComponent.js index b7da74a1..54c1a6cc 100644 --- a/opendc-web/opendc-web-ui/src/components/app/sidebars/topology/machine/UnitListComponent.js +++ b/opendc-web/opendc-web-ui/src/components/app/sidebars/topology/machine/UnitListComponent.js @@ -1,12 +1,19 @@ import PropTypes from 'prop-types' import React from 'react' -import UnitContainer from '../../../../../containers/app/sidebars/topology/machine/UnitContainer' +import { ProcessingUnit, StorageUnit } from '../../../../../shapes' +import UnitComponent from './UnitComponent' -const UnitListComponent = ({ unitType, unitIds }) => ( +const UnitListComponent = ({ unitType, units, onDelete }) => ( <ul className="list-group mt-1"> - {unitIds.length !== 0 ? ( - unitIds.map((unitId, index) => ( - <UnitContainer unitType={unitType} unitId={unitId} index={index} key={index} /> + {units.length !== 0 ? ( + units.map((unit, index) => ( + <UnitComponent + unitType={unitType} + unit={unit} + onDelete={() => onDelete(unit, unitType)} + index={index} + key={index} + /> )) ) : ( <div className="alert alert-info"> @@ -19,8 +26,9 @@ const UnitListComponent = ({ unitType, unitIds }) => ( ) UnitListComponent.propTypes = { - unitType: PropTypes.string, - unitIds: PropTypes.array, + unitType: PropTypes.string.isRequired, + units: PropTypes.arrayOf(PropTypes.oneOfType([ProcessingUnit, StorageUnit])).isRequired, + onDelete: PropTypes.func, } export default UnitListComponent diff --git a/opendc-web/opendc-web-ui/src/components/app/sidebars/topology/rack/MachineComponent.js b/opendc-web/opendc-web-ui/src/components/app/sidebars/topology/rack/MachineComponent.js index f91202ba..b71918da 100644 --- a/opendc-web/opendc-web-ui/src/components/app/sidebars/topology/rack/MachineComponent.js +++ b/opendc-web/opendc-web-ui/src/components/app/sidebars/topology/rack/MachineComponent.js @@ -23,7 +23,7 @@ UnitIcon.propTypes = { const MachineComponent = ({ position, machine, onClick }) => { const hasNoUnits = - machine.cpuIds.length + machine.gpuIds.length + machine.memoryIds.length + machine.storageIds.length === 0 + machine.cpus.length + machine.gpus.length + machine.memories.length + machine.storages.length === 0 return ( <ListGroupItem @@ -36,10 +36,10 @@ const MachineComponent = ({ position, machine, onClick }) => { {position} </Badge> <div className="d-inline-flex"> - {machine.cpuIds.length > 0 ? <UnitIcon id="cpu" type="CPU" /> : undefined} - {machine.gpuIds.length > 0 ? <UnitIcon id="gpu" type="GPU" /> : undefined} - {machine.memoryIds.length > 0 ? <UnitIcon id="memory" type="memory" /> : undefined} - {machine.storageIds.length > 0 ? <UnitIcon id="storage" type="storage" /> : undefined} + {machine.cpus.length > 0 ? <UnitIcon id="cpu" type="CPU" /> : undefined} + {machine.gpus.length > 0 ? <UnitIcon id="gpu" type="GPU" /> : undefined} + {machine.memories.length > 0 ? <UnitIcon id="memory" type="memory" /> : undefined} + {machine.storages.length > 0 ? <UnitIcon id="storage" type="storage" /> : undefined} {hasNoUnits ? <Badge color="warning">Machine with no units</Badge> : undefined} </div> </ListGroupItem> diff --git a/opendc-web/opendc-web-ui/src/components/app/sidebars/topology/rack/MachineListComponent.js b/opendc-web/opendc-web-ui/src/components/app/sidebars/topology/rack/MachineListComponent.js index d0958c28..e024a417 100644 --- a/opendc-web/opendc-web-ui/src/components/app/sidebars/topology/rack/MachineListComponent.js +++ b/opendc-web/opendc-web-ui/src/components/app/sidebars/topology/rack/MachineListComponent.js @@ -1,17 +1,18 @@ import PropTypes from 'prop-types' import React from 'react' -import EmptySlotContainer from '../../../../../containers/app/sidebars/topology/rack/EmptySlotContainer' -import MachineContainer from '../../../../../containers/app/sidebars/topology/rack/MachineContainer' import { machineList } from './MachineListComponent.module.scss' +import MachineComponent from './MachineComponent' +import { Machine } from '../../../../../shapes' +import EmptySlotComponent from './EmptySlotComponent' -const MachineListComponent = ({ machineIds }) => { +const MachineListComponent = ({ machines = [], onSelect, onAdd }) => { return ( <ul className={`list-group ${machineList}`}> - {machineIds.map((machineId, index) => { - if (machineId === null) { - return <EmptySlotContainer key={index} position={index + 1} /> + {machines.map((machine, index) => { + if (machine === null) { + return <EmptySlotComponent key={index} onAdd={() => onAdd(index + 1)} /> } else { - return <MachineContainer key={index} position={index + 1} machineId={machineId} /> + return <MachineComponent key={index} onClick={() => onSelect(index + 1)} machine={machine} /> } })} </ul> @@ -19,7 +20,9 @@ const MachineListComponent = ({ machineIds }) => { } MachineListComponent.propTypes = { - machineIds: PropTypes.array, + machines: PropTypes.arrayOf(Machine), + onSelect: PropTypes.func.isRequired, + onAdd: PropTypes.func.isRequired, } export default MachineListComponent |