Disable action buttons while collecting a problem report

1 files changed, 29 insertions, 9 deletions

diff --git a/gui/src/renderer/components/Support.tsx b/gui/src/renderer/components/Support.tsx
index 46045d4af4..c3b7d42993 100644
--- a/gui/src/renderer/components/Support.tsx
+++ b/gui/src/renderer/components/Support.tsx
@@ -25,6 +25,7 @@ interface ISupportState {
   message: string;
   savedReport?: string;
   sendState: SendState;
+  disableActions: boolean;
 }
 
 interface ISupportProps {
@@ -46,6 +47,7 @@ export default class Support extends Component<ISupportProps, ISupportState> {
     message: '',
     savedReport: undefined,
     sendState: SendState.Initial,
+    disableActions: false,
   };
 
   private collectLogPromise?: Promise<string>;
@@ -74,13 +76,15 @@ export default class Support extends Component<ISupportProps, ISupportState> {
     });
   };
 
-  public onViewLog = async (): Promise<void> => {
-    try {
-      const reportPath = await this.collectLog();
-      this.props.viewLog(reportPath);
-    } catch (error) {
-      // TODO: handle error
-    }
+  public onViewLog = () => {
+    this.performWithActionsDisabled(async () => {
+      try {
+        const reportPath = await this.collectLog();
+        this.props.viewLog(reportPath);
+      } catch (error) {
+        // TODO: handle error
+      }
+    });
   };
 
   public onSend = async (): Promise<void> => {
@@ -251,13 +255,18 @@ export default class Support extends Component<ISupportProps, ISupportState> {
             </View>
           </View>
           <View style={styles.support__footer}>
-            <AppButton.BlueButton style={styles.view_logs_button} onPress={this.onViewLog}>
+            <AppButton.BlueButton
+              style={styles.view_logs_button}
+              onPress={this.onViewLog}
+              disabled={this.state.disableActions}>
               <AppButton.Label>
                 {messages.pgettext('support-view', 'View app logs')}
               </AppButton.Label>
               <AppButton.Icon source="icon-extLink" height={16} width={16} />
             </AppButton.BlueButton>
-            <AppButton.GreenButton disabled={!this.validate()} onPress={this.onSend}>
+            <AppButton.GreenButton
+              disabled={!this.validate() || this.state.disableActions}
+              onPress={this.onSend}>
               {messages.pgettext('support-view', 'Send')}
             </AppButton.GreenButton>
           </View>
@@ -365,6 +374,17 @@ export default class Support extends Component<ISupportProps, ISupportState> {
   private handleEditMessage = () => {
     this.setState({ sendState: SendState.Initial });
   };
+
+  private performWithActionsDisabled(work: () => Promise<void>) {
+    this.setState({ disableActions: true }, async () => {
+      try {
+        await work();
+      } catch {
+        // TODO: handle error
+      }
+      this.setState({ disableActions: false });
+    });
+  }
 }
 
 interface IConfirmNoEmailDialogProps {