From 2c914c554d652c6db0105d2e50e85742a930b690 Mon Sep 17 00:00:00 2001
From: Audric Ackermann <audric.ackermann@smile.fr>
Date: Wed, 27 Nov 2019 15:46:56 +1100
Subject: [PATCH] Message: click on avatar show userDetailModal

Disable the click on avatar because before it selected the message.
OnClick on avatar -> trigger event to show the UserDetails modal with this pubkey.
---
 ts/components/conversation/Message.tsx | 28 +++++++++++++++-----------
 1 file changed, 16 insertions(+), 12 deletions(-)

diff --git a/ts/components/conversation/Message.tsx b/ts/components/conversation/Message.tsx
index bf3401165..29d901be8 100644
--- a/ts/components/conversation/Message.tsx
+++ b/ts/components/conversation/Message.tsx
@@ -673,7 +673,13 @@ export class Message extends React.PureComponent<Props, State> {
     }
 
     return (
-      <div className="module-message__author-avatar">
+      <div
+        className="module-message__author-avatar"
+        role="button"
+        onClick={() => {
+          onShowUserDetails(authorPhoneNumber);
+        }}
+      >
         <Avatar
           avatarPath={authorAvatarPath}
           color={authorColor}
@@ -1084,17 +1090,7 @@ export class Message extends React.PureComponent<Props, State> {
     const enableContextMenu = !isRss && !multiSelectMode;
 
     return (
-      <div
-        className={classNames(divClasses)}
-        role="button"
-        onClick={() => {
-          const selection = window.getSelection();
-          if (selection && selection.type === 'Range') {
-            return;
-          }
-          this.props.onSelectMessage();
-        }}
-      >
+      <div className={classNames(divClasses)}>
         <ContextMenuTrigger id={rightClickTriggerId}>
           {this.renderCheckBox()}
           {this.renderAvatar()}
@@ -1104,6 +1100,14 @@ export class Message extends React.PureComponent<Props, State> {
               `module-message--${direction}`,
               expiring ? 'module-message--expired' : null
             )}
+            role="button"
+            onClick={() => {
+              const selection = window.getSelection();
+              if (selection && selection.type === 'Range') {
+                return;
+              }
+              this.props.onSelectMessage();
+            }}
           >
             {this.renderError(isIncoming)}
             {isRss ? null : this.renderMenu(!isIncoming, triggerId)}