2 files changed, 102 insertions, 0 deletions
diff --git a/client/src/pages/ManageServer.js b/client/src/pages/ManageServer.js
new file mode 100644
index 0000000..990884e
--- /dev/null
+++ b/client/src/pages/ManageServer.js
@@ -0,0 +1,69 @@
+import React, { Component } from 'react';
+import fetch from 'node-fetch';
+import PropTypes from 'prop-types';
+import { MDBBadge, MDBAlert } from 'mdbreact';
+
+import ManageServerSettings from '../components/manageserver/ManageServerSettings';
+
+export default class ManageServer extends Component {
+    constructor(props) {
+        super(props)
+        
+        this.state = {
+            loading: true,
+            data: null
+        }
+        
+        this.handleInput = this.handleInput.bind(this);
+    }
+    
+    componentDidMount() {
+        fetch(`http://localhost:8088/v1/get/guild/${this.props.match.params.id}`)
+            .then(res => res.json())
+            .then(res => this.setState({
+                loading: false,
+                data: res.message ? null : res
+            }))
+            .catch(() => this.setState({ loading: false }));
+    }
+    
+    handleInput(event) {
+        const eventId = event.target.id;
+        const value = event.target.value;
+        
+        this.setState(prevState => ({
+            data: {
+                ...prevState.data,
+                [eventId]: value
+            }
+        }));
+    }
+    
+    render() {
+        if (this.state.loading) {
+            return(
+                <h1>Loading...</h1>
+            );
+        } else if(!this.state.data) {
+            return(
+                <MDBAlert color="warning">This bot is not in this server</MDBAlert>
+            );
+        } else {
+            return(
+                <React.Fragment>
+                    <h1><strong>{this.state.data.name}</strong></h1>
+                    <MDBBadge color="info">{`${this.state.data.members} Members`}</MDBBadge>&nbsp;
+                    <MDBBadge color="success">{`Owner: ${this.state.data.owner}`}</MDBBadge>
+                    
+                    <hr />
+                    
+                    <ManageServerSettings data={this.state.data} handleInput={this.handleInput} guild={this.props.match.params.id} />
+                </React.Fragment>
+            )
+        }
+    }
+}
+
+ManageServer.propTypes = {
+    user: PropTypes.object
+}
+\ No newline at end of file
diff --git a/client/src/pages/ServerSelection.js b/client/src/pages/ServerSelection.js
new file mode 100644
index 0000000..f1e3a39
--- /dev/null
+++ b/client/src/pages/ServerSelection.js
@@ -0,0 +1,33 @@
+import React, { Component } from 'react';
+import PropTypes from 'prop-types';
+import { MDBAlert, MDBRow } from 'mdbreact';
+
+import ServerCard from '../components/selection/ServerCard';
+
+export default class ServerSelection extends Component {
+    render() {
+        const guilds = this.props.user.guilds.filter(g => g.admin);
+        
+        if (!guilds.length) {
+            return(
+                <MDBAlert color="warning">
+                    <strong>You cannot manage any servers</strong>
+                </MDBAlert>
+            );
+        } else {
+            return(
+                <React.Fragment>
+                    <MDBRow>
+                        {guilds.map(guild => {
+                            return(<ServerCard guild={guild} />);
+                        })}
+                    </MDBRow>
+                </React.Fragment>
+            );
+        }
+    }
+}
+
+ServerSelection.propTypes = {
+    user: PropTypes.object
+}
+\ No newline at end of file