From 9ada9f6a479bcf690c55ba676799979a175f2ade Mon Sep 17 00:00:00 2001
From: Scott Nonnenberg <scott@signal.org>
Date: Tue, 7 Sep 2021 17:11:17 -0700
Subject: [PATCH] Fix Connecting spinner in dark mode, maintain draft
 attachment order

---
 stylesheets/_modules.scss                  | 12 ++++++++++++
 stylesheets/components/LeftPaneDialog.scss |  5 +++++
 ts/views/conversation_view.ts              | 22 +++++++++++++++++-----
 3 files changed, 34 insertions(+), 5 deletions(-)

diff --git a/stylesheets/_modules.scss b/stylesheets/_modules.scss
index df80b3dd5ab..851ae2bfcd5 100644
--- a/stylesheets/_modules.scss
+++ b/stylesheets/_modules.scss
@@ -4443,10 +4443,22 @@ button.module-image__border-overlay:focus {
 .module-spinner__circle--small {
   -webkit-mask: url('../images/spinner-track-24.svg') no-repeat center;
   -webkit-mask-size: 100%;
+
+  // For specificity
+  @include dark-theme {
+    -webkit-mask: url('../images/spinner-track-24.svg') no-repeat center;
+    -webkit-mask-size: 100%;
+  }
 }
 .module-spinner__arc--small {
   -webkit-mask: url('../images/spinner-24.svg') no-repeat center;
   -webkit-mask-size: 100%;
+
+  // For specificity
+  @include dark-theme {
+    -webkit-mask: url('../images/spinner-24.svg') no-repeat center;
+    -webkit-mask-size: 100%;
+  }
 }
 
 .module-spinner__circle--incoming {
diff --git a/stylesheets/components/LeftPaneDialog.scss b/stylesheets/components/LeftPaneDialog.scss
index 9552c841c4c..19e875f18f2 100644
--- a/stylesheets/components/LeftPaneDialog.scss
+++ b/stylesheets/components/LeftPaneDialog.scss
@@ -33,6 +33,11 @@
   &__spinner {
     &__arc {
       background-color: $color-black;
+
+      // Needed for specificity
+      @include dark-theme {
+        background-color: $color-black;
+      }
     }
 
     &__circle {
diff --git a/ts/views/conversation_view.ts b/ts/views/conversation_view.ts
index c0747e04f89..1f8e4ce9bda 100644
--- a/ts/views/conversation_view.ts
+++ b/ts/views/conversation_view.ts
@@ -1913,12 +1913,24 @@ export class ConversationView extends window.Backbone.View<ConversationModel> {
     const onDisk = await this.writeDraftAttachment(attachment);
 
     // Remove any pending attachments that were transcoding
-    const draftAttachments = (this.model.get('draftAttachments') || []).filter(
-      draftAttachment => draftAttachment.path !== attachment.path
+    const draftAttachments = this.model.get('draftAttachments') || [];
+    const index = draftAttachments.findIndex(
+      draftAttachment => draftAttachment.path === attachment.path
     );
-    this.model.set({
-      draftAttachments: [onDisk, ...draftAttachments],
-    });
+    if (index < 0) {
+      window.log.warn(
+        `addAttachment: Failed to find pending attachment with path ${attachment.path}`
+      );
+      this.model.set({
+        draftAttachments: [...draftAttachments, onDisk],
+      });
+    } else {
+      const toUpdate = [...draftAttachments];
+      toUpdate.splice(index, 1, onDisk);
+      this.model.set({
+        draftAttachments: toUpdate,
+      });
+    }
     this.updateAttachmentsView();
 
     await this.saveModel();