[REF] mail, *: refactor messaging with OWL

This commit is a significant rewriting of client-side discuss, chatter,
chat window, and messaging menu using OWL. The behavior should be broadly
the same, with some slight functional changes here and there.

From a technical standpoint, the code of messaging is mainly organized in 2
main groups of modules:

- models, which are logical entities that depict the client-side state of
  messaging as a whole.
- components, which are in charge of displaying information from models.

This refactoring also introduces new JS guidelines regarding folder structure
(/static) and naming rules for JS modules.

Community PR: https://github.com/odoo/odoo/pull/39023
Enterprise PR: https://github.com/odoo/enterprise/pull/6249

Task-1914207

This PR is a collaborative work by Alexandre, Julien, Sébastien and Xavier,
with the precious help of Lucas to speed it up towards the end.

closes odoo/odoo#39023

Related: odoo/enterprise#6249
Signed-off-by: Alexandre Kühn (aku) <aku@odoo.com>
Co-authored-by: Alexandre Kühn <aku@odoo.com>
Co-authored-by: Julien Giannone <jgi@odoo.com>
Co-authored-by: Lucas Perais <lpe@odoo.com>
Co-authored-by: Sébastien Theys <seb@odoo.com>
Co-authored-by: Xavier Dubuc <xdu@odoo.com>

1 files changed, 3 insertions, 164 deletions

diff --git a/addons/mail/static/src/scss/thread.scss b/addons/mail/static/src/scss/thread.scss
index 2fc55c7d637..17c0ae72655 100644
--- a/addons/mail/static/src/scss/thread.scss
+++ b/addons/mail/static/src/scss/thread.scss
@@ -1,32 +1,4 @@
-.o_mail_thread_loading {
-    display: flex;
-    align-items: center;
-    justify-content: center;
-}
-
-.o_mail_thread_loading_icon {
-    margin-right: 5px;
-}
-
-.o_mail_thread, .o_mail_activity {
-    .o_thread_show_more {
-        text-align: center;
-    }
-
-    .o_mail_thread_content {
-        display: flex;
-        flex-direction: column;
-        min-height: 100%;
-    }
-
-    .o_thread_bottom_free_space {
-        height: 15px;
-    }
-
-    .o_thread_tooltip_container {
-        display: inline;
-        position: relative;
-    }
+.o_mail_activity {
 
     .o_thread_date_separator {
         margin-top: 15px;
@@ -48,30 +20,11 @@
         }
     }
 
-    .o_thread_new_messages_separator {
-        margin-bottom: 15px;
-        border-bottom: solid lighten($o-brand-odoo, 15%) 1px;
-        text-align: right;
-        .o_thread_separator_label {
-            position: relative;
-            top: 8px;
-            padding: 0 10px;
-            background: white;
-            color: lighten($o-brand-odoo, 15%);
-            font-size: smaller;
-        }
-    }
-
     .o_thread_message {
         display: flex;
         padding: 4px $o-horizontal-padding;
         margin-bottom: 0px;
 
-        &.o_mail_not_discussion {
-            background-color: rgba(gray('300'), 0.5);
-            border-bottom: 1px solid gray('400');
-        }
-
         .o_thread_message_sidebar {
             flex: 0 0 $o-mail-thread-avatar-size;
             margin-right: 10px;
@@ -106,37 +59,13 @@
                 height: $o-mail-thread-avatar-size;
                 object-fit: cover;
             }
-            .o_thread_message_side_date {
-                display: none;
-                margin-left: -5px;
-            }
-            .o_thread_message_star {
-                display: none;
-                margin-right: -5px;
-            }
-
-            .o_thread_message_side_date {
-                opacity: 0;
-            }
-
-            .o_mail_thread_message_seen_icon:not(.o_all_seen) {
-                opacity: $o-mail-thread-icon-opacity*0.5;
-            }
         }
         .o_thread_icon {
             cursor: pointer;
             opacity: 0;
-            &.fa-star {
-                opacity: $o-mail-thread-icon-opacity;
-                color: gold;
-            }
         }
 
-        &:hover, &.o_thread_selected_message {
-            .o_thread_message_side_date {
-                display: inline-block;
-                opacity: $o-mail-thread-side-date-opacity;
-            }
+        &:hover {
             .o_thread_icon {
                 display: inline-block;
                 opacity: $o-mail-thread-icon-opacity;
@@ -144,11 +73,6 @@
                     opacity: 1;
                 }
             }
-            .o_thread_message_sidebar {
-                .o_mail_thread_message_seen_icon {
-                    display: none;
-                }
-            }
         }
 
         .o_mail_redirect {
@@ -210,29 +134,9 @@
                 }
             }
 
-            .o_thread_message_star, .o_thread_message_needaction, .o_thread_message_reply, .o_thread_message_notification {
+            .o_thread_message_needaction, .o_thread_message_reply {
                 padding: 4px;
             }
-
-            .o_thread_message_notification {
-                color: grey;
-                &.o_thread_message_notification_error {
-                    color: red;
-                    opacity: 1;
-                    cursor: pointer;
-                }
-            }
-
-            .o_attachments_list, .o_attachments_previews {
-                &:last-child {
-                    margin-bottom: $grid-gutter-width;
-                }
-            }
-
-            .o_thread_tooltip_container {
-                display: inline;
-                position: relative;
-            }
         }
     }
     .o_thread_title {
@@ -268,68 +172,3 @@
         opacity: $o-mail-thread-icon-opacity;
     }
 }
-
-// ------------------------------------------------------------------
-// Thread typing icon: shared between discuss and chat windows
-// ------------------------------------------------------------------
-
-.o_mail_thread_typing_icon {
-    position: relative;
-    text-align: center;
-    margin-left: auto;
-    margin-right: auto;
-
-    .o_mail_thread_typing_icon_dot {
-        display: inline-block;
-        width: 3px;
-        height: 3px;
-        border-radius: 50%;
-        background: gray('800');
-        animation: o_mail_thread_typing_icon_dot 1.5s linear infinite;
-
-        &:nth-child(2) {
-            animation-delay: -1.35s;
-        }
-
-        &:nth-child(3) {
-            animation-delay: -1.2s;
-        }
-    }
-}
-
-@keyframes o_mail_thread_typing_icon_dot {
-    0%, 40%, 100% {
-        transform: initial;
-    }
-    20% {
-        transform: translateY(-5px);
-    }
-}
-
-// ------------------------------------------------------------------
-// Thread seen icon: shared between discuss and chat windows
-// ------------------------------------------------------------------
-
-.o_mail_thread_message_seen_icon {
-    position: relative;
-    opacity: 0.6;
-
-    &.o_all_seen {
-        color: $o-enterprise-color;
-    }
-
-    &:hover {
-        cursor: pointer;
-        opacity: 0.8;
-    }
-
-    .fa-check:nth-child(1) {
-        padding-left: 3px;
-    }
-
-    .fa-check:nth-child(2) {
-        position: absolute;
-        top: -1px;
-        left: 0px;
-    }
-}