From 653290da64e3d85f422d1f00407b74011999a5fa Mon Sep 17 00:00:00 2001
From: Georgios Andreadis <g.andreadis@student.tudelft.nl>
Date: Fri, 15 Sep 2017 13:39:36 +0200
Subject: Rebrand simulation and experiment row buttons

---
 .../experiments/ExperimentListComponent.js         |  3 ++-
 .../experiments/ExperimentRowComponent.js          | 23 ++++++++++++++++++++--
 2 files changed, 23 insertions(+), 3 deletions(-)

(limited to 'src/components/experiments')

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}) => {
                     <span className="info-icon fa fa-question-circle mr-2"/>
                     <strong>No experiments here yet...</strong> Add some with the button below!
                 </div> :
-                <table className="table">
+                <table className="table table-striped">
                     <thead>
                     <tr>
                         <th>Name</th>
                         <th>Path</th>
                         <th>Trace</th>
                         <th>Scheduler</th>
+                        <th/>
                     </tr>
                     </thead>
                     <tbody>
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}) => (
     <tr>
         <td>{experiment.name}</td>
         <td>{experiment.path.name ? experiment.path.name : "Path " + experiment.path.id}</td>
         <td>{experiment.trace.name}</td>
         <td>{experiment.scheduler.name}</td>
+        <td className="text-right">
+            <Link
+                to={"/simulations/" + simulationId + "/experiments/" + experiment.id}
+                className="btn btn-outline-primary mr-1"
+                title="Open this experiment"
+            >
+                <span className="fa fa-play"/>
+            </Link>
+            <div
+                className="btn btn-outline-danger"
+                title="Delete this experiment"
+                onClick={() => onDelete(experiment.id)}
+            >
+                <span className="fa fa-trash"/>
+            </div>
+        </td>
     </tr>
 );
 
 ExperimentRowComponent.propTypes = {
-    experiment: Shapes.Experiment
+    experiment: Shapes.Experiment.isRequired,
+    simulationId: PropTypes.number.isRequired,
 };
 
 export default ExperimentRowComponent;
-- 
cgit v1.2.3