Link for deleting strategies (#60)

public/js/components/strategy/StrategiesComponent.jsx

@@ -14,9 +14,16 @@ var StrategiesComponent = React.createClass({
     },
 
     componentDidMount: function () {
-        strategyStore.getStrategies().then(function(res) {
-            this.setState({strategies: res.strategies});
-        }.bind(this), this.initError);
+        this.fetchStrategies();
+    },
+
+    fetchStrategies: function(res) {
+        strategyStore.getStrategies()
+            .then(function(res) {
+                this.setState({strategies: res.strategies})
+            }.bind(this))
+            .catch(this.initError);
+
     },
 
     initError: function() {
@@ -57,6 +64,12 @@ var StrategiesComponent = React.createClass({
         .catch(this.onError);
     },
 
+    onRemove: function(strategy) {
+        strategyStore.removeStrategy(strategy)
+            .then(this.fetchStrategies)
+            .catch(this.onError);
+    },
+
     render: function() {
         return (
             <div>
@@ -66,7 +79,7 @@ var StrategiesComponent = React.createClass({
 
                 <hr />
 
-                <StrategyList strategies={this.state.strategies} />
+                <StrategyList strategies={this.state.strategies} onRemove={this.onRemove} />
             </div>
             );
     },

public/js/components/strategy/Strategy.jsx

@@ -5,12 +5,20 @@ var Strategy = React.createClass({
         strategy: React.PropTypes.object.isRequired
     },
 
+    onRemove: function(event) {
+        event.preventDefault();
+        if (confirm("Are you sure you want to delete strategy '"+this.props.strategy.name+"'?")) {
+            this.props.onRemove(this.props.strategy);
+        }
+    },
+
     render: function() {
         return (
             <div className="line mal">
                 <div className="unit">
-                    <strong>{this.props.strategy.name}</strong><br />
-                    <em>{this.props.strategy.description}</em>
+                    <strong>{this.props.strategy.name} </strong>
+                    <a href="" title="Delete strategy" onClick={this.onRemove}>(remove)</a><br />
+                    <em>{this.props.strategy.description}</em><br />
                 </div>
             </div>
         );

public/js/components/strategy/StrategyList.jsx

@@ -8,8 +8,8 @@ var StrategyList = React.createClass({
 
     render: function() {
         var strategyNodes = this.props.strategies.map(function(strategy) {
-            return <Strategy strategy={strategy} key={strategy.name} />;
-        });
+            return <Strategy strategy={strategy} key={strategy.name} onRemove={this.props.onRemove} />;
+        }.bind(this));
         return (
             <div>{strategyNodes}</div>
             );

public/js/stores/StrategyStore.js

@@ -14,6 +14,14 @@ var StrategyStore = {
         });
     },
 
+    removeStrategy: function (strategy) {
+        return reqwest({
+            url: 'strategies/'+strategy.name,
+            method: 'delete',
+            type: TYPE
+        });
+    },
+
     getStrategies: function () {
         return reqwest({
             url: 'strategies',