diff options
Diffstat (limited to 'frontend/src/components/experiments')
3 files changed, 98 insertions, 98 deletions
diff --git a/frontend/src/components/experiments/ExperimentListComponent.js b/frontend/src/components/experiments/ExperimentListComponent.js index 2f7106e5..55a7ff6d 100644 --- a/frontend/src/components/experiments/ExperimentListComponent.js +++ b/frontend/src/components/experiments/ExperimentListComponent.js @@ -1,59 +1,59 @@ -import PropTypes from "prop-types"; -import React from "react"; -import ExperimentRowContainer from "../../containers/experiments/ExperimentRowContainer"; +import PropTypes from 'prop-types' +import React from 'react' +import ExperimentRowContainer from '../../containers/experiments/ExperimentRowContainer' const ExperimentListComponent = ({ experimentIds, loading }) => { - let alert; + let alert - if (loading) { - alert = ( - <div className="alert alert-success"> - <span className="fa fa-refresh fa-spin mr-2" /> - <strong>Loading Experiments...</strong> - </div> - ); - } else if (experimentIds.length === 0 && !loading) { - alert = ( - <div className="alert alert-info"> - <span className="fa fa-question-circle mr-2" /> - <strong>No experiments here yet...</strong> Add some with the button - below! - </div> - ); - } + if (loading) { + alert = ( + <div className="alert alert-success"> + <span className="fa fa-refresh fa-spin mr-2"/> + <strong>Loading Experiments...</strong> + </div> + ) + } else if (experimentIds.length === 0 && !loading) { + alert = ( + <div className="alert alert-info"> + <span className="fa fa-question-circle mr-2"/> + <strong>No experiments here yet...</strong> Add some with the button + below! + </div> + ) + } - return ( - <div className="vertically-expanding-container"> - {alert ? ( - alert - ) : ( - <table className="table table-striped"> - <thead> - <tr> - <th>Name</th> - <th>Path</th> - <th>Trace</th> - <th>Scheduler</th> - <th /> - </tr> - </thead> - <tbody> - {experimentIds.map(experimentId => ( - <ExperimentRowContainer - experimentId={experimentId} - key={experimentId} - /> - ))} - </tbody> - </table> - )} - </div> - ); -}; + return ( + <div className="vertically-expanding-container"> + {alert ? ( + alert + ) : ( + <table className="table table-striped"> + <thead> + <tr> + <th>Name</th> + <th>Path</th> + <th>Trace</th> + <th>Scheduler</th> + <th/> + </tr> + </thead> + <tbody> + {experimentIds.map(experimentId => ( + <ExperimentRowContainer + experimentId={experimentId} + key={experimentId} + /> + ))} + </tbody> + </table> + )} + </div> + ) +} ExperimentListComponent.propTypes = { - experimentIds: PropTypes.arrayOf(PropTypes.number).isRequired, - loading: PropTypes.bool -}; + experimentIds: PropTypes.arrayOf(PropTypes.number).isRequired, + loading: PropTypes.bool, +} -export default ExperimentListComponent; +export default ExperimentListComponent diff --git a/frontend/src/components/experiments/ExperimentRowComponent.js b/frontend/src/components/experiments/ExperimentRowComponent.js index e71c6a00..8a2638a7 100644 --- a/frontend/src/components/experiments/ExperimentRowComponent.js +++ b/frontend/src/components/experiments/ExperimentRowComponent.js @@ -1,40 +1,40 @@ -import PropTypes from "prop-types"; -import React from "react"; -import { Link } from "react-router-dom"; -import Shapes from "../../shapes/index"; +import PropTypes from 'prop-types' +import React from 'react' +import { Link } from 'react-router-dom' +import Shapes from '../../shapes/index' const ExperimentRowComponent = ({ experiment, simulationId, onDelete }) => ( - <tr> - <td className="pt-3">{experiment.name}</td> - <td className="pt-3"> - {experiment.path.name - ? experiment.path.name - : "Path " + experiment.path.id} - </td> - <td className="pt-3">{experiment.trace.name}</td> - <td className="pt-3">{experiment.scheduler.name}</td> - <td className="text-right"> - <Link - to={"/simulations/" + simulationId + "/experiments/" + experiment.id} - className="btn btn-outline-primary btn-sm mr-2" - title="Open this experiment" - > - <span className="fa fa-play" /> - </Link> - <div - className="btn btn-outline-danger btn-sm" - title="Delete this experiment" - onClick={() => onDelete(experiment.id)} - > - <span className="fa fa-trash" /> - </div> - </td> - </tr> -); + <tr> + <td className="pt-3">{experiment.name}</td> + <td className="pt-3"> + {experiment.path.name + ? experiment.path.name + : 'Path ' + experiment.path.id} + </td> + <td className="pt-3">{experiment.trace.name}</td> + <td className="pt-3">{experiment.scheduler.name}</td> + <td className="text-right"> + <Link + to={'/simulations/' + simulationId + '/experiments/' + experiment.id} + className="btn btn-outline-primary btn-sm mr-2" + title="Open this experiment" + > + <span className="fa fa-play"/> + </Link> + <div + className="btn btn-outline-danger btn-sm" + title="Delete this experiment" + onClick={() => onDelete(experiment.id)} + > + <span className="fa fa-trash"/> + </div> + </td> + </tr> +) ExperimentRowComponent.propTypes = { - experiment: Shapes.Experiment.isRequired, - simulationId: PropTypes.number.isRequired -}; + experiment: Shapes.Experiment.isRequired, + simulationId: PropTypes.string.isRequired, +} -export default ExperimentRowComponent; +export default ExperimentRowComponent diff --git a/frontend/src/components/experiments/NewExperimentButtonComponent.js b/frontend/src/components/experiments/NewExperimentButtonComponent.js index 651172e3..2902825d 100644 --- a/frontend/src/components/experiments/NewExperimentButtonComponent.js +++ b/frontend/src/components/experiments/NewExperimentButtonComponent.js @@ -1,17 +1,17 @@ -import PropTypes from "prop-types"; -import React from "react"; +import PropTypes from 'prop-types' +import React from 'react' const NewExperimentButtonComponent = ({ onClick }) => ( - <div className="bottom-btn-container"> - <div className="btn btn-primary float-right" onClick={onClick}> - <span className="fa fa-plus mr-2" /> - New Experiment + <div className="bottom-btn-container"> + <div className="btn btn-primary float-right" onClick={onClick}> + <span className="fa fa-plus mr-2"/> + New Experiment + </div> </div> - </div> -); +) NewExperimentButtonComponent.propTypes = { - onClick: PropTypes.func.isRequired -}; + onClick: PropTypes.func.isRequired, +} -export default NewExperimentButtonComponent; +export default NewExperimentButtonComponent |