From 06ecdcd45b19d05c9a17091e87271ca80728502e Mon Sep 17 00:00:00 2001
From: 3wc <3wc.git@doesthisthing.work>
Date: Fri, 13 Nov 2020 02:44:57 +0200
Subject: [PATCH] Looading indicator

---
 src/App.js | 21 ++++++++++++++++-----
 1 file changed, 16 insertions(+), 5 deletions(-)

diff --git a/src/App.js b/src/App.js
index c67729d..4635a9f 100644
--- a/src/App.js
+++ b/src/App.js
@@ -1,7 +1,7 @@
 import React from 'react';
 
 import { 
-  Heading, IconButton, StarIcon, Pane, TextInput, Text
+  Heading, IconButton, StarIcon, Pane, TextInput, Text, Spinner
 } from 'evergreen-ui'
 
 import './App.css';
@@ -17,10 +17,15 @@ class Form extends React.Component {
 
   handleSubmit(event) {
     event.preventDefault();
+    this.setState({
+      loading: true,
+    });
+
     if (!event.target.checkValidity()) {
     	this.setState({
         invalid: true,
         displayErrors: true,
+        loading: false,
       });
       return;
     }
@@ -36,15 +41,16 @@ class Form extends React.Component {
           invalid: false,
           displayErrors: false,
           name: form_data.get('meeting-name'),
-          meetingid: data.id
+          meetingid: data.id,
+        loading: false,
         })
-        console.log(this.state.meetingid)
+        console.log('Meeting ID: ' + this.state.meetingid)
       })
       .catch(console.log);
   }
 
   render() {
-  	const { name, meetingid, invalid, displayErrors } = this.state;
+  	const { name, meetingid, invalid, loading, displayErrors } = this.state;
     return (
     	<div>
         <form
@@ -60,13 +66,18 @@ class Form extends React.Component {
             placeholder="YourMeetingNameHere"
             required
           />
-          <IconButton icon={StarIcon} height={60} onClick={this.onClick}/>
+          {!loading && (
+            <IconButton icon={StarIcon} height={60} onClick={this.onClick}/>
+          )}
         </form>
 
         <div className="res-block">
           {invalid && (
             <Pane><Text>Form is not valid</Text></Pane>
           )}
+          {loading && (
+            <Spinner marginX="auto" />
+          )}
           {!invalid && name && (
           	<div>
               <h3>Copy Pasta</h3>