From b0818df329d9ea86af2048a75c81955b2324bf06 Mon Sep 17 00:00:00 2001
From: Luke Barnard <luke@matrix.org>
Date: Tue, 10 Apr 2018 15:31:04 +0100
Subject: [PATCH] Add 500ms delay to show `membershipBusy` for longer

to avoid a UI that flashes quickly
---
 src/components/structures/GroupView.js | 23 +++++++++++++++++++----
 1 file changed, 19 insertions(+), 4 deletions(-)

diff --git a/src/components/structures/GroupView.js b/src/components/structures/GroupView.js
index 353c0a8694..1c1009d6fa 100644
--- a/src/components/structures/GroupView.js
+++ b/src/components/structures/GroupView.js
@@ -671,8 +671,12 @@ export default React.createClass({
         });
     },
 
-    _onAcceptInviteClick: function() {
+    _onAcceptInviteClick: async function() {
         this.setState({membershipBusy: true});
+
+        // Wait 500ms to prevent flashing
+        await Promise.delay(500);
+
         this._groupStore.acceptGroupInvite().then(() => {
             // don't reset membershipBusy here: wait for the membership change to come down the sync
         }).catch((e) => {
@@ -685,8 +689,12 @@ export default React.createClass({
         });
     },
 
-    _onRejectInviteClick: function() {
+    _onRejectInviteClick: async function() {
         this.setState({membershipBusy: true});
+
+        // Wait 500ms to prevent flashing
+        await Promise.delay(500);
+
         this._groupStore.leaveGroup().then(() => {
             // don't reset membershipBusy here: wait for the membership change to come down the sync
         }).catch((e) => {
@@ -699,9 +707,12 @@ export default React.createClass({
         });
     },
 
-    _onJoinClick: function() {
+    _onJoinClick: async function() {
         this.setState({membershipBusy: true});
 
+        // Wait 500ms to prevent flashing
+        await Promise.delay(500);
+
         this._groupStore.joinGroup().then(() => {
             // don't reset membershipBusy here: wait for the membership change to come down the sync
         }).catch((e) => {
@@ -721,10 +732,14 @@ export default React.createClass({
             description: _t("Leave %(groupName)s?", {groupName: this.props.groupId}),
             button: _t("Leave"),
             danger: true,
-            onFinished: (confirmed) => {
+            onFinished: async (confirmed) => {
                 if (!confirmed) return;
 
                 this.setState({membershipBusy: true});
+
+                // Wait 500ms to prevent flashing
+                await Promise.delay(500);
+
                 this._groupStore.leaveGroup().then(() => {
                     // don't reset membershipBusy here: wait for the membership change to come down the sync
                 }).catch((e) => {