From fc235d605778e89d4f074108f19ca11896ce21ba Mon Sep 17 00:00:00 2001
From: Vincent <vincent@loki.network>
Date: Wed, 11 Dec 2019 17:48:54 +1100
Subject: [PATCH] Completed message selection

---
 _locales/en/messages.json                     |  4 ++++
 js/models/conversations.js                    |  1 +
 js/views/conversation_view.js                 | 19 ++-----------------
 .../conversation/ConversationHeader.tsx       | 14 ++++++++------
 ts/components/session/icon/SessionIcon.tsx    |  2 --
 .../session/icon/SessionIconButton.tsx        | 16 ++++++++++++----
 6 files changed, 27 insertions(+), 29 deletions(-)

diff --git a/_locales/en/messages.json b/_locales/en/messages.json
index b38ab944b..b77bc0a39 100644
--- a/_locales/en/messages.json
+++ b/_locales/en/messages.json
@@ -997,6 +997,10 @@
   "delete": {
     "message": "Delete"
   },
+  "forwardMessage": {
+    "message": "Forward",
+    "description": "Text of Forward Message button"
+  },
   "deletePublicWarning": {
     "message":
       "Are you sure? Clicking 'delete' will permanently remove this message for everyone in this channel."
diff --git a/js/models/conversations.js b/js/models/conversations.js
index 785867833..cf2fa7abb 100644
--- a/js/models/conversations.js
+++ b/js/models/conversations.js
@@ -590,6 +590,7 @@
         onCopyPublicKey: () => this.copyPublicKey(),
         onDeleteContact: () => this.deleteContact(),
         onDeleteMessages: () => this.deleteMessages(),
+        onCloseOverlay: () => this.resetMessageSelection(),
       };
 
       this.updateAsyncPropsCache();
diff --git a/js/views/conversation_view.js b/js/views/conversation_view.js
index 082e9f0e4..d7cf37a08 100644
--- a/js/views/conversation_view.js
+++ b/js/views/conversation_view.js
@@ -152,11 +152,6 @@
         'show-message-detail',
         this.showMessageDetail
       );
-      this.listenTo(
-        this.model,
-        'message-selection-changed',
-        this.onMessageSelectionChanged
-      );
       this.listenTo(this.model.messageCollection, 'navigate-to', url => {
         window.location = url;
       });
@@ -241,6 +236,8 @@
           onSetDisappearingMessages: seconds =>
             this.setDisappearingMessages(seconds),
           onDeleteMessages: () => this.destroyMessages(),
+          onDeleteSelectedMessages: () => this.deleteSelectedMessages(),
+          onCloseOverlay: () => this.model.resetMessageSelection(),
           onDeleteContact: () => this.model.deleteContact(),
           onResetSession: () => this.endSession(),
 
@@ -1814,18 +1811,6 @@
       }
     },
 
-    onMessageSelectionChanged() {
-      const selectionSize = this.model.selectedMessages.size;
-
-      if (selectionSize > 0) {
-        $('.compose').hide();
-      } else {
-        $('.compose').show();
-      }
-
-      this.bulkEditView.update(selectionSize);
-    },
-
     resetMessageSelection() {
       this.model.resetMessageSelection();
     },
diff --git a/ts/components/conversation/ConversationHeader.tsx b/ts/components/conversation/ConversationHeader.tsx
index d7d11bed3..921567478 100644
--- a/ts/components/conversation/ConversationHeader.tsx
+++ b/ts/components/conversation/ConversationHeader.tsx
@@ -62,6 +62,9 @@ interface Props {
   onDeleteContact: () => void;
   onResetSession: () => void;
 
+  onCloseOverlay: () => void;
+  onDeleteSelectedMessages: () => void;
+
   onArchive: () => void;
   onMoveToInbox: () => void;
 
@@ -246,7 +249,6 @@ export class ConversationHeader extends React.Component<Props> {
         <SessionIconButton
           iconType={SessionIconType.Ellipses}
           iconSize={SessionIconSize.Large}
-          onClick={this.showMenuBound}
         />
       </ContextMenuTrigger>
     );
@@ -302,7 +304,7 @@ export class ConversationHeader extends React.Component<Props> {
   }
 
   public renderSelectionOverlay() {
-    const { onDeleteMessages } = this.props;
+    const { onDeleteSelectedMessages, onCloseOverlay, i18n } = this.props;
 
     return (
       <div className="message-selection-overlay">
@@ -310,6 +312,7 @@ export class ConversationHeader extends React.Component<Props> {
           <SessionIconButton
             iconType={SessionIconType.Exit}
             iconSize={SessionIconSize.Medium}
+            onClick={onCloseOverlay}
           />
         </div>
 
@@ -317,15 +320,14 @@ export class ConversationHeader extends React.Component<Props> {
           <SessionButton
             buttonType={SessionButtonType.Default}
             buttonColor={SessionButtonColor.Primary}
-            text={'Forward'}
-            onClick={onDeleteMessages}
+            text={i18n('forwardMessage')}
           />
 
           <SessionButton
             buttonType={SessionButtonType.Default}
             buttonColor={SessionButtonColor.Danger}
-            text={'Delete'}
-            onClick={onDeleteMessages}
+            text={i18n('delete')}
+            onClick={onDeleteSelectedMessages}
           />
         </div>
       </div>
diff --git a/ts/components/session/icon/SessionIcon.tsx b/ts/components/session/icon/SessionIcon.tsx
index 17e569892..0996be30e 100644
--- a/ts/components/session/icon/SessionIcon.tsx
+++ b/ts/components/session/icon/SessionIcon.tsx
@@ -9,7 +9,6 @@ export interface Props {
   iconColor: string;
   iconPadded: boolean;
   iconRotation: number;
-  onClick: any;
 }
 
 export class SessionIcon extends React.PureComponent<Props> {
@@ -18,7 +17,6 @@ export class SessionIcon extends React.PureComponent<Props> {
     iconColor: '',
     iconRotation: 0,
     iconPadded: false,
-    onClick: () => null,
   };
 
   constructor(props: any) {
diff --git a/ts/components/session/icon/SessionIconButton.tsx b/ts/components/session/icon/SessionIconButton.tsx
index 7d92c4499..4c8773990 100644
--- a/ts/components/session/icon/SessionIconButton.tsx
+++ b/ts/components/session/icon/SessionIconButton.tsx
@@ -3,8 +3,18 @@ import classNames from 'classnames';
 
 import { Props, SessionIcon } from '../icon';
 
-export class SessionIconButton extends React.PureComponent<Props> {
-  public static defaultProps = SessionIcon.defaultProps;
+interface SProps extends Props {
+  onClick: any;
+}
+
+export class SessionIconButton extends React.PureComponent<SProps> {
+  public static readonly extendedDefaults = {
+    onClick: () => null,
+  };
+  public static readonlydefaultProps = {
+    ...SessionIcon.defaultProps,
+    ...SessionIconButton.extendedDefaults,
+  };
 
   constructor(props: any) {
     super(props);
@@ -18,7 +28,6 @@ export class SessionIconButton extends React.PureComponent<Props> {
       iconColor,
       iconRotation,
       iconPadded,
-      onClick,
     } = this.props;
 
     return (
@@ -38,7 +47,6 @@ export class SessionIconButton extends React.PureComponent<Props> {
           iconSize={iconSize}
           iconColor={iconColor}
           iconRotation={iconRotation}
-          onClick={onClick}
         />
       </div>
     );