1 files changed, 71 insertions, 0 deletions
diff --git a/client/src/components/manageserver/ManageServerSettings.js b/client/src/components/manageserver/ManageServerSettings.js
new file mode 100644
index 0000000..66a5fe5
--- /dev/null
+++ b/client/src/components/manageserver/ManageServerSettings.js
@@ -0,0 +1,71 @@
+import React, { Component } from 'react';
+import PropTypes from 'prop-types';
+import { MDBCard, MDBCardHeader, MDBCardBody, MDBInput, MDBAlert, MDBBtn } from 'mdbreact';
+import fetch from 'node-fetch';
+
+export default class ManageServerSettings extends Component {
+    state = {
+        error: null,
+        success: false,
+        disabled: false
+    }
+    
+    handleSave() {
+        this.setState({
+            error: null,
+            success: false,
+            disabled: true
+        });
+        
+        fetch(`http://localhost:8088/v1/post/guild-name/${this.props.guild}`, {
+            method: 'POST',
+            credentials: 'include',
+            headers: {
+                'Authorization': process.env.REACT_APP_AUTHORIZATION,
+                'Content-Type': 'application/json'
+            },
+            body: JSON.stringify({
+                name: this.props.data.name
+            })
+        })
+        .then(res => res.json())
+        .then(res => {
+            if (res.message) return this.setState({ error: res.message, disabled: false });
+            
+            this.setState({ success: true });
+        })
+        .catch(err => {
+            console.log(err);
+            this.setState({ error: 'An unknown error occured' });
+        });
+    }
+    
+    render() {
+        return(
+            <React.Fragment>
+                <MDBCard>
+                    <MDBCardHeader>
+                        <h3>Server Settings</h3>
+                    </MDBCardHeader>
+                    <MDBCardBody>
+                        {this.state.error &&
+                            <MDBAlert color="danger">{this.state.error}</MDBAlert>
+                        }
+                        {this.state.success &&
+                            <MDBAlert color="success">Updated server settings successfully</MDBAlert>
+                        }
+                        
+                        <MDBInput id="name" label="Server name" value={this.props.data.name} onChange={this.props.handleInput} />
+                        <MDBBtn color="dark" onClick={this.handleSave.bind(this)} disabled={this.state.disabled}>Save</MDBBtn>
+                    </MDBCardBody>
+                </MDBCard>
+            </React.Fragment>
+        )
+    }
+}
+
+ManageServerSettings.propTypes = {
+    data: PropTypes.object,
+    handleInput: PropTypes.func,
+    guild: PropTypes.string
+}
+\ No newline at end of file