added buttons to ui for downloading and deleting modpacks

Author: mroote

ui/App/components/Mods/ModPacks.jsx

@@ -5,6 +5,32 @@ class ModPacks extends React.Component {
         super(props)
     }
 
+    removeModPack(modpack, e) {
+        var self = this;
+        swal({   
+            title: "Are you sure?",  
+            text: "Modpack: " + modpack + " will be deleted",   
+            type: "warning",   
+            showCancelButton: true,   
+            confirmButtonColor: "#DD6B55",   
+            confirmButtonText: "Yes, delete it!",   
+            closeOnConfirm: false 
+        }, 
+        () => {
+            $.ajax({
+                url: "/api/mods/packs/rm/" + modpack,
+                dataType: "json",
+                success: (resp) => {
+                    if (resp.success === true) {
+                        swal("Deleted!", resp.data, "success"); 
+                        self.props.loadModPackList();
+                    }
+                }
+            })
+        });
+
+    }
+
     render() {
         return(
             <div className="box">
@@ -23,9 +49,20 @@ class ModPacks extends React.Component {
                         </thead>
                         <tbody>
                         {this.props.modPacks.map( (mod, i) => {
+                            console.log(mod)
+                            let dlURL = "/api/mods/packs/dl/" + mod
                             return(
                                 <tr key={i}>
                                     <td>{mod}</td>    
+                                    <td><a className="btn btn-default" href={dlURL}></a></td>
+                                    <td>
+                                        <button
+                                            className="btn btn-danger"
+                                            ref="modpack"
+                                            type="button"
+                                            onClick={this.removeModPack.bind(this, mod)}>
+                                        </button>
+                                    </td>
                                 </tr>
                             )
                         })}
@@ -39,6 +76,7 @@ class ModPacks extends React.Component {
 
 ModPacks.propTypes = {
     modPacks: React.PropTypes.array.isRequired, 
+    loadModPackList: React.PropTypes.func.isRequired,
 }
 
 export default ModPacks

ui/App/components/ModsContent.jsx

@@ -109,6 +109,7 @@ class ModsContent extends React.Component {
                     />
                     <ModPacks 
                         {...this.state}
+                        loadModPackList={this.loadModPackList}
                     />
 
                 </section>