From 6f8affe5c9082aed9b3e242e19aaacf3c28d1b09 Mon Sep 17 00:00:00 2001
From: Audric Ackermann <audric@loki.network>
Date: Mon, 20 Apr 2020 10:33:00 +1000
Subject: [PATCH] add spinner while unlinking device

---
 js/background.js                       |  3 ++-
 ts/components/DevicePairingDialog.tsx  | 17 ++++++++++++-----
 ts/components/conversation/Message.tsx |  4 +---
 3 files changed, 15 insertions(+), 9 deletions(-)

diff --git a/js/background.js b/js/background.js
index 6a800039b..91ca3cf60 100644
--- a/js/background.js
+++ b/js/background.js
@@ -1355,7 +1355,7 @@
       );
     });
 
-    Whisper.events.on('deviceUnpairingRequested', async pubKey => {
+    Whisper.events.on('deviceUnpairingRequested', async (pubKey, callback) => {
       await libloki.storage.removePairingAuthorisationForSecondaryPubKey(
         pubKey
       );
@@ -1365,6 +1365,7 @@
       // Remove all traces of the device
       ConversationController.deleteContact(pubKey);
       Whisper.events.trigger('refreshLinkedDeviceList');
+      callback();
     });
   }
 
diff --git a/ts/components/DevicePairingDialog.tsx b/ts/components/DevicePairingDialog.tsx
index b87d43b6e..05407f441 100644
--- a/ts/components/DevicePairingDialog.tsx
+++ b/ts/components/DevicePairingDialog.tsx
@@ -211,6 +211,7 @@ export class DevicePairingDialog extends React.Component<Props, State> {
               buttonColor={SessionButtonColor.Danger}
             />
           </div>
+          <SessionSpinner loading={this.state.loading} />
         </div>
       </SessionModal>
     );
@@ -370,13 +371,19 @@ export class DevicePairingDialog extends React.Component<Props, State> {
   }
 
   private triggerUnpairDevice() {
+    const deviceUnpaired = () => {
+      window.pushToast({
+        title: window.i18n('deviceUnpaired'),
+      });
+      this.closeDialog();
+      this.setState({ loading: false });
+    };
+    this.setState({ loading: true });
+
     window.Whisper.events.trigger(
       'deviceUnpairingRequested',
-      this.props.pubKeyToUnpair
+      this.props.pubKeyToUnpair,
+      deviceUnpaired
     );
-    window.pushToast({
-      title: window.i18n('deviceUnpaired'),
-    });
-    this.closeDialog();
   }
 }
diff --git a/ts/components/conversation/Message.tsx b/ts/components/conversation/Message.tsx
index ccb45dbeb..664fd9cff 100644
--- a/ts/components/conversation/Message.tsx
+++ b/ts/components/conversation/Message.tsx
@@ -1086,9 +1086,7 @@ export class Message extends React.PureComponent<Props, State> {
     // We parse the message later, but we still need to do an early check
     // to see if the message mentions us, so we can display the entire
     // message differently
-    const mentions = text
-      ? text.match(window.pubkeyPattern)
-      : [];
+    const mentions = text ? text.match(window.pubkeyPattern) : [];
     const mentionMe =
       mentions &&
       mentions.some(m => m.slice(1) === window.lokiPublicChatAPI.ourKey);