From d71c183f1934c81416d1d03bc54d65697b995e4e Mon Sep 17 00:00:00 2001
From: Elisabeth Dickinson <edi@odoo.com>
Date: Mon, 9 Jan 2023 16:38:29 +0000
Subject: [PATCH] [IMP] mail: fix chat header's close button on mobile
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

While being logged in on mobile and having a chat window open in the
frontend, the buttons to close the chat window and to go to
the backend — both located on the top-left side of the screen — overlap,
making it impossible to close the chat window.

To solve this issue we've removed the chat window's `.fa-arrow-left`
and replaced it with the `.fa-close` icon on the right which is the
design we already have on desktop. Padding had been removed around
the close button on mobile and has been put back.

task-3120032

closes odoo/odoo#126889

X-original-commit: 870fcceab0c4142035d257b7b6fe6e7fcbf2a372
Related: odoo/enterprise#43485
Signed-off-by: Alexandre Kühn (aku) <aku@odoo.com>
---
 addons/mail/static/src/core/common/chat_window.xml | 5 +----
 1 file changed, 1 insertion(+), 4 deletions(-)

diff --git a/addons/mail/static/src/core/common/chat_window.xml b/addons/mail/static/src/core/common/chat_window.xml
index 0a2b847c236..661b037b394 100644
--- a/addons/mail/static/src/core/common/chat_window.xml
+++ b/addons/mail/static/src/core/common/chat_window.xml
@@ -14,9 +14,6 @@
         tabindex="1"
     >
         <div class="o-mail-ChatWindow-header d-flex align-items-center flex-shrink-0 bg-100" t-on-click="onClickHeader" t-att-class="{ 'cursor-pointer': !ui.isSmall, 'border-bottom': !props.chatWindow.folded }">
-            <div t-if="ui.isSmall" class="cursor-pointer d-flex align-items-center h-100 px-3 py-0 me-2" title="Close conversation" t-on-click="() => this.close()">
-                <i class="oi oi-arrow-left"/>
-            </div>
             <t t-if="threadActions.actions.length > 3">
                 <Dropdown position="'bottom-start'" onStateChanged="state => this.onActionsMenuStateChanged(state)" togglerClass="`o-mail-ChatWindow-command d-flex btn align-items-center text-truncate p-0 p-1 ${ !ui.isSmall ? 'ms-2' : '' }`" menuClass="'d-flex flex-column py-0'" class="'d-flex text-truncate'" disabled="state.editingName" title="actionsMenuTitleText">
                     <t t-set-slot="toggler">
@@ -75,7 +72,7 @@
 </t>
 
 <t t-name="mail.ChatWindow.headerContent" owl="1">
-    <div t-if="thread" class="o-mail-ChatWindow-threadAvatar my-0" t-attf-class="{{ ui.isSmall or threadActions.actions.length > 4 ? 'ms-1' : 'ms-3' }} me-1">
+    <div t-if="thread" class="o-mail-ChatWindow-threadAvatar my-0" t-attf-class="{{ threadActions.actions.length > 4 ? 'ms-1' : 'ms-3' }} me-1">
         <img class="rounded" t-att-src="thread.imgUrl" alt="Thread Image"/>
     </div>
     <ThreadIcon t-if="thread and thread.type === 'chat' and thread.correspondent" thread="thread"/>