From 653290da64e3d85f422d1f00407b74011999a5fa Mon Sep 17 00:00:00 2001 From: Georgios Andreadis Date: Fri, 15 Sep 2017 13:39:36 +0200 Subject: Rebrand simulation and experiment row buttons --- .../experiments/ExperimentListComponent.js | 3 +- .../experiments/ExperimentRowComponent.js | 23 +++++++++- .../simulations/SimulationActionButtons.js | 8 ++-- src/components/simulations/SimulationAuthList.js | 3 +- src/components/simulations/SimulationAuthList.sass | 53 ---------------------- .../experiments/ExperimentRowContainer.js | 11 ++++- src/sagas/experiments.js | 4 +- 7 files changed, 40 insertions(+), 65 deletions(-) delete mode 100644 src/components/simulations/SimulationAuthList.sass (limited to 'src') diff --git a/src/components/experiments/ExperimentListComponent.js b/src/components/experiments/ExperimentListComponent.js index 473a7651..f315ebbf 100644 --- a/src/components/experiments/ExperimentListComponent.js +++ b/src/components/experiments/ExperimentListComponent.js @@ -10,13 +10,14 @@ const ExperimentListComponent = ({experimentIds}) => { No experiments here yet... Add some with the button below! : - +
+ diff --git a/src/components/experiments/ExperimentRowComponent.js b/src/components/experiments/ExperimentRowComponent.js index fbb0aac7..b7468ac7 100644 --- a/src/components/experiments/ExperimentRowComponent.js +++ b/src/components/experiments/ExperimentRowComponent.js @@ -1,17 +1,36 @@ +import PropTypes from "prop-types"; import React from "react"; +import {Link} from "react-router-dom"; import Shapes from "../../shapes/index"; -const ExperimentRowComponent = ({experiment}) => ( +const ExperimentRowComponent = ({experiment, simulationId, onDelete}) => ( + ); ExperimentRowComponent.propTypes = { - experiment: Shapes.Experiment + experiment: Shapes.Experiment.isRequired, + simulationId: PropTypes.number.isRequired, }; export default ExperimentRowComponent; diff --git a/src/components/simulations/SimulationActionButtons.js b/src/components/simulations/SimulationActionButtons.js index 1cb80c94..448944c8 100644 --- a/src/components/simulations/SimulationActionButtons.js +++ b/src/components/simulations/SimulationActionButtons.js @@ -3,15 +3,15 @@ import React from 'react'; import {Link} from "react-router-dom"; const SimulationActionButtons = ({simulationId, onViewUsers, onDelete}) => ( - diff --git a/src/components/simulations/SimulationAuthList.js b/src/components/simulations/SimulationAuthList.js index fd5173a8..27b141fe 100644 --- a/src/components/simulations/SimulationAuthList.js +++ b/src/components/simulations/SimulationAuthList.js @@ -1,7 +1,6 @@ import PropTypes from 'prop-types'; import React from 'react'; import Shapes from "../../shapes/index"; -import "./SimulationAuthList.css"; import SimulationAuthRow from "./SimulationAuthRow"; const SimulationAuthList = ({authorizations}) => { @@ -12,7 +11,7 @@ const SimulationAuthList = ({authorizations}) => { No simulations here yet... Add some with the 'New Simulation' button! : -
Name Path Trace Scheduler
{experiment.name} {experiment.path.name ? experiment.path.name : "Path " + experiment.path.id} {experiment.trace.name} {experiment.scheduler.name} + + + +
onDelete(experiment.id)} + > + +
+
- + + -
onViewUsers(simulationId)}>
-
onDelete(simulationId)}> +
onDelete(simulationId)}>
+
diff --git a/src/components/simulations/SimulationAuthList.sass b/src/components/simulations/SimulationAuthList.sass deleted file mode 100644 index b09c7869..00000000 --- a/src/components/simulations/SimulationAuthList.sass +++ /dev/null @@ -1,53 +0,0 @@ -@import ../../style-globals/_mixins.sass -@import ../../style-globals/_variables.sass - -.simulation-icons - text-align: right - -.simulation-icons div, .simulation-icons a - display: inline-block - width: 35px - height: 35px - margin-right: 5px - padding: 5px - font-size: 12pt - color: white - +border-radius(100%) - +clickable - +transition(background, $transition-length) - - span - position: relative - left: -6px - - background-color: $blue-dark - - &.open - $icon-color: #0a00bf - - &:hover - background: lighten($icon-color, 10%) - - &:active - background: darken($icon-color, 10%) - - &.users - $icon-color: #17bf55 - - span - left: -3px - - &:hover - background: $icon-color - - &:active - background: darken($icon-color, 10%) - - &.delete - $icon-color: #e3474d - - &:hover - background: $icon-color - - &:active - background: darken($icon-color, 10%) diff --git a/src/containers/experiments/ExperimentRowContainer.js b/src/containers/experiments/ExperimentRowContainer.js index 99b35779..1db89b7d 100644 --- a/src/containers/experiments/ExperimentRowContainer.js +++ b/src/containers/experiments/ExperimentRowContainer.js @@ -1,4 +1,5 @@ import {connect} from "react-redux"; +import {deleteExperiment} from "../../actions/experiments"; import ExperimentRowComponent from "../../components/experiments/ExperimentRowComponent"; const mapStateToProps = (state, ownProps) => { @@ -9,11 +10,19 @@ const mapStateToProps = (state, ownProps) => { return { experiment, + simulationId: state.currentSimulationId, + }; +}; + +const mapDispatchToProps = dispatch => { + return { + onDelete: id => dispatch(deleteExperiment(id)) }; }; const ExperimentRowContainer = connect( - mapStateToProps + mapStateToProps, + mapDispatchToProps )(ExperimentRowComponent); export default ExperimentRowContainer; diff --git a/src/sagas/experiments.js b/src/sagas/experiments.js index 2c5395e8..d1334759 100644 --- a/src/sagas/experiments.js +++ b/src/sagas/experiments.js @@ -44,7 +44,7 @@ export function* onAddExperiment(action) { ); yield put(addToStore("experiment", experiment)); - const experimentIds = (yield select(state => state.objects.simulation[currentSimulationId])).experimentIds; + const experimentIds = yield select(state => state.objects.simulation[currentSimulationId].experimentIds); yield put(addPropToStoreObject("simulation", currentSimulationId, {experimentIds: experimentIds.concat([experiment.id])})); } catch (error) { @@ -57,7 +57,7 @@ export function* onDeleteExperiment(action) { yield call(deleteExperiment, action.id); const currentSimulationId = yield select(state => state.currentSimulationId); - const experimentIds = yield select(state => state.objects.simulation[currentSimulationId]); + const experimentIds = yield select(state => state.objects.simulation[currentSimulationId].experimentIds); yield put(addPropToStoreObject("simulation", currentSimulationId, {experimentIds: experimentIds.filter(id => id !== action.id)})); -- cgit v1.2.3
Simulation name