From 634eb85a97e167aecd33ada7f8a613c488d40d87 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Alexandre=20K=C3=BChn?= <aku@odoo.com>
Date: Tue, 21 Jun 2022 14:55:03 +0000
Subject: [PATCH] [IMP] mail, knowledge: mark Emoji(List) component as Legacy
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

This commit duplicates the components Emoji and EmojiList into
other components called "LegacyEmoji" "LegacyEmojiList".

We do this so that we can implement the new EmojiPicker in Discuss
code, without affecting the code of `knowledge` during development.

When the Emoji Picker is in a good state with just the scope of
feature of Discuss, then we can integrate this new Emoji Picker
in other modules, like `knowledge`.

Task-2890268

closes odoo/odoo#94254

Signed-off-by: Alexandre Kühn (aku) <aku@odoo.com>
---
 .../components/emoji_picker/emoji_list.xml    |  4 +-
 .../components/emoji_picker/emoji_picker.js   | 10 ++--
 .../components/legacy_emoji/legacy_emoji.js   | 16 ++++++
 .../components/legacy_emoji/legacy_emoji.xml  | 10 ++++
 .../legacy_emoji_list/legacy_emoji_list.js    | 57 +++++++++++++++++++
 .../legacy_emoji_list/legacy_emoji_list.scss  |  9 +++
 .../legacy_emoji_list/legacy_emoji_list.xml   | 14 +++++
 7 files changed, 113 insertions(+), 7 deletions(-)
 create mode 100644 addons/mail/static/src/components/legacy_emoji/legacy_emoji.js
 create mode 100644 addons/mail/static/src/components/legacy_emoji/legacy_emoji.xml
 create mode 100644 addons/mail/static/src/components/legacy_emoji_list/legacy_emoji_list.js
 create mode 100644 addons/mail/static/src/components/legacy_emoji_list/legacy_emoji_list.scss
 create mode 100644 addons/mail/static/src/components/legacy_emoji_list/legacy_emoji_list.xml

diff --git a/addons/knowledge/static/src/components/emoji_picker/emoji_list.xml b/addons/knowledge/static/src/components/emoji_picker/emoji_list.xml
index 6f316d9b919..86d1d0f892c 100644
--- a/addons/knowledge/static/src/components/emoji_picker/emoji_list.xml
+++ b/addons/knowledge/static/src/components/emoji_picker/emoji_list.xml
@@ -1,7 +1,7 @@
 <?xml version="1.0" encoding="UTF-8"?>
 <templates xml:space="preserve">
-    <t t-name="knowledge.EmojiList" t-inherit="mail.EmojiList" t-inherit-mode="primary" owl="1">
-        <xpath expr="//div[hasclass('o_EmojiList')]" position="before">
+    <t t-name="knowledge.LegacyEmojiList" t-inherit="mail.LegacyEmojiList" t-inherit-mode="primary" owl="1">
+        <xpath expr="//div[hasclass('o_LegacyEmojiList')]" position="before">
             <div class="d-flex justify-content-end p-2">
                 <button class="btn btn-outline-danger w-100" t-on-click="onRemoveEmoji" title="Remove Icon">
                     <i class="fa fa-times-circle"/> Remove Icon
diff --git a/addons/knowledge/static/src/components/emoji_picker/emoji_picker.js b/addons/knowledge/static/src/components/emoji_picker/emoji_picker.js
index 6af19dade90..bdee20d72ea 100644
--- a/addons/knowledge/static/src/components/emoji_picker/emoji_picker.js
+++ b/addons/knowledge/static/src/components/emoji_picker/emoji_picker.js
@@ -3,7 +3,7 @@
 import emojis from '@mail/js/emojis';
 const { Component } = owl;
 
-class Emoji extends Component {
+class LegacyEmoji extends Component {
     /**
      * @override
      */
@@ -14,8 +14,8 @@ class Emoji extends Component {
     }
 }
 
-Emoji.template = 'mail.Emoji';
-Emoji.props = {
+LegacyEmoji.template = 'mail.LegacyEmoji';
+LegacyEmoji.props = {
     emojiView: Object
 };
 
@@ -53,8 +53,8 @@ class EmojiPicker extends Component {
     }
 }
 
-EmojiPicker.template = 'knowledge.EmojiList';
+EmojiPicker.template = 'knowledge.LegacyEmojiList';
 EmojiPicker.props = ['onClickEmoji'];
-EmojiPicker.components = { Emoji };
+EmojiPicker.components = { LegacyEmoji };
 
 export default EmojiPicker;
diff --git a/addons/mail/static/src/components/legacy_emoji/legacy_emoji.js b/addons/mail/static/src/components/legacy_emoji/legacy_emoji.js
new file mode 100644
index 00000000000..3ce3530b110
--- /dev/null
+++ b/addons/mail/static/src/components/legacy_emoji/legacy_emoji.js
@@ -0,0 +1,16 @@
+/** @odoo-module **/
+
+import { registerMessagingComponent } from '@mail/utils/messaging_component';
+
+const { Component } = owl;
+
+export class LegacyEmoji extends Component {}
+
+Object.assign(LegacyEmoji, {
+    props: {
+        emojiView: Object,
+    },
+    template: 'mail.LegacyEmoji',
+});
+
+registerMessagingComponent(LegacyEmoji);
diff --git a/addons/mail/static/src/components/legacy_emoji/legacy_emoji.xml b/addons/mail/static/src/components/legacy_emoji/legacy_emoji.xml
new file mode 100644
index 00000000000..834e65f281e
--- /dev/null
+++ b/addons/mail/static/src/components/legacy_emoji/legacy_emoji.xml
@@ -0,0 +1,10 @@
+<?xml version="1.0" encoding="UTF-8"?>
+<templates xml:space="preserve">
+
+    <t t-name="mail.LegacyEmoji" owl="1">
+        <span class="o_LegacyEmoji p-1 fs-5 o_cursor_pointer" t-on-click="props.emojiView.emojiListView.onClickEmoji" t-att-title="props.emojiView.emoji.description" t-att-data-source="props.emojiView.emoji.sources[0]" t-att-data-unicode="props.emojiView.emoji.unicode" t-attf-class="{{ className }}" t-ref="root">
+            <t t-esc="props.emojiView.emoji.unicode"/>
+        </span>
+    </t>
+
+</templates>
diff --git a/addons/mail/static/src/components/legacy_emoji_list/legacy_emoji_list.js b/addons/mail/static/src/components/legacy_emoji_list/legacy_emoji_list.js
new file mode 100644
index 00000000000..940bffbe885
--- /dev/null
+++ b/addons/mail/static/src/components/legacy_emoji_list/legacy_emoji_list.js
@@ -0,0 +1,57 @@
+/** @odoo-module **/
+
+import { useUpdate } from '@mail/component_hooks/use_update';
+import { registerMessagingComponent } from '@mail/utils/messaging_component';
+import { LegacyComponent } from '@web/legacy/legacy_component';
+
+export class LegacyEmojiList extends LegacyComponent {
+
+    /**
+     * @override
+     */
+    setup() {
+        super.setup();
+        useUpdate({ func: () => this._update() });
+    }
+
+    get emojiListView() {
+        return this.props.record;
+    }
+
+    //--------------------------------------------------------------------------
+    // Private
+    //--------------------------------------------------------------------------
+
+    /**
+     * @private
+     */
+    _update() {
+        this.trigger('o-popover-compute');
+    }
+
+    //--------------------------------------------------------------------------
+    // Public
+    //--------------------------------------------------------------------------
+
+    close() {
+        this.trigger('o-popover-close');
+    }
+
+    /**
+     * Returns whether the given node is self or a children of self.
+     *
+     * @param {Node} node
+     * @returns {boolean}
+     */
+    contains(node) {
+        return Boolean(this.root.el && this.root.el.contains(node));
+    }
+
+}
+
+Object.assign(LegacyEmojiList, {
+    props: { record: Object },
+    template: 'mail.LegacyEmojiList',
+});
+
+registerMessagingComponent(LegacyEmojiList);
diff --git a/addons/mail/static/src/components/legacy_emoji_list/legacy_emoji_list.scss b/addons/mail/static/src/components/legacy_emoji_list/legacy_emoji_list.scss
new file mode 100644
index 00000000000..f6b15ac980f
--- /dev/null
+++ b/addons/mail/static/src/components/legacy_emoji_list/legacy_emoji_list.scss
@@ -0,0 +1,9 @@
+// ------------------------------------------------------------------
+// Layout
+// ------------------------------------------------------------------
+
+.o_LegacyEmojiList {
+    // Could be replaced by "d-grid" class after migration to BS5
+    display: grid;
+    grid-template-columns: repeat(9, 1fr);
+}
diff --git a/addons/mail/static/src/components/legacy_emoji_list/legacy_emoji_list.xml b/addons/mail/static/src/components/legacy_emoji_list/legacy_emoji_list.xml
new file mode 100644
index 00000000000..935b446caf1
--- /dev/null
+++ b/addons/mail/static/src/components/legacy_emoji_list/legacy_emoji_list.xml
@@ -0,0 +1,14 @@
+<?xml version="1.0" encoding="UTF-8"?>
+<templates xml:space="preserve">
+
+    <t t-name="mail.LegacyEmojiList" owl="1">
+        <div class="o_LegacyEmojiList px-1" t-attf-class="{{ className }}" t-ref="root">
+            <t t-if="emojiListView">
+                <t t-foreach="emojiListView.emojiViews" t-as="emojiView" t-key="emojiView.localId">
+                    <LegacyEmoji emojiView="emojiView"/>
+                </t>
+            </t>
+        </div>
+    </t>
+
+</templates>