From d15be15a81284057fe65dffd5001440b0698afd2 Mon Sep 17 00:00:00 2001
From: Matthew Grove <me@mgrove.uk>
Date: Sun, 12 Sep 2021 22:55:34 +0100
Subject: [PATCH] Disable buttons during processing

---
 src/ClassicTestStart.js |  1 +
 src/LivesTestStart.js   |  1 +
 src/LoggedInHome.js     | 34 ++++++++++++++++++++++++++++------
 src/SetPage.js          |  2 ++
 4 files changed, 32 insertions(+), 6 deletions(-)

diff --git a/src/ClassicTestStart.js b/src/ClassicTestStart.js
index fcf52b3..937becd 100644
--- a/src/ClassicTestStart.js
+++ b/src/ClassicTestStart.js
@@ -65,6 +65,7 @@ export default function ClassicTestStart(props) {
 					icon={<ArrowForwardRoundedIcon />}
 					className="button--round continue-button"
 					loading={props.loading}
+					disabled={props.disabled}
 				></Button>
 
 				<Button
diff --git a/src/LivesTestStart.js b/src/LivesTestStart.js
index d5e5cec..80c6e5b 100644
--- a/src/LivesTestStart.js
+++ b/src/LivesTestStart.js
@@ -65,6 +65,7 @@ export default function LivesTestStart(props) {
 					icon={<ArrowForwardRoundedIcon />}
 					className="button--round continue-button"
 					loading={props.loading}
+					disabled={props.disabled}
 				></Button>
 
 				<Button
diff --git a/src/LoggedInHome.js b/src/LoggedInHome.js
index ae73539..8fe5b70 100644
--- a/src/LoggedInHome.js
+++ b/src/LoggedInHome.js
@@ -67,6 +67,7 @@ export default withRouter(class LoggedInHome extends React.Component {
 			sliderValue: 1,
 			switchLanguage: false,
 			totalTestQuestions: 1,
+			pendingDeletions: {},
 		};
 
 		let isMounted = true;
@@ -231,17 +232,36 @@ export default withRouter(class LoggedInHome extends React.Component {
 	}
 
 	deleteProgress = (progressId) => {
-		this.state.db.collection("progress")
+		if (this.state.pendingDeletions[progressId] !== true) {
+			let pendingDeletions = this.state.pendingDeletions;
+			pendingDeletions[progressId] = true;
+			
+			this.setState({
+				pendingDeletions: pendingDeletions,
+			});
+			
+			this.state.db.collection("progress")
 			.doc(progressId)
 			.delete()
 			.then(() => {
 				const progressIndex = this.state.progressHistoryIncomplete.map((obj) => obj.id).indexOf(progressId);
 				let newState = {
-					progressHistoryIncomplete: this.state.progressHistoryIncomplete,
-				};
-				newState.progressHistoryIncomplete.splice(progressIndex, 1);
-				this.setState(newState);
-			});
+						progressHistoryIncomplete: this.state.progressHistoryIncomplete,
+					};
+					newState.progressHistoryIncomplete.splice(progressIndex, 1);
+					newState.pendingDeletions = this.state.pendingDeletions;
+					delete pendingDeletions[progressId];
+					this.setState(newState);
+				})
+				.catch((error) => {
+					console.log(`Couldn't delete progress: ${error}`);
+					let pendingDeletions = this.state.pendingDeletions;
+					delete pendingDeletions[progressId];
+					this.setState({
+						pendingDeletions: pendingDeletions,
+					});
+				});
+		}
 	}
 
 	showTestStart = () => {
@@ -427,6 +447,8 @@ export default withRouter(class LoggedInHome extends React.Component {
 													className="button--no-background"
 													onClick={() => this.deleteProgress(progressItem.id)}
 													icon={<DeleteRoundedIcon />}
+													disabled={this.state.pendingDeletions[progressItem.id] === true}
+													loading={this.state.pendingDeletions[progressItem.id] === true}
 												></Button>
 											</p>
 										</div>
diff --git a/src/SetPage.js b/src/SetPage.js
index 8a0bd0c..1b6a646 100644
--- a/src/SetPage.js
+++ b/src/SetPage.js
@@ -485,6 +485,7 @@ export default withRouter(class SetPage extends React.Component {
 								switchLanguage={this.state.switchLanguage}
 								handleSwitchLanguageChange={this.handleSwitchLanguageChange}
 									loading={this.state.loading}
+									disabled={!this.state.canStartTest}
 							/>
 						}
 						{
@@ -498,6 +499,7 @@ export default withRouter(class SetPage extends React.Component {
 								switchLanguage={this.state.switchLanguage}
 								handleSwitchLanguageChange={this.handleSwitchLanguageChange}
 								loading={this.state.loading}
+								disabled={!this.state.canStartTest}
 							/>
 						}
 						{