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 (
- + {!loading && ( + + )}
{invalid && ( Form is not valid )} + {loading && ( + + )} {!invalid && name && (

Copy Pasta