added mod pack component to frontend

Author: mroote

ui/App/components/ConfigContent.jsx

@@ -47,7 +47,7 @@ class ConfigContent extends React.Component {
                 <section className="content">
                     <div className="box">
                         <div className="box-header">
-                            <h3 className="box-title">Manage Server Configuration</h3>
+                            <h3 className="box-title">Game Configuration</h3>
                         </div>
 
                         <div className="box-body">

ui/App/components/Mods/ModPacks.jsx

@@ -0,0 +1,24 @@
+import React from 'react';
+
+class ModPacks extends React.Component {
+    constructor(props) {
+        super(props)
+    }
+
+    render() {
+        return(
+            <div className="box">
+                <div className="box-header">
+                    <h3 className="box-title">Mod Packs</h3>
+                </div>
+                     
+                <div className="box-body">
+                    <p>itest</p>        
+                </div>
+            </div>
+        )
+    }
+    
+}
+
+export default ModPacks

ui/App/components/ModsContent.jsx

@@ -2,22 +2,26 @@ import React from 'react';
 import {IndexLink} from 'react-router';
 import ModList from './Mods/ListMods.jsx';
 import InstalledMods from './Mods/InstalledMods.jsx';
+import ModPacks from './Mods/ModPacks.jsx'
 
 class ModsContent extends React.Component {
     constructor(props) {
         super(props);
         this.componentDidMount = this.componentDidMount.bind(this);
         this.toggleMod = this.toggleMod.bind(this);
         this.loadInstalledModList = this.loadInstalledModList.bind(this);
+        this.loadModPackList = this.loadModPackList.bind(this);
         this.state = {
             installedMods: [],
-            listMods: []
+            listMods: [],
+            modPacks: [],
         };
     }
 
     componentDidMount() {
         this.loadModList();
         this.loadInstalledModList();
+        this.loadModPackList();
     }
 
     loadModList() {
@@ -51,6 +55,21 @@ class ModsContent extends React.Component {
         });
     }
 
+    loadModPackList() {
+        $.ajax({
+            url: "/api/mods/packs/list",
+            dataType: "json",
+            success: (resp) => {
+                if (resp.success === true) {
+                    this.setState({modPacks: resp.data})
+                    console.log(this.state)
+                } else {
+                    this.setState({modPacks: []})
+                }
+            }
+        })
+    }
+
     toggleMod(modName) {
         $.ajax({
             url: "/api/mods/toggle/" + modName,
@@ -88,6 +107,9 @@ class ModsContent extends React.Component {
                         {...this.state}
                         toggleMod={this.toggleMod}
                     />
+                    <ModPacks 
+                        
+                    />
 
                 </section>
             </div>