From e1548b66e42bad91261784c8aa09476df56ed16a Mon Sep 17 00:00:00 2001
From: Audric Ackermann <audric@loki.network>
Date: Tue, 17 Nov 2020 11:55:01 +1100
Subject: [PATCH] enable back drag events as now the SessionConversation
 updates only

---
 .../conversation/SessionConversation.tsx      | 53 ++++++++++++++-----
 1 file changed, 41 insertions(+), 12 deletions(-)

diff --git a/ts/components/session/conversation/SessionConversation.tsx b/ts/components/session/conversation/SessionConversation.tsx
index 148dff562..9a6590c0b 100644
--- a/ts/components/session/conversation/SessionConversation.tsx
+++ b/ts/components/session/conversation/SessionConversation.tsx
@@ -152,8 +152,48 @@ export class SessionConversation extends React.Component<Props, State> {
   // ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~
 
   public componentDidUpdate(prevProps: Props, prevState: State) {
-    if (this.props.conversationKey !== prevProps.conversationKey) {
+    const {
+      conversationKey: newConversationKey,
+      conversation: newConversation,
+    } = this.props;
+    const { conversationKey: oldConversationKey } = prevProps;
+
+    // if the convo is valid, and it changed, register for drag events
+    if (
+      newConversationKey &&
+      newConversation &&
+      newConversationKey !== oldConversationKey
+    ) {
+      // Pause thread to wait for rendering to complete
+      setTimeout(() => {
+        const div = this.messageContainerRef.current;
+        div?.addEventListener('dragenter', this.handleDragIn);
+        div?.addEventListener('dragleave', this.handleDragOut);
+        div?.addEventListener('dragover', this.handleDrag);
+        div?.addEventListener('drop', this.handleDrop);
+      }, 100);
+    }
+    // if we do not have a model, unregister for events
+    if (!newConversation) {
+      const div = this.messageContainerRef.current;
+      div?.removeEventListener('dragenter', this.handleDragIn);
+      div?.removeEventListener('dragleave', this.handleDragOut);
+      div?.removeEventListener('dragover', this.handleDrag);
+      div?.removeEventListener('drop', this.handleDrop);
+    }
+    if (newConversationKey !== oldConversationKey) {
       void this.loadInitialMessages();
+      this.setState({
+        showOptionsPane: false,
+        selectedMessages: [],
+        // isScrolledToBottom: !this.props.unreadCount,
+        displayScrollToBottomButton: false,
+        showOverlay: false,
+        showRecordingView: false,
+        infoViewState: undefined,
+        stagedAttachments: [],
+        isDraggingFile: false,
+      });
     }
   }
 
@@ -165,17 +205,6 @@ export class SessionConversation extends React.Component<Props, State> {
     div?.removeEventListener('drop', this.handleDrop);
   }
 
-  public componentDidMount() {
-    // Pause thread to wait for rendering to complete
-    setTimeout(() => {
-      const div = this.messageContainerRef.current;
-      div?.addEventListener('dragenter', this.handleDragIn);
-      div?.addEventListener('dragleave', this.handleDragOut);
-      div?.addEventListener('dragover', this.handleDrag);
-      div?.addEventListener('drop', this.handleDrop);
-    }, 100);
-  }
-
   // ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~
   // ~~~~~~~~~~~~~~ RENDER METHODS ~~~~~~~~~~~~~~
   // ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~