[FIX] mail: added a search button for whatsapp channels

Before this commit: In mobile view, whatsapp tab had no search button. After this commit: In mobile view, added a search button to find whatsapp channel. task-id:3525542 closes #159461 Related: odoo/enterprise#59530 Signed-off-by: Sébastien Theys (seb) <seb@odoo.com>
odoo · May 16, 2024 · 641e9a9 · 641e9a9
1 parent ef960f3
commit 641e9a9
Show file tree

Hide file tree

Showing 2 changed files with 18 additions and 11 deletions.
diff --git a/addons/mail/static/src/web/messaging_menu/messaging_menu.js b/addons/mail/static/src/web/messaging_menu/messaging_menu.js
@@ -36,9 +36,7 @@ export class MessagingMenu extends Component {
             addingChannel: false,
             isOpen: false,
         });
-        onExternalClick("selector", () => {
-            Object.assign(this.state, { addingChat: false, addingChannel: false });
-        });
+        onExternalClick("selector", this.handleExternalClick.bind(this));
         onWillRender(() => this.threads = this.getThreads());
     }
 
@@ -153,6 +151,10 @@ export class MessagingMenu extends Component {
         });
     }
 
+    handleExternalClick() {
+        Object.assign(this.state, { addingChat: false, addingChannel: false });
+    }
+
     /**
      * @type {{ id: string, icon: string, label: string }[]}
      */
@@ -310,6 +312,13 @@ export class MessagingMenu extends Component {
         }
         return value;
     }
+
+    get displayChannelSelector() {
+        return (
+            ["chat", "channel"].includes(this.store.discuss.activeTab) &&
+            (this.state.addingChannel || this.state.addingChat)
+        );
+    }
 }
 
 registry

diff --git a/addons/mail/static/src/web/messaging_menu/messaging_menu.xml b/addons/mail/static/src/web/messaging_menu/messaging_menu.xml
@@ -26,14 +26,12 @@
                 <button class="btn btn-link" t-att-class="store.discuss.activeTab === 'channel' ? 'fw-bolder' : 'text-muted'" type="button" role="tab" t-on-click="() => store.discuss.activeTab = 'channel'">Channels</button>
             </t>
             <div class="flex-grow-1"></div>
-            <t t-if="!store.discuss.isActive or store.isSmall and store.discuss.activeTab !== 'mailbox'">
-                <t t-if="env.inDiscussApp and ['chat', 'channel'].includes(store.discuss.activeTab)">
-                    <div t-if="state.addingChat or state.addingChannel" class="p-4 border-bottom bg-light" t-ref="selector">
-                        <t t-if="state.addingChat" t-set="category" t-value="store.discuss.chats"/>
-                        <t t-if="state.addingChannel" t-set="category" t-value="store.discuss.channels"/>
-                        <ChannelSelector category="category" autofocus="true"/>
-                    </div>
-                </t>
+            <t name="searchBar" t-if="!store.discuss.isActive or store.isSmall and store.discuss.activeTab !== 'mailbox'">
+                <div t-if="env.inDiscussApp and displayChannelSelector" class="p-4 border-bottom bg-light" t-ref="selector">
+                    <t t-if="state.addingChat" t-set="category" t-value="store.discuss.chats"/>
+                    <t t-if="state.addingChannel" t-set="category" t-value="store.discuss.channels"/>
+                    <ChannelSelector category="category" autofocus="true"/>
+                </div>
                 <button t-if="!env.inDiscussApp or (env.inDiscussApp and store.discuss.activeTab === 'chat' and !state.addingChat)" t-att-class="env.inDiscussApp ? 'w-100 p-2 btn btn-secondary border-bottom bg-light' : 'btn btn-link'" t-on-click.stop="onClickNewMessage">
                     <t t-if="env.inDiscussApp">Start a conversation</t>
                     <t t-else="">New Message</t>